スクール課題:イタリアの二都市の魅力を伝える記事ページへの誘導バナー

制作したバナー

概要

デザインスクールSHElikesの課題で、イタリア旅行の魅力を伝えるバナー制作に取り組みました。

使用ツール:Photoshop

制作時間 :7時間

製作時期 :2022年12月

要件

制作目的イタリアの二都市の魅力を伝える記事ページへの誘導バナー
ターゲット・ヨーロッパ(またはイタリア)への旅行に興味のある人
・イタリア旅行を検討していて行き先を悩んでいる人
・ヴェネチアもしくはフィレンツェの魅力を知りたいと思っている人
サイズ1200×628 px
必要な要素・あなたはどっちへ行く? 
・TRAVEL TO ITALY
・水の都 ヴェネチア
・花の都 フィレンツェ
遷移先イタリアの都市(ヴェネチア・フィレンツェ)の魅力を伝える旅行記事
方向性イメージ・バナーからイタリアの都市の魅力やイメージが湧く
・それぞれの都市の特徴が端的に伝わり、もっと知りたいと興味が持てる
指定条件イタリアの都市や旅への興味が湧きそうな写真を必ず1枚以上使用すること

工夫したところ

1.対象的な2都市のカラー

「あなたはどっちへ行く?」というコピーから、ぱっと見たときに、二都市が比較されていることがわかるようにしたいと考えました。

ヴェネチアは「水の都」で「運河の街」のイメージがあるため、運河の写った写真。青・緑の面積が大きい青空の写真がなかったため、「空を置き換え」機能で曇り空を青空に変更。フィレンツェの写真は、ヴェネチアの青・緑の対象的なカラーかつ「花の都」をイメージできるカラーとして、夕焼けのピンクと建物のオレンジがしっかりと写っている写真を選びました。

各写真の彩度を調整することで、よりコントラストを強めました。

2.飛行機雲のあしらい

海外旅行には飛行機のイメージがあるため、コピー「あなたはどっちへ行く?」の下線を、飛行機とその飛行機雲をイメージしたあしらいにしました。ラインの部分は雲のような質感のブラシを使用して、「飛行機雲っぽさ」を演出しました。

3.フォトフレーム風の枠

バナーの周りに細い囲み線を入れることで、旅行の際に撮った写真をフォトフレームに収めたような雰囲気を出しました。

4.重厚感のあるあしらい

各都市名の背景は、それぞれの写真の象徴的なカラーから作成したリボンのあしらい。リボンの縦中心を少し明るい色にすることで、立体感と、美しく歴史あるイタリアの雰囲気を感じ取れるようにしました。

5.写真の邪魔をしないシャドウ

写真の上に「ITALY」の文字を重ねたことで、視認性が落ちないように工夫しました。

本バナーで、各都市の写真は重要な要素だと考えました。文字の背景にベタ塗りをすると写真の邪魔をしてしまうため、極力写真の邪魔をしない方法として、文字の後ろに微かなシャドウを入れました。

制作を通して学んだこと

比較写真のコントラストの付け方

各都市の写真の彩度を調整して、違和感なく2つの写真にコントラストをつける方法を学びました。

「空の置き換え」機能の使い方

ヴェネチアの写真の空を青空にするために、「空の置き換え」機能の使い方を学びました。

パスへのブラシツールの適用方法

飛行機雲のあしらいを作る際、ペンツールで作成したパスに対してブラシを適用する方法を学びました。

ブラシツールでのシャドウの付け方

これまでシャドウをつけるときはドロップシャドウを使っていましたが、本バナーではドロップシャドウよりもさり気なくシャドウを入れたかったため、講師に相談して、ブラシツールでの微かなシャドウの付け方を学びました。