UX / UI のデザインに強いWebシステムの開発と、BtoB Webマーケを支援するWeb制作を提供する
N's Creates (エヌズクリエイツ) 株式会社 UIコーダー 齋藤 (@31mskz10) です。

デザインにしてもコーディングにしても、結果は同じでも過程が異なる方法が複数ある場合がよくあります。

「とりあえず結果が同じなのだからどの方法を使っても良い」ではなく、なぜその方法を使ったのか説明できることが大切なのではないかなと、ふと感じました。

デザインにおける「画像のマスク」

例えば、デザインにおける「画像のマスク」は、目的は同じでも複数のやり方があります。
主要なデザインツールであるFigmaでは、画像のマスク方法が複数あります。

• 図形の塗りとして画像を指定する方法
• マスクオブジェクトを作成する方法

マスクオブジェクトの作成方法も複数あり、ツールを使う方法とメニューから選択する方法などがあります。

コーディングは選択の連続

コーディングはさらに選択肢が多く感じます。
見た目は同じでも、実装方法によってメンテナンス性が変わってきたり、レスポンシブ対応のしやすさや、アクセシビリティ的に良い悪いもあります。

過去に『見た目が同じでも使い勝手がまるで違う！コーダーとしてコーディングで意識していること』という記事を書いたのですが、まさに同じ結果（見た目）でも、方法によって善い悪いが変わってきます。

「何故その選択肢を採用したのか？」を意識する

• ググって1番上に出てきたからそれにしました
• この方法がいいって記事に書いてあったからそれにしました

これで済ませてしまうのはもったいないですし、なぜその方法が良いのか必ず理由があるはずです。

• 少ない作業時間で実現できる
• ショートカットキーだけで実現できる
• あとからの修正作業がラクになる

このように、今回達成したい目的は何なのか考え、その上でどれが1番適しているのか選択できるようになると、さらに質の高い制作ができるようになるのではないかと感じました。

UX / UI のデザインに強いWebシステムの開発と、BtoB Webマーケを支援するWeb制作を提供する
N's Creates 株式会社は、神戸三宮オフィスまで週１出社（それ以外はリモートワーク）できる「デザイナー」「エンジニア」を募集しています。

興味のある方は、カジュアル面談しますので気軽にお問い合わせください！

saito

高校時代にIT・Web業界に興味を抱き、神戸電子専門学校で2年間デザインやWeb実装について知識を得た後、新卒でN′sCreates株式会社のデザイナーとして入社。ミッションである｢解で快を創る｣を実現するべく日々の業務に向き合い、より良い提案を心掛けています。また、学生時代からWeb制作に関わる方のためのセミナーイベント「CSS Nite in KOBE」のスタッフとして業界の最先端に触れ、自主的に学習してきた知識やスキルを武器に、常に成長を続けている。