■ 角版にするか切抜きにするか

題材が決まったら次はどうレイアウトするかを考えます。

まず考えるのは「角版（かくはん）」にするか「切抜き」にするか。
角版は四角形の普通の写真のことで、
切抜きは人物や物の輪郭にそって切り抜いた写真のことです。

角版は整った固い印象になりますが、
切抜きにすると画面に水平垂直以外の要素が入るため、
元気が出て親しみやすくなります。

自分の商品のイメージやキャッチコピーが
上品だったり高級な感じだったら角版の方が良いですし、
実用的だったりお得感や親しみやすさを出したいなら
切抜きの写真を使った方が画面に動きが出て良いでしょう。

角版、切抜きの他にも
丸版（丸で型抜き）や、ぼかし版（輪郭をぼかす）などもありますが、
これらは自分で加工しなければいけないので、
ソフトを持っていないとできません。

（図）角版は整った印象

（図）切抜き写真で画面に動きが出た

（図）切り抜けない写真はぼかし版にする手もある

■ 大きく使うか小さく使うか

写真の面積は多くなればなるほど親しみやすくなります。
例えば辞書のように写真が全くない画面は、
なかなか読む気になれません。

また余白を多く取れば取る程上品に、
逆に余白を無くしてぎっしり詰め込むほどインパクトが大きく、
にぎやかな印象になります。

「なんか下品だなぁ」と思ったら余白を大きめに、
「なんか寂しいなぁ」と思ったら余白を埋めていくと良いでしょう。

（図）余白を多くとって上品に

（図）余白を無くして元気に

■ 題材選び

デザインに写真やイラストなどの文字以外の絵的な要素を入れたい場合、
１番はじめに考えるのは、
「いったいどんな題材の写真やイラストにするか？」です。

アイキャッチとして写真やイラストを使いたい場合は、
写っているもの、描かれているものの違いが
見る人にどのような心理的影響を及ぼすかを知っている必要があります。

こちらの写真をご覧ください。

この中で一番最初に目が行く、または一番印象に残るのは
どの写真でしょうか？

一般的に最も訴求力を持っている写真は人の顔です。
特にアップにした顔は最も強い訴求力を持ちます。
逆に一番印象に残らない、
言い方を変えるとあっても邪魔にならないのが風景です。

この事から考えると、
キャッチコピーなど、目に止まって欲しい所には、
顔写真や物の写真を使い、
ホームページの背景や文字の下地には
風景的な写真を使うとよいでしょう。

（図）顔写真を使って訴求力アップ

（図）風景写真は背景に使っても邪魔にならない

■ 写真にするかイラストにするか

同じモチーフ（題材）でも、
写真とイラストでは雰囲気が変わります。

写真はどちらかというと格調高くなりますが、
イラストは親しみやすい、楽しい印象になります。
３ＤＣＧイラストの場合でも、
写真に近いリアルなものなら子供っぽくはならないですが、
ほとんどの場合、普通のイラストと同じような印象になります。

（つづく）

■配色について

配色とはどんな色をどこにどういう割合で使うかということです。

イメージに合った色を見つけられても、
１色でデザインするのは難しいことです。

２つ以上の色を配色する時は以下のポイントに気をつけます。

【色の数を絞る】

色の数が増えると全体を調和させるのが難しくなります。
画面がゴチャゴチャしてきたと思ったら、色を使い過ぎの可能性あり。
色数を２〜３色に絞ってみると上手くまとまります。

（図）色を沢山使うとまとめるのが難しくなる。

【反対色を同じ面積で使わない】

例えば鮮やかな水色と鮮やかなピンクは反対色です。
こういった真反対の色をぶつけると
「ハレーション」といって目がチカチカする現象が起きる場合があります。
色相環を見て、反対にある色同士を同じ面積でぶつけるのは避けましょう。

（図）ハレーション
【写真から取る】

メインに写真がある場合、色を合わせる最も簡単な方法が
この「写真から取る」という方法です。
メインイメージで使う写真の中から色を拾ってくると、
雰囲気を完全に合わせることができます。

ただし、キャッチコピーなど、画面の中心的な情報が周りとなじみすぎると
メリハリが無くインパクトに欠けるデザインになってしまうため、
その時は主役にアクセントとして強い色を使う必要があります。

（図）写真から色を取るとマッチしやすい。

■メイン、サブ、アクセント

配色は主にこの３つの役割で考えると上手くいきます。
もっと色々な役割を考える事もできますが、
複雑にすると実用的でなくなりますので単純に考えた方が良いでしょう。

【メイン】

メインの色。基本的には１つの色相（青や赤など）を、
明度（明るさ）や彩度（鮮やかさ）を変えて使用します。
デザイン全体のイメージを決定する色です。

【サブ】

１つの色相（モノトーン）だと単調になったり、寂しい印象なったりするので、
色相を３０〜６０度くらいズラした色を脇役として使うと良いでしょう。
メインが赤だったらサブは黄色やオレンジ、
メインが緑だったらサブは青や藍色などになります。

青メインでベージュをサブといった感じで、薄い反対色を使う手もあります。

【アクセント】

主役と反対の色を目立たせたい所に使います。
大抵の場合、黄色か赤色を使う事が多くなります。
赤と黄色が多くなる理由は、それぞれの色の特性によります。

赤は明度が低くても鮮やかな色、
逆に黄色は明度が低くても鮮やかな色です。
アクセントは目立つ鮮やかな色である必要があるので、
赤と黄色は都合が良いのです。

背景が、「白」または「明るい色」の場合は「赤」、

背景が、「黒」または「暗い色」の場合は「黄色」を使うことが多いです。

（つづく）