見出し画像

【なるほどデザイン】デザイン意図とプロセス


まず「デザインの意図」を明確に

何を、どうして、誰に、どのように、いつどこで、
(What, Why, Who, How, When, Where)

という意図、「なんのためにデザインするのか」を理解しながら手を動かすことが最も重要。


デザインのプロセス

デザインに正解はない。正しい手順は存在しないが、大きな構成から決めていった方がスムーズ。細部は最後に。

① 図解とラフ
情報の階層構造の整理
ex)A,B,C は並列、+aコラム 

② 方向性を決める
「表現」と「構造」の両面からおおまかな方向性を考えていく。
ex)かっちりよりも賑やかに=カラフル、動きのある配置

③ 骨格を作る
レイアウトする。
注)色や書体に頼らずとも成立するものをつくる。

④ キャラをたてせる
書体/組み/カタチ/配置などに気を配り、要素に個性を持たせてく。
注)デザイン=あれこれ飾り付けをすること、ではない

〈イメージの世界に浸かる〉
① コンセプトから言葉を連想
② イメージの連想
③ ヒントを引き出す
(色やテクスチャやカタチなどビジュアル面の要素を掴む)

〈擬人化(キャラ化)する〉
文章を話し方に例える、色を年代に例えるnado

⑤ 足し算と引き算
狙った印象に届いていない時は足し算
なくても問題ない時は引き算
ex)あしらい、飾りケイ、文中のマーカー、背景など

※ あしらい...元々は「もてなす」という意味で、デザインでは「装飾」の意味で使われる。下のようなものなど。


⑥ ブラッシュアップ
遠目で引いた目線、細部を観察する目線、両方で確認
ex)背景色の検討、フチをつける、タイトルに止めをつくる

〈神は細部に宿る!確認項目〉
● 色の解像度
└ グラデーションは途中も色入れる
└ 彩度を下げるだけでなく個別に色を作成
└ 描画方法(オーバープリント、乗算など)
● カタチの解像度
└ 角丸の微調整
└ ドロップシャドウの濃さ
└ 吹き出しや飾りケイ調整
● 文字の解像度
└ 同じフォントの種類の中でも検討
└ 文字を揃える(データ上では揃っていない場合も)
└ 字間ツメる(見出しの「、」など)
└ 引用符使い分け(ダブルミニュートとダブルクォーテーションなど)
└ コロンやハイフンのベースライン調整
● 画像のトリミング調整
└ 傾きの修正
└ 余計なものは削除orトリミング
● データと見た目
└ 図形は同サイズでも、大きさが異なって見える
└ 色の面積効果(面積小さいと暗く見える)
└ 天地中央配置はやや下に見えてしまう


目立たせ方(スポットライト)

伝えたい目的に合わせて、どちらの要素を強調させるか天秤にかけていく。

・色の足し算引き算
・図と地(図はカタチあるもので手前に感じやすい、地は背景に当たるもので奥まって感じられる)
・面積比を変える
・余白で分ける
・不揃いにする(秩序ある並びの中でずらす)
・バーバル/ノンバーバルコミュニケーションを意識





なるほどデザイン、本当にわかりやすくまとまっていてすごくいい本。ぜひ多くの人に手に取って欲しい一冊。


著者の筒井さんのnote記事はこちら。




この記事が気に入ったらサポートをしてみませんか?