スポンサーリンク

デザインを進めていくと、途中で、

  • 「あれ、なんか違う??」
  • まとまりがないな…。
  • チグハグになってしまっている。

となってしまうことがありませんか?

作業を始める前に2つのことを決めておくことで、統一感のあるデザインをつくることができます。

[色]テーマカラーを決めよう

デザインをする時には必ず「テーマ」や「コンセプト」がありますよね。
「色」は視覚的な情報の中でもイメージを大きく左右する情報となります。

デザインを見た人が、そのテーマと違和感なく受け入れられる色を選択しましょう。

 

色にはイメージがある

制作者が「この色にしたい!」と思っても、それを見る人にとってのイメージとかけ離れていては違和感が出てしまいます。

例えば、
医療系のデザインに黒が使われていては暗い雰囲気がしてなんだか怖いし、信頼感がないですよね。

「エコ」なら緑が一般的。

「涼しい」というコピーなら「水色」を連想するし、温かいなら「赤」など思い浮かべるでしょう。

 

また、サインになっているような生活に密着している色は安易に変更しないようにしましょう。
見る人が混乱してしまいます。

非常口→緑
男女→青・赤 など

 

インパクトや捻りを狙って、意味の無い色をごちゃごちゃと使うのは一番やってはいけない例です。
一般的なイメージから逸脱しないよう、メインカラーを決定しましょう。

 

色を決める前に知っておきたい。トーンを意識しよう。

色の組み合わせを決めるときに重要なこと、それはトーン(色調)を統一することです。

色は色相(赤・青・緑など)/彩度(鮮やか⇔くすんでいる)/明度(明るい⇔暗い)の3つの要素からできています。

この組み合わせによって、イメージが出来上がり、トーンが統一されていれば、統一感のあるデザインに、反対に統一されていなければまとまりのない見た目になってしまいます。

メインカラーを決めたときと同じように、トーンのイメージもばらつかないようにしましょう。

トーン図というのがあるので、見ながら決めると良いですよ。

 

ベース・メイン・アクセントで比率を考える

1制作物に対し、3色までを基本に色を決めましょう。

ベースカラー背景などの面積の広い部分に使う色。
薄い色にするか、濃い色にするかで、印象が大きく変わります。

メインカラーは最初に決めた、その制作物の主役となる色。

アクセントカラー注目させたいところに使う色。アクセントカラーを使いすぎては目立たなくなってしまうので気をつけましょう。

基本の割合

 

どうしても色数が足りないな。と思ったら、1色、または2色分割して色足してみましょう。

色を足したいときは分割

 

[書体]フォントファミリーを決めよう

1制作物に対し、1〜2種類のフォントにしましょう。

強調したいときなどは、同じフォントの太さの違うもの(フォントファミリー)で区別し、むやみに色々な種類のフォントを使わないようにしましょう。

チュー太郎
手書き風フォントなどは
アクセントくらいに留めておくでチュー
使いすぎると、ダサいでチュー

 

フォントの持つイメージ

色を決めたときに、色の持つイメージと違和感がないことが大事だと書いたのと同じように、フォントにもそれぞれイメージがあります。

書体の種類をざっくり分けると3カテゴリ

和文フォント
  1. 明朝体
  2. ゴシック体
  3. それ以外(手書きフォントやポップ体など飾り文字)
欧文フォント
  1. セリフ体(和文でいう明朝体)
  2. サンセリフ体(和文でいうゴシック体)
  3. それ以外(筆記体や飾り文字など)

 

細い明朝体→エレガント、清涼
丸みのある明朝体→和、レトロ
細いゴシック体→スタイリッシュ
太いゴシック体→エネルギッシュ
丸文字→こども、ポップ

 

内容に適したフォントを選択することで、違和感のないデザインになり、デザインの説得力も増してきます。

 

本文に個性的なフォントを使わない

ポップ体や手書き文字などを文章に使用するのは避けましょう。
可読性が低くなってしまいますし、全体のデザインにまとまりがなくなってしまいます。
特徴のあるフォントはアクセントに使用するようにしましょう。

可読性が高い例と低い例

 

[最後に]デザインは一手間

これでOKと思ったところから、もう一歩考えて良いものを作りましょう!

チュー太郎
ほんの少しの工夫、一手間が、
デザインのクオリティをあげるでチュー

 



WebCamp

WebCamp woman

スポンサーリンク
おすすめの記事