C. システム色の強いデザインをする場合(実制作から知る Webデザインのワークフロー)

Apr 29 2015

この記事は、2015年1月にとある勉強会で1時間ほど発表したエンジニアの方向けのデザイン概論について解説した記事です。

システム色の強いデザインをするときに気をつけていることについて解説しています。

機能性と見た目のバランス

最後にシステム色が強いデザインをする際に気をつけていることをお話しします。
コーディングの話しも混じります。
基本的に機能性を上げるモジュール化に力を注ぎつつ、デザインの見栄えを左右するところはしっかり抑えるようにしています。

何度かお話しさせてもらったモジュール化は、デザイン面で「繰り返し」を生むだけでなく、デザインの要素も規則化されるので、システムに組み込みやすくなる場合が多いです。
この規則化に管理画面やCMSなどシステム色の強いデザインを行う場合は重点的に行います。

また、システム色の強い案件は、急な対応が必要になる場合が多いので、納品後にデザイナーがいなくても制作が進む状態にしておくためにもモジュール化は有効な手段だと思います。

例えば、あまり画像フォントを使わない、天地左右の隙間・フォントサイズ、 使用色・ボタンなどをそれぞれ3種〜5種程度に絞り込むなどです。 コーディングに踏み込みますが、こちらはSassの変数で極力管理できるデザインにします。

また、使用する要素の予測が立て、UIパーツとして使われそうなものを先に見越してデザインしてしまいます。

最後に矛盾しますが、デザインの雰囲気のため、譲らない部分を明快にしておきます。
例えば、ヘッダーやサイドナビなどは、デザインの見栄えを追求して、他は更新性を優先する等です。

以上になります。

目次