MEGUMI

Webデザインにセンスは不要!これだけは抑えておきたい4つのデザイン基本原則

いざ自分でWebサイトのデザインをしてみると、
「なんだかパッとしない。見栄えが悪い。」
「理想とするデザインのサイトと比べると、何かが欠けているような気がする。」
といった悩みを抱えている人は多いのではないでしょうか。

そして、
「自分にはきっとセンスがない」
と思い込んでしまう人もいるかもしれません。

でも安心してください。デザインにセンスなど必要ありません。

センスという言葉には、生まれ持った才能のようなニュアンスを感じ取れます。
たしかに、そういう意味でのセンスを持つ並外れた人もいるでしょう。

しかし、守破離という言葉があるように、何事も守るべき基礎が存在します。
デザインも同じで、基礎を抑えれば今までセンスがないと思い込んでいた人も理想とするデザインに確実に近づくことができます。

今回はそんな「基礎」の代表格である、デザインの基本原則を4つ紹介します。

 

整列

見えない一本の線をつくる」まずはこれを意識しましょう。

整列の原則はデザインの基本中の基本です。どこか美しいと感じるデザインは共通して各要素がきちんと揃っています。

人間は要素と要素が離れていても、それらが整列していれば一つのユニットとして認識する生き物です。
そしてそれを美しいと感じる心理が働きます。

以下のサムネイルを見てください。

デザイン例 ロッククライミング 編集前

要素がバラバラに配置されていて、どこか落ち着かない印象を受けます。
これを修正したのが次の通りです。

デザイン例 ロッククライミング 編集後

文字と四角形を左側に揃えたことでスッキリとした印象になりました。
「見えない一本の線をつくる」というのは意外と知られていませんが、実践するだけで一気に全体の印象が引き締まるのでぜひ、意識して使ってみてください。

あえて「ずらす」

全ての要素が揃っていると統一感があって美しいのですが、どこか単調で退屈な印象を与えてしまいます。
そういった場合に要素をあえてずらすテクニックもあります。

 

近接

関連性のある要素を近づける」これも守るべきデザインの基本原則の一つです。
人間は近くに配置されている要素を無意識にグループ化する性質があります。

グループ化されている情報がそれぞれ関連していれば、読み手はストレスなく瞬時に情報を得ることができます。

以下のポストカードを見てください。

デザイン例 ポストカード 編集前

これはとあるイベントを告知するものだが、どんなイベントでいつ開催されるのかを瞬時に理解するのが難しくありませんか?

これを次のように修正します。

デザイン例 ポストカード 編集後

関連した情報がまとまってスッキリしたのがわかると思います。

 

反復

特定の要素を繰り返す」というテクニックも非常によく使われます。
そうすると、作品全体に一貫性を持たせ、統一感のあるデザインにできます。

普段意識して使うことはないかもしれませんが、

  • リスト1
  • リスト2
  • リスト3

のようなリストの先頭につく「ビュレット」も反復の原則を使っています。
点を繰り返すことにより、並べられている要素が関連していることを認識できるのです。

他にも以下のデザイン例が挙げられます。

デザイン例 名刺

これは名刺のデザインですが、細い罫線が2度使われているのがわかるでしょう。
ただ繰り返しただけなのに、統一感が生まれどこか美しく感じます。

 

コントラスト

4つの基本原則のうち最も効果があり、かつ難しいのがコントラストをつけることです。
コントラストとは「対比」のことを言い、要素間で意図的に強弱をつけることを指します。

そうすることで、読み手を引きつけ伝えたい情報を瞬時に伝えることができるのです。

以下のデザイン例を見てください。

デザイン例 プレゼン資料 編集前

デザインとしては整然としていてキッチリしていますが、どこか面白みのない淡白な印象を受けます。
これを次のように修正し、コントラストをつけてみます。

デザイン例 プレゼン資料 編集後

写真の独特な空間の広がりが活かされ、パッと見ただけで引き込まれるのがわかります。
このように、コントラストはデザインにリズムを作り、読み手を引き込む非常に強い力を発揮します。

一方、コントラストは中途半端につけてしまうと逆効果になるので注意が必要です。

コントラストをつけるときは、恐れず大胆になりましょう

 

まとめ

ここまで説明してきたことは、あくまでデザイン初心者向けのものです。
誰でも簡単に実践できるテクニックなので、ぜひ1つでも実際に試してみてください。

今回紹介したの4つの基本原則をもっと深く知りたい人は下記の本がおすすめです。

ノンデザイナーズ・デザインブック

豊富なデザイン例を元に、いかに整列・近接・反復・コントラストが重要なものかをまとめられています。