デザインの基本原則
元記事
線、ライン
直線
順序、整然さを表現する
波線
動きを表現する
ジグザグ線
緊張、興奮を表現する
リーディングライン
視線をリード、誘導する導線のこと
デザイン、または特に注目して欲しいポイント、フォーカルポイントに視線を誘導することができる
リーディングラインをウェブデザインに採用することができる
縮尺、スケール
縮尺とは、個別のデザインごとに考えられたサイズ感のこと
重要、着目して欲しい点についてダイナミックな拡大、縮小を行うことで注目を集めることができる
配色
ムード、雰囲気、感情を表現できる
色ごとに特別な意味合いを含んでいる
反復
統一感、それぞれのアイテムをまとめることができる
ネガティブスペース
対象の間に存在する空間のこと
空間自体がシェイプとなる
対称
魅力的で美しいデザインとされる
完全な対称デザインではなく、いくつか対称となる要素を加える
透明
動きのあるエフェクトなどを表現することができる
テクスチャ
感触、奥行き感を表現
使い古されていて品や優雅さがあることと、古くてみすぼらしいは紙一重
バランス
各デザイン要素に重さがあると考える
非対称バランスによって重さを調整することも重要
階層
階層の一番上には、もっとも重要な要素が配置される
次の階層には、重要だが、見出しほど注目を集める必要がない要素を配置する
階層の最後には、あまり重要ではない要素を並べる
コントラスト
2つの異なる要素の視覚的な特徴の差を示す
明るい、暗い
厚い、薄い
大きい、小さいなど
コントラストを利用する
文字の読みやすさを強調するだけでなく、特定のデザイン要素に注目を集めることもできる
枠組み
アウトラインで囲まれたボックス枠やグラフィックス要素は、特定のデザインへの注目を、より強調することができる
グリッド
どこに何を配置するべきか、どのように揃えるべきか、枠組み
グリッドテクニックは、コンテンツを順序よくすっきりと、そして読みやすくし、デザイン性をよくする手助けとなる
ランダム
ランダムデザインと他のランダムな並べ方の違いは、デザインに達成目的と意図があるかどうか
どのように伝わるか、メッセージが伝わっているか、どうやったら訴求力を高めることができるかを考える
フロー
どのように視線が移動し、また視線を誘導するか
読み手は次のコンテンツが何か、すぐに分かるか
論理的に視線を誘導しているか
ウェブページを閲覧する際の典型的な目の動きは、アルファベットのEやFの形になる
そのため、重要なコンテンツは、ページの左側、上部に配置するのが最適
もう一つの典型的な動きは、Z型がある
いずれにしても、視線は左上から右下にかけて自然と動く
このパターンを完全に利用するのではなく、ケースに応じてデザインに流れ、フローを加える
デザインルール
可読性、カーニングについて、また、ピクセルイメージは使わないなど
動き
透明度、ブラー、線、ラインなどを用いることで動きを演出できる
奥行き
二次元デザインを魔法のように拡張できる
陰テクニックで奥行きを演出する
レイヤーテクニックで奥行きを演出する
遠近法で奥行きを演出する
タイポグラフィー
見出しタイトル、ボディ・コピーの書体の選び方、フォントの組み合わせ方など
プリント印刷にはセリフ書体が適切
ウェブページにはサンセリフ書体がいいとされている
見出しタイトルはカーニングする
一度に多くの書体を利用するのは避ける
長文テキストは、左揃えにすることでもっとも読みやすくなる
構図
デザイン要素全体の並べ方、整理
デザインのバランスは取れているか
デザインに論理的な階層があるか
視線をページ全体に論理的に、簡単に誘導しているか
メッセージはオーディエンスにもはっきり、わかりやすいか
この記事が気に入ったらサポートをしてみませんか？