デザイナー以外の人たちがデザインに対して感じるものは、私がワインに対して感じるものとよく似ています。私はワインの良し悪ししかわかりません。アンデス地方で作られた$300のマルベックと、店で売られている$30のワインの違いを語ることができません。しかし、あまりにワインの味がひどければ、たとえタダでも飲めないほど不味いと伝えることくらいはできます。
デザインでもワインと同じ事が言えます。批評するトレーニングをしていない人はいつも、「これはいいね」「これは違う」と言います。当然色についてもコメントするでしょう。デザインにもワインのように、たくさんのテイストや好み、感覚があり、それらは全て主観的なものです。
では素晴らしいビジュアルデザインを見分けるときはどうでしょう？ どうやって素晴らしい点を見つけますか？ どのように批評するでしょうか？ 幸いな事に、素晴らしいビジュアルデザインをつくるための普遍的な原則が存在します。
素晴らしいビジュアルデザインを見分けるためには、デザインがただ美しいだけではないことを知る必要があります。ここではデザイナー以外の人が、素晴らしいビジュアルデザインを説明することを助ける５つの方法を共有します。
1. 注目点がある
素晴らしいビジュアルデザインは、魅力的な物語のように多くの手法を使って作られています。習得するまでは、デザインはGame of Thrones（編注：ジョージ・R・R・マーティン著のファンタジー小説シリーズ『氷と炎の歌』を原作としたテレビドラマシリーズ）のように複雑なものだと考えましょう。このドラマでは、注目点を作り出すための全体に共通する設定があります。それは「冬がやってきて、全ての人は必ず死ぬ」という設定です。
ドラマの物語が広がる一方で、重点を置いたメインの話もあります。登場キャラクターは物語中で定期的に殺され、彼らの身体的特徴や名前はあまりにも似通っていますが、主要な登場キャラクターは特別で他とは異なっています。例えば、プラチナブロンド、ドラゴン、フィンダリングドワーフの男などがそうです。
参考元: HBO
素晴らしいビジュアルデザインも物語と同じような手順を踏みます。デザインにも注目点があります。デザインの中で、他に何も覚えていなくても、それだけは覚えているように意図されたものです。注目点は視覚的に目立たせることによって他と区別されます。
注目点はビジュアルウエイトによって見分けることができます。ビジュアルウエイトはデザイン要素の形やサイズ、色、深さ、テクスチャ、密度、彩度、向きや余白の操作で作ることができます。
まだ新しい作りたてのデザインをレビューするときには、目立つ部分を探してみてください。どう他と差別化しているのか観察してください。ユーザーとのコミュニケーションレベルでビジュアルを目立たせる価値があるのか、判断してください。ユーザーがプロダクトにひとつのイメージを持っただけでWebサイトを離れるとすれば、そのイメージはどういったものでしょうか？
2. ビジュアルヒエラルキーがある
素晴らしいビジュアルデザインが、ディテールを伝えるために要素のヒエラルキーを持っているのは驚くことではありません。ビジュアルヒエラルキーはデザイン要素の重要性を順位づけるものです。これを実現するためには、重要な要素は他のものよりも目立っていなければいけません。
例えば、この２つのモバイルアプリをみてみましょう。
デザインをみるだけで、アプリがそれぞれどのような意味を持つのか理解することができます。
左側はプロフィール画像へデザインの重点をおいており、マッチングアプリのようです。右側はデザインの好みについての情報に重点がおかれており、デザイナー向けのSNSアプリのようです。画面上がどうデザインされているかによって、その画面の目的を含めたすべてを説明することができるのです。
素晴らしいビジュアルデザインはコンテクストを示すために要素を順位づけします。ビジュアルデザインの順位づけは、デザインの要素を人々が自然に感じることや彼らの身の回りのものと関連づけることで示します。素晴らしいビジュアルデザインでは、よく観察しなくてもビジュアルヒエラルキーを知ることができます。
素晴らしいビジュアルデザインを見分けるためには、ビジュアルヒエラルキーをよく観察することです。デザインをレビューする時、一歩さがってよく見てみてください。その際、続く質問を心に留めてください。
- どの要素が目立っているか？
- 重要な要素は他と比べても十分に強調されているか？
- デザインに含まれる要素は多すぎるか？
- 要素の優先順位としては何が次に来るか？
- デザインが何を意味するものかすぐに説明することができるか？
- デザインの持つ意味はハッキリしているか？ それとも曖昧か？
3. 目的に適した感情が生じる
感情はデザインにおいて大きな役割を果たします。デザインはどうユーザーの気分に影響するでしょうか。素晴らしいビジュアルデザインは、どのようにユーザーの感情を目的に適したものに変えるのでしょうか。
こちらにある、仮想の会社Active CatsのWebサイトの例をみてください。
ここでは、床の上に寝転がる猫の背景写真がデザインの多くを占めています。たとえこのページで、ビジネスを成功させるためのさらなる努力を主張していたとしても、デザインからくる印象は信頼に繋がりません。このサイトからはリラックスや、曖昧さといった印象を受けます。ここではビジネスのためにさらに努力したいとの欲求は生まれません。
他の例を見てみましょう。ブルー・ファウンテン・メディアでは、ネガティブな感情をポジティブなものに変えることができる可能性を示しています。404エラーページでは「%&/%#∞÷!」のようなものが典型的です。これはただのエラーであるためユーザーをイライラさせます。しかし彼らは、以下のような創造的な404ページによってエラーページをWebサイト上の素晴らしい経験に変えました。
デザインは感情的なものであり、それを否定するものはありません。また感情は、製品の成功を決定する上で非常に重要な役割を果たします。レビューをするとき、ユーザーがデザインをどう感じるのか、あなた自身がデザインから感じるものを通してイメージしてみてください。評価プロセスよりも、あなた自身の感情に焦点を当ててください。また何人かにデザインを見せてどう感じるかを尋ねてください。
4. 解釈しなくても理解できる
デザインはアートではありません。デザインのルーツはアートの中にも見つけることができますが、デザインがピカソの絵を解釈しようとするときと同じような感情をユーザーに抱かせるのであれば、そのデザインは失敗です。
素晴らしいビジュアルデザインは、解釈するものではなく理解するものです。デザインはアートによくある論争を誘発するものではなく、問題を解決するためのものです。ルーブル作品を見るようにデザインを見ているのであれば、考え直してください。
デザイン中の要素は区別されているのか、またそれが簡単に理解できる方法で示されているのかを確認してください。
- 余白をうまく使っているか？
- それとも雑多にみえるか？
- バランスが良いか？
- シンメトリーになっているか？
- もしアシンメトリーなデザインならば、それはわかりにくいか？
- どのような構成のデザインか？
デザイナーに、デザインが理解できないと伝えることを恐れないでください。素晴らしいデザイナーはいつも、見た目や感じ方だけでなく、デザインを使ってどう情報を伝えるかも考えています。
5. 目に優しい
これらの画像を見て、あなたはどう感じるでしょうか。
ブラウザを閉じれば視覚的ダメージを受けないため、目に優しくないデザインでも問題ないとは思わないでください。素晴らしいビジュアルデザインを作るためには、簡単に理解でき、コミュニケーションの中で効果的で、美しいことが必要です。それはユーザーの目にも優しいものです。
色と書体の組み合わせの微妙な違いなどが、雰囲気を大きく変えることを心に留めておくのがよいでしょう。デザイナーは、ブランドのパーソナリティーに合った色を使用します。また２つのフォントを使うことは多くのデザイナーにとってよくある選択です。たとえば、ひとつはセリフ体、もうひとつはサンセリフ体のような形です。
デザイナーはいつも上記の例のような目に優しくないものを作っているわけではありません。素晴らしいビジュアルデザイナーは、どうやって色や字体を組み合わせて、コンテンツをストレスなく快適に見せるかを知っています。
- デザイン内でのテキストと色の間のコントラストの働きはどうか？
- テキストと色とはデザイン内で両立しているか？
- テキストは読みやすくなっているか？
- ２つまたはそれ以上の種類の字体の間で、デザイン上の矛盾はあるか？
- 色や字体は製品やブランドパーソナリティに適しているか
