読書メモ: デザイン入門教室
制作フロー
1. 情報の整理
3. レイアウト2 グリッドの設定
4. レイアウト3 優先順位の適用
5. レイアウト4 強弱の設定
6. 配色
7. 文字・書体選び
8. 情報の図式化
架空のハンバーガー屋のopenちらし作成を例に
情報の整理
何を、目的: オープン告知, オープン記念割引20% off
いつ: 10/15
どこで: 営業時間, url, 電話, 住所
版面・マージンの設定
版面率が高いと「楽しい」「にぎやか」な印象になる
低いと「静か」「落ち着いた」印象になる
グリッドの設定
モダングラフィックデザインの手法、矩形をグリッドの1単位としてグリッドに沿ってデザインしていく。整然としたレイアウトを実現できる
グループ化(近接効果)
形の異なる要素を揃える
端と端を揃えても視覚上の重量が揃わないため綺麗に見えない。重量の均衡点をひとつづつ見ながらで揃える
https://scrapbox.io/files/6651fac53c3949001cbd0da9.png
コントラスト
ジャンプ率が高いほどセンセーショナルな印象、訴求力が高くなる
ジャンプ率が低くなると静かで落ち着きのある印象、高級感がある
ジャンプ率は感覚で揃えても良いが等差、等比、フィボナッチなどの数式でも良い
重心を考える
濃度や密度が高いと重くなり逆は軽くなる。重量が中心に来ると安定した印象になる
余白
4隅を抑えると空間の広がりがなく窮屈な印象になるので2~3に抑える
1/3の法則
長方形を3分割し、2つをひとつの画面として扱う
色
色の三原則: シアン、マゼンダ、イエロー
光の三原則: rgb
色の三属性: 色相(Hue)、彩度(Saturation)、明度(Brightness)の属性
色相が同じでも明度の彩度の組み合わせ、いわゆるトーンが同じものを選ぶことが基本
類似色: 色相間で隣り合う色同士のこと
同系色: 同じ色の明度差の組み合わせ
フォント
https://scrapbox.io/files/6652b5df4fd2c3001c18fa70.png