デザインの引き出しを増やす『分析・分解』のやり方（Vol.1）
こんにちは。koshiです。
超小型新人Webデザイナーです。
デザイン力を上げるために
『デザインの分析をしよう！』
って、よく聞きますよね。
でも、『分析ってどうやんの？』
となりませんか？
分析方法を色々調べてみましたが、どこか抽象的で、ふわっとしてる。
見様見真似で分析をしてみても、
（そもそも分析できてるのか？）
（感想文になっていないか？）
という想いでいっぱいでした。
そんな私が、色々と調べて、現時点で
『このやり方だ！！！』
と思う方法を、具体的に誰でもわかるように、実例を出しながら書いていきます。
少しでも為になれば幸いです。
デザインの分析の流れ
まずは結論。流れは以下です。
①.「客観的に」「徹底的に」言葉で書き出す
②.①で出た言葉を「主観的に」見て仮説を立てる
③.②立てた仮説を検証する
④.②→③を、納得いくまでループする
というやり方です。
それでは、①から詳しく書いていきます。
①デザインを言葉にする
まずは、とにかく見たまんまを全て、「客観的」に言葉にしていきます。
今回はこちらを参考に分析していきます。
※バナーライブラリさんで、このバナーは【にぎやか・ポップ】と【レトロ】に分類されていたので、その前提で分析を進めます。
背景は放射状になっている。真ん中に大きい文字、下には情報と日付がある。青(花浅葱)とグレーを使っている。文字には、ぼやかしていない、はっきりしたドロップシャドウを付けている。色はくすんだ赤。紅葉色に近い。色は全てくすんでいて落ち着いた色を使っている。フォントはかわいい系のゴシックで、少し滲んでいる。文字は数字を大き目にしている。Twitterでつぶやこうのところは、アーチ上になっている。ガラケー、ルーズソックス、レコードなど、懐かしいもののイラストがランダムに配置されている。イラストは放射線の中心を向いて配置されているものが多い。右下には「驚いてお皿を割る」という少し古い演出を、古き良きお母さん像のイラストで配置している。お母さんの後ろには星型のあしらいがある。星の線も少しゆがんで（滲んで）いる。
こんな感じです。(まだ解像度が低くすみません)
とにかく、「見たまんま」をできる限り言葉にします。なんて言うかわからないところも、できる限り調べて言葉にします。
ここで大事なのは「客観的に」言葉にすることです。主観が入ると、感想や憶測が入り混じってよく分からなくなります。
『〇〇が〇〇っぽさが出ていると思う』とか、
『〇〇があってかわいい』とかを書くと感想文になってしまいます。
なので、まずはデザインを第三者に言葉で説明するつもりで書き連ねてください。
そうすることで、次の「仮説を立てる」がやりやすくなります。
②デザインの仮説を立てる
客観的に言葉にしたものに対して「主観的に」仮説を立てます。
以下は仮設の例です。
くすんだ色があるからレトロ・懐かしさを感じられるのでは？
文字のにじみもレトロ感に関係あるのでは？
画像がバラバラに配置されているのはにぎやかさの演出では？
画像が放射線の中心の向きになっているから、ばらばらでも統一感が出るのでは？
ドロップシャドウをぼやかさずに使うのはポップ系でよく見かけるから、ポップさを感じるのでは？
こんな感じです。
客観的に書き起こした言葉に対して、思いっきり「主観的に」仮説を立ててみてください。間違えても全然いいです。ここ、めちゃくちゃ楽しいです。
仮説を立てると、合っているか検証したくなりますよね？
そうです。次に、仮説の検証に進みます。
③立てた仮説を検証する
②で立てた仮説を検証します。
検証の仕方は色々あるかと思いますが、私は主に以下の3つの方法で検証しています。
・とにかくググってみる
・同じテイストに分類されてる他デザインを見る
・元のデザインを変えてみる
検証すると、また仮説が出て、検証して・・・を繰り返す形になります。
そのループをすると、どこかで納得するタイミングがあります。そこで初めて「自分の引き出し」になります！
※納得できないと覚えられないめんどくさい性格なんです。
それでは、検証結果を書いていきます。
仮説1:くすんだ色があるからレトロ・懐かしさを感じられるのでは？
↓
他のデザインを見てもくすんだ色が多い。だからレトロ感を出すにはくすんだ色を使うといいかも。でも、なんでくすんだ色なんだろう。
↓
仮説『昔のポスターがそういう配色だったのかな？』
↓
昔に流行った配色っぽい？てことは、レトロ感を出すには配色が大事なんだな。
↓
『レトロ感を出す時は配色が大事』→デザインゲット！
仮説2:文字のにじみもレトロ感に関係あるのでは？
↓
他のデザインでは見つけられなかった。おそらく、フォントを変えてもレトロ感は変わらないかも。
↓
仮説『活版印刷のにじみに似て、古い感じに見える？』
↓
ググってみると、そうっぽい。でも、このデザインは滲みのないフォントに変えてもレトロ感は消えない。
↓
『滲みでレトロ感を増すことはできるけど、必須ではない？』→保留。他のデザイン見るときに注視する。
仮説3:画像がバラバラに配置されているのはにぎやかさの演出では？
↓
これは、他のデザインを見てもそうだった。
『にぎやかさを出すには画像をバラバラに配置するのは使えそうだ』→デザインゲット！
仮説4:画像が放射線の中心の向きになっているから、ばらばらでも統一感が出るのでは？
↓
実際にやってみた。確かに、『放射状の時は、中心に向けることを意識した方が良さそうだ。』→デザインゲット！
仮説5:ドロップシャドウをぼやかさずに使うのはポップ系でよく見かけるから、ポップさを感じるのでは？
↓
これも、他のデザインを見てもそうだった。
『ポップさを出すにはドロップシャドウを透明度0で使うといいかも』→デザインゲット！
こんな感じです。
いかがでしょうか？
納得がいかないと覚えられない私は、このやり方がとてもしっくり来ました。
仮説は深追いすると大変なので、ある程度のところで止めました。
他のデザインを分析する際に、点と点が繋がることもあります。
なので、深追いしすぎず、とにかく沢山見ることが大事だと思います。
※時間があれば深い追いした方がいいと思います。
デザインの分解とストックについて
正直、ここまで分析はできても、「自分の中にストックされている気がしない」と思いませんか？
私は思いました。
なので、デザインを分解して、物理的にストックして、いつでも引き出せるようにする方法を考えました。
これはまた別記事（vol.2）でまとめようと思います。
⇣vol.2書きました。
アウトプットについて
検証しただけだと、まだ実際に使うことは出来ないかと思います。
検証結果をもとに、何かを作ってみて、初めて自分のものになります。
幸いなことに私はデザイナーとして働けているので、強制的にアウトプットの機会があります。
なので、デザイン勉強中の方は、検証結果を元に架空のバナーなどを作ってみるといいかもしれません。
まずは型を身につける
この仮説→検証を、同じテイストのデザインで繰り返し行うと、型が身につくと思います。
例えば「かっこいい」に分類されているデザイン。
「何がかっこよさを足らしめているか」を言語化して理解することで、「かっこいいデザイン」の型が身につくのではないでしょうか。
その型を増やして、いつでも引き出せるようになって、初めてオリジナリティを出せると思います。
一番尊敬するデザイナーのもりぐさんに教わった【守破離】の守。
仮説を立て、検証し、引き出し入れて、まずは真似できるようになりたいです。
分析する軸について
補足です。
『見たまんまを書く』『仮説を立てる』ときに、軸を持っていると抜け漏れなくできると思っています。
私が現時点で軸としているのは以下です。
・構図（レイアウト）
・背景
・配色
・フォント
・文字組み
・あしらい
・コンセプト
・〇〇っぽさの要因
・テクスチャ
それぞれの軸を持って見ることで、見えない部分も見えてきます。
ただ、軸を持ちすぎると見えなくなることもあると思うので、そこの感覚が難しいと思ってます。
まとめ
いかがでしょうか？
①「客観的に」「具体的に」言葉にする
②「主観的に」仮説を立てる
③仮説を納得いくまで検証する
感覚派では無い人は、このやり方は少し参考になるかなと思います。
あとがき
なんか方法論を語ってしまいましたが、まだデザイナーとして一ヶ月ちょっとしか過ごしてない超若輩ものです。
構図の捉え方とか、色の言い回しとか、あしらいの言い方とか、わかってないことが沢山です。
これからも沢山良いものを見て、良いものを真似て、良いものを作れるようになりたいです。
この記事を書くにあたって、めちゃくちゃ参考になった本を紹介しておきます。
観察力の鍛え方（一流のクリエイターは世界をどう見ているのか）
著:佐渡島庸平
それでは。
この記事が気に入ったらサポートをしてみませんか？