デザインシステムにおけるデザインの「なぜ」について思うこと

Advertisement

よくあるデザインシステムやガイドラインだと、デザインの「なに」が説明されていることはあっても、「なぜ」の部分が解説されているのは稀だと思います。パターンライブラリも使い方しか記載していないことが多いですよね。デザインシステムを使ってウェブサイトを組み立てるだけなら「なぜ」を理解する必要がない場合もありますけど、より効果的に使いこなしたい場合、成果を上げたい場合は、やはり、この「なぜ」の部分とか理念やビジョンを深く理解していないとなかなか難しくなります。

もちろん、デザインの経験があれば、ある程度は予測ができるので「言わずもがな」的なところはありますけど。勘に頼ることになるので「共通言語」としては不完全なものになります。デザインシステムを活用して、より高度なユーザとのコミュニケーションを試みる場合、制作チーム内での「なぜ」の共通言語化は必須だと考えています。

本文のデザインにだってちゃんと意味がある

たとえば、すごくシンプルな例をあげると、ページタイトルのフォントサイズがある特定のサイズや色になっているのにはちゃんと理由があるんですよね。ページ内でのジャンプ率を高めてユーザがページを訪問した際に瞬時に内容を把握してもらえるようにするとか。色やタイプフェイスでブランドが醸し出す雰囲気を印象付けるとか。ウェブサイト上のどのページがランディングページになる昨今、検索エンジンから直接たどり着いても最低限の機能が果たせるようにデザインを工夫したりするわけです。

さらに、本文に使うタイプフェイスやフォントサイズ、色や行間のデザインにだって一つ一つに理由がありす。僕が運営を担当しているのは大学のウェブサイトですが、本文のデザインを考える際にはアカデミックな雰囲気を醸し出すと同時にどんなデバイスでアクセスしても読みやすいサイズになるように(また、そうすることで在学生や将来学生になるユーザーを中心に考えているという思いを込めて)こだわりを盛り込んだつもりです。

背景も本文のフォントとあわせて教科書とか学術的な文書を思い起こさせるデザインにしています。また、他のサイトであまり見られない特徴的なデザインや色使いを採用することでサブリミナルにでも心のどこかにひっかかりを作れればというこだわりもあったりします。

なぜデザインの理由を知るべきなのか

デザインシステムのこういったデザインの「なぜ」を知ったうえでページを制作するのとそうでないのとでは、中長期での効果や影響を考えると、大きな差を生むと感じています。この「なぜ」を理解した上でページを作ることで、デザインやレイアウトに目に見えない深みを持たせられると思うんですよね。目に見えないだけに説明が難しいんですけど、技術のおかげで製品やサービスの均質化が進んだ今、こういったところが差別化のための大きな武器になると信じています。

デザインの「なぜ」の部分をどこまで明文化するかは組織やチームの成熟度によるところもあるので判断に悩むところですが、「考え方」には必ずその考えに至った「なぜ」という理由があり、考えのもととなる目的があって達成すべき目標があるはずです。デザインシステムを構築するということは、目的があり、目標があり、デザインが組み上げられた理由があるはずです。ここら辺の共通理解を組織全体で持てている企業は、競合に対して、かなり優位に立てる気がしています。

About the author

Rriverのステッカーが貼られたMacBookの向こうにいる自分のMemojiの似顔絵

「明日のウェブ制作に役立つアイディア」をテーマにこのブログを書いています。アメリカの大学を卒業後、ボストン近郊のウェブ制作会社に勤務。帰国後、東京のウェブ制作会社に勤務した後、ウェブ担当者として日英バイリンガルのサイト運営に携わる。詳しくはこちら

ウェブ制作・ディレクション、ビデオを含むコンテンツ制作のお手伝い、執筆・翻訳のご依頼など、お気軽にご相談ください。いずれも日本語と英語で対応可能です。まずは、Mastodon @rriver@vivaldi.net Twitter @rriver 、またはFacebook までご連絡ください。