WIP

デザインの教室

created at 2016.10.14
updated at 11ヶ月前 ago
vsanna / public design

#読書メモ

構成

  • デザインの基本構成ルール
    1. 揃える / 整列
      • 補助線
      • グリッド・システム
    2. 繰り返し
    3. 対比
      • ルールからの逸脱が強調に繋がる
    4. 余白
  • デザインにはルールが必要。そのルールは自分自身で作っていい。写実性が評価軸でない世界での戦い方

平面構成のトレーニング

  • 線のデザイン
    • 配置にはルールが有る
    • 見えない線をおく
  • 面 / 四角形のデザイン
    • 四角形は画面構成 / 画面分割を担う
  • 円のデザイン
    • 自然は直線を嫌う
  • 斜めのデザイン
    • 23.4, 30, 45, 60度
  • サンセリフのデザイン
    • シンプルで明快 / 近年のの脱装飾にマッチする
    • font familyを統一して統一性を持たせつつ、weightや文字幅に差分をつけていく
  • セリフのデザイン
    • シャープさ

色のデザイン

色の使い方には2種類ある

  1. アクセント ... 少量だけ効果的に使用され、強調を生む
  2. 基調 ... このページは◯色だなと思わせる。色のイメージを作品全体に付与できる

どの役目を与えるのか、色選択では常に考える

  • 白・黒・赤のデザイン
  • 白・黒 + 1色のデザイン
    • 基準の一色はその色のイメージを大事にして選ぶ
  • 白・黒 + 2色のデザイン ... 基準の一色に加える2色目の選択方法
    • 色相・明度・彩度・トーンの内一つだけを変更する
    • インクの量・光の量(=rgbの合計値)が等しい色を選ぶ
  • カラーパレットの作成トレーニング
    • 色相の幅(色相環の中心角)が広いほど元気なイメージになる <→ 狭いとおとなしい
    • 色の並べ方で印象が変わる
      • 色相順 ... 自然 / まとまりがいい
      • あえて補色を隣接させる ... インパクトある
    • アフリカン
    • カラフル   - 3色 + 白でも十分カラフル

実戦的なレイアウト

  • 文字組
    • ストローク(1行の幅)と行間は関連させる
      • ストローク短い ... 素早く読める ... 行間は狭くても良い
      • ストローク長い ... じっくり読む ... 行間は広めに取る
    • 書体は細め-通常のweightに文字面の大きさがおおきすぎないもの
    • 見出し
      • 目立たせすぎてはいけない

shareシェアする

forumコメント

まだコメントはありません!
ログインしてコメントを残す
{{comment.user.name}} on {{commentCreatedAt()}}

content_copy前後のイシュー

{{message}}