【バナーデザイン】人物背景のレイアウトのコツ!目線の先に文字を配置し読んでもらう【視線誘導】

eiichih

背景画像に人物を使ったバナーデザインを頼まれたんだけど何か良い方法やデザインのレイアウトのコツがあれば知りたい!

そんな方に向けて背景に人物画像を使ったバナーデザインのコツを詳しく解説していきます。

この記事で得られることは次の通りです。

POINT

・人物の写真などの取り扱いがわかる

・写真と文字のレイアウトがわかる

・伝わるデザインが作れる

・キャッチフレーズ(伝えたい情報)を強調できる

その他のアイデア

twitterでも情報発信してますので興味のある方はご覧ください!

それでは具体的に解説していきます!

目次
  1. 目線の先に伝えたい情報をおくレイアウト
  2. 顔の表情にこだわったレイアウト
  3. 手のジェスチャーを使用した写真のレイアウト

1.目線の先に伝えたい情報をおくレイアウト

人は視線の先にあるものに無意識に注目してしまいます。

背景画像など、人物の写真などを使用する場合に、

この心理的な法則をバナーデザインに取り入れてみましょう。

目線の先には伝えたい情報(キャッチフレーズなど。)を配置すると、

より強調されて読んでもらえます。

遠くを見つめる女性
eiichih

それではこの女性の画像を使用してバナー製作してみよう。

IT就職誘致の広告バナー
POINT

視線の先にキャッチフレーズを置いて、伝えたいことを強調したデザインにしてみました。

2.顔の表情にこだわったレイアウト

写真の表情にもこだわる必要があります。

1の視線誘導と同じく、人間は人の顔にも無意識に

注目してしまいます。

「喜び」「怒り」「哀しい」「楽しい」

喜怒哀楽を表現したいときに、顔の表情は伝わりやすいです。

人は自分のうつし鏡と言われています。

私たちは相手の表情の影響を強く受けます。

eiichih

それではこの笑顔の女性の画像を使用してバナー製作してみよう。

未経験者に向けたWEBデザイナーカリキュラム講座の促進バナー
POINT

未経験者でも楽しく学べる雰囲気が伝わってくる。

女性の笑顔の表情がポイント!

3.手のジェスチャーを使用した写真のレイアウト

人の視線、表情、次は『手』です。

手にも表情があります。

指をさす。手のひらを向けて拒否の表情など

私たちは手でのジェスチャーでも情報を得られます。

eiichih

それではこの指を指している女性の画像を使用してバナー製作してみよう。

空人募集の広告バナー
POINT

女性の指のさす方に自然に目がいきます。

指の先には伝えたいメッセージ(情報)を配置しています。

まとめ

人間は

「視線の先」

「顔の表情」

「手の仕草」

無意識に惹きつけられます。

この心理的行動を理解して、

人物の背景画像のレイアウトをしていこう。

eiichih

より良いデザインができるように、

日々良いデザインを見たりするのも大事ですよ!