デザインの原則
Section 01 デザインの原則
近接の法則
基本目的
近接の基本目的は、グループ化です。他の法則もグループ化に貢献しますが、関連する要素を近づてグループ化するだけで、自動的に組織構造ができあがります。情報がグループ化されていれば読んでもらえる可能性が高くなり覚えてもらえる可能性も高くなります。グループ化することにより画面に空白(余白の美)が生まれより魅力的な画面になります。
確認方法
画面を眺め視線が止まった回数が3～5回を超えている場合、グルーピングを検討しましょう。
整列の法則
基本目的
整列の基本目的は、一体性とグループ化です。その効果は部屋の片づけと同じです。整理整頓された本棚からは読みたい一冊が簡単に見つけることができます。部屋が整理整頓されていないだけで気分が落ち着かなくなります。それは注意が分散するからです。
確認方法
画面を眺め、「左ぞろい」「中央ぞろい」になっているか各要素を確認しましょう。また端がそろっているかの他に各要素が均等に配置されているかも確認しましょう。
反復の法則
基本目的
反復の基本目的は、一体性と遊び心です。反復とは一貫性の事だと考えて下さい。同じことを反復すると言うことは一貫性があることを意味しています。反復させる要素として、太字にしたフォント、罫線、色、配置、余白などがあります。やみくもに太字フォントにして反復するのではありません。太字フォントにする部分に規則性を持たせて下さい。例えば小見出しなどです。太字フォントの小見出しと次の小見出しの間に挟まれた標準フォントの本文を創造してください。画面全体に強弱が生まれ強弱こそが遊び心なのです。
確認方法
画面内や画面間を見比べ反復要素を探しましょう。反復要素が見つかったら思い切ったデザインに変更してみましょう。ただしあまりにも過度の反復は強迫的になるのでほどほどにしましょう。
コントラストの原則
基本目的
コントラストの基本目的は、階層構造と遊び心です。コントラストとは明暗です。画面の要素、例えば絵図や本文の明るさがすべて同じになっていませんか？すべて明るい、すべて暗いではコントラストがありません。特に注意を引きたい要素を明るくし他の要素を思い切って暗くしてみましょう。物語の主人公を明るくし脇役は暗くしましょう。脇役を暗くすることに罪悪感を感じる必要はありません。主人公を目立たせるのが脇役にとっての喜びなのです。
確認方法
画面を見渡し主人公を見つけましょう。見つけたら思い切ったコントラストを主人公か脇役につけましょう。中途半端なコントラストは避けましょう。読み手が困惑するだけです。
デザインの原則の復習
一冊の本にデザインの原則を適用してみましょう。
近接の法則
整列の法則
反復の法則
コントラストの法則
近接の法則
改行の挿入
行間を1.5行から1行へ
整列の法則
中央ぞろいから左ぞろいへ
反復の法則
太字フォントの繰り返し
罫線の繰り返し
コントラストの法則
タイトルフォントの色を白くし背景を黒へ
各目次にフォントの色を薄く
Section 02 書体の関係性
書体、3つの関係性
協調関係 落ち着いたフォーマルな印象
書体を一種類だけにすれば、画面に統一感が生まれます。同一書体でイタリック体やフォントサイズを大きくしても協調性が損なわれることはありません。
衝突関係 避けるべき関係
まったく同じでもなくまったく異なるでもない、中途半端な類似した書体同士を画面内に混在させると衝突がおきます。
協調は堅実で有用なコンセプトですが、衝突は避けるべきです。
コントラスト 画面に遊び心が生まれる
まったく異なる書体を見出しや最も強調したい部分に使うと衝突は起きず、画面にゆかいで楽しいコントラストが生まれます。
Section 03 書体のコントラスト
サイズ
異なるサイズの書体は、非常にわかりやすいコントラストです。ただ臆病ななってはいけません。コントラストの効果を発揮させるためには大胆な異なるサイズを使用して下さい。中途半端な異なるサイズはコントラストではなく衝突してしまいます。
太さ
ほとんどの書体でレギュラー、ボールド(太字)、セミ・ボールド(中太)、エキストラ・ボールド(極太)、ライト(細字)が存在します。ボールドとセミ・ボールドの組み合わせは避けましょう。やはり衝突が起きます。
構造
構造とは書体をカテゴライズし異なるカテゴライズの書体を使用することで生まれるコントラストのことを指しています。和文字は大きく3つにカテゴライズできます。「明朝系」「ゴシック系」「行書系」
明朝体は可読性に優れています。長文の本文によく使われます。欧米のオールドスタイルに似ています。
ゴシック体は、可視性に優れています。見出しや小見出しによく使われます。
方向
活字の方向(水平、垂直、傾斜)によってコントラスト効果を生むことも出来ます。ただし傾斜の使用は注意して下さい。その傾斜に意味がある場合以外は避けるべきです。意味があるとは、例えば「業績が右肩上がり」と言う意味を込めて右上がりに傾斜させる場合です。四角い画面の四隅を埋めるために傾斜をつけるのは意味がなくやめましょう。
色
説明するまでもありませんが、異なる色をつかう場合もコントラスト効果が生まれます。
よろしければサポートお願いします。