ビジュアルでもできるデザイン批評

好き !＝ 良い・正しい

デザイン批評は、数年前から扱っているトピックし、講演経験も何度かしています。デザイン学校へ行った方であれば批評の経験はしていると思いますが、なかなか機会がないのが現実。ビジネスとの関わりが密接になればなるほど、デザインについてデザイナー以外と話す機会が増えていきます。様々なデザインの手法を学んだとしても、デザインについて会話するスキルがなければ意図・目的を伝えることができません。

調査に基づいて論理的に対話ができれば理想的ですが、そう簡単にいかないのが批評の難しいところ。私たちは論理的に考えようとしますが、感情的に物事を捉える生き物です。どうしても「好き」「つまらない」といったリアクションを即座にしてしまいがちですが、「好き ＝ 良い・正しい」とは言い切れません。つまり、自分の好みではないものでも、プロジェクトの目的を達成には正しい判断といえる場合があります。

これはビジュアルデザインの批評をする際、特に重要になります。ビジュアルは好き嫌いといったリアクションになりやすいですし、調査をして答えを導き出すのが難しいです。デザイン批評も設計や画面遷移まではうまくいったとしても、ビジュアルでつまずくことがあります。

ビジュアルは、テイストやセンスで話が終わってしまうことは少なくありません。確かにそういった部分はありますが、批評はデザインの改善のためだけにあるのでなく、教育のためにもあります。デザインの見方を周りに伝えていくためにも「これダメだから直して」「センスが悪い」以上の会話が必要です。コラボレーションをするはずのデザインの会話が、いつの間にか指示をする場になってしまうと意味がありません。

感情的なリアクションによってデザインが間違った方向へ進まないためにも、ビジュアルにもデザイン批評を取り込む必要があります。

デザインの基礎を分解する

ビジュアルをみて感じる『違和感』のようなものは、大抵の場合デザインの以下の項目に何かしら課題を抱えている場合があります。「好き」「嫌い」という声も、こうした項目に何かしら課題を抱えていることがあるので、感情的なリアクションを深堀するときのヒントになります。

要素

デザインだけではありませんが、視覚的に見えるモノは、線、形状、色、空間、質感によって構成されています。線は要素を繋げる役割もあれば、太さによって分断する力ももっています。線を組み合わせることで形状が生まれ、色や質感によって感情的に訴える力が増幅することがあります。余白のような要素と要素の間にある空間はデザインに重要な意味をもたらします。

原則

原則を守ること。そしてあえて破ること。いずれの場合でも視覚的に見えるものがどのような原則によって成り立っているのか知る必要があります。対象になるようにするのがバランスと呼ぶこともありますが、それをしないことで全体の調和を実現することがあります。大きさの対比やコントラストによって平面の画面に立体感（奥行き）を表現することができます。

いずれも重要なデザインの原則ですが、UI デザインにおいて特に重要なのがパターン。似たような要素を繰り返し使うことで、構造化されている、学習したことを他で使えることを伝えることができます。4月にワークショップを開催しましたが、この原則が守られていない Web サイトやアプリは少なくありません。

構成

原則に基づいて要素を配置するだけでなく、全体の構成が考慮されていないものは、ぎこちない見た目になりがちです。Web サイトやアプリののような明確な枠がない存在しない可変の世界では、全体構成を考えるのが難しいことがあるものの、人の視点がどのように動くのかを理解して情報を構成をすることは可能です。

デジタルならではの原則

上記の項目はデザイン全般だけでなくアートにも関係していますが、Web サイトやアプリに特化した原則もあります。Web・アプリは若い業界ではあるものの、今までの経験や実績に基づいた原則は幾つかあります。

例えば、ニールセンのユーザビリティ10原則（日本語訳）は最低限の使いやすさを保持するために守っておきたい項目が揃っています。ビジュアルデザインに関わるものもあり、例えば「一貫性と標準化を保持する」はパターンと同じことを意味しています。他にも「システム状態の視認性を高める」のような、デジタルプロダクト特有のビジュアルデザイン課題も含まれています。

アプリであれば、Google の Material Design、Apple の iOS Human Interface Guideline は外せません。ビジュアルに関わるガイドラインもたくさん掲載されているので、アプリのビジュアルで意見が分かれたときもガイドラインを見れば解決することは少なくありません。

こうした外部資料に頼るだけでなく、社内で「私たちにとっての良い」をガイドラインとして明文化することも必要です。ひとりのアートディレクターによってすべての成果物の評価できるのであれば良いですが、常に変化と成長を続けるデジタルプロダクトでは限界があります。外注をしなければいけないこともありますし、他の誰かが評価することもあります。ひとりの人間の感性に偏ると、プロジェクトにおける良い・悪いではなく、好き・嫌いになる可能性もあります。

ビジュアルデザインを評価するという問題解決のためのスタイルガイドが必要になります。様々な UI 要素を揃えたライブラリを作る最初から作る必要はありません。ロゴ、色、タイポグラフィといったどの媒体でも必要とされる要素だけでも良いので明文化を始めていきましょう。

まとめ

デザイン批評は簡単なことではありませんが、ビジュアルという感性に強く響く部分はさらに難しいことがあります。センスという言葉で片付けてしまいがちですが、それでは本当にプロジェクトにとって良い方向に向かっているのか判断が難しくなります。ビジュアルデザインもひとつひとつ分解していくと、「かっこ悪い」という感情的な言葉ではなく、「ここのバランスが崩れている」といった仕組みに関わる言葉になっていきます。分解していくことで、デザインの課題発見がしやすくなるだけでなく、批評を聞いている周りの人もデザインについて知る機会になります。

6月18日、7月16日に開催される CSS Nite LP46「ビジュアル・ドリブンのデザイン」では、デザイン批評の基礎についてお話しします。また、私が前書きを担当した「みんなではじめるデザイン批評」でも同トピックについて分かりやすく解説されているので興味がある方はぜひご覧ください。