【習作】英会話教室 キャンペーンバナー制作

目次

1．制作したバナー画像（Instagram・X）
2．制作情報
3．課題要件
4．情報設計
5．ビジュアルデザイン
6.　学んだこと
7．著作権・クレジット

1．制作したバナー画像（Instagram・X）

2．制作情報

制作時間 │ 情報設計：120分　ビジュアルデザイン：180分
使用ツール│ Illustrator

3.　課題要件

4．情報設計

ワイヤーフレーム

ユーザーストーリー

5．ビジュアルデザイン

配色

＜メインカラー・ベースカラー＞

バナーのトンマナがポップであり、夏のキャンペーンであったためベースカラーを黄色・メインカラーを青色としました。黄色と青は色相で考えた時に対照的な色であり、そのような色同士を組み合わせるとにぎやかな印象になると言われています。そのため、この2色をベースとメインにすることでポップさを表現しました。また黄色は夏らしいレモンのような爽やかさがあり、青色からは夏の海や青空が連想できるため、夏にぴったりの配色でもあると思いこちらの2色に決めました。

＜アクセントカラー＞

アクセントカラーには黄色と色相が近く、目立つオレンジ、青よりもコントラストがはっきりする紺色を選びました。より目立たせたい情報にこの2色を使用しています。

あしらい
＜水玉＞ポップさを表現するため、水玉柄の円のあしらいを追加しました。情報の邪魔をしないよう、黄色と馴染みのいい、白色にしました。

＜プレゼントらしさ＞

プレゼントキャンペーンであることが一目でわかるよう、最も目立つ情報にプレゼント風のあしらいを用いました。「お友達紹介キャンペーン」にリボン型の座布団を引いたり、「5,000円プレゼント」の部分にギフトカード風の背景を用いたりしました。

＜英会話スクールだとわかるような要素＞

英会話スクールのキャンペーンバナーであることを直感的に伝えるために、英会話教室の先生の写真を追加しました。また女性2人の写真の上に英語のセリフを追加しました。

＜夏らしさ＞

「夏の」の近くにパラソルのイラストを追加し、夏らしさを表現しました。

フォント

・初心者向け・女性向けの英会話スクールであるため、柔らかく優しい雰囲気を演出するために丸みのあるフォントを選択しました。

・デザインがポップであるため、メインのフォントの数は日本語で1つ、欧文フォントで1つに抑えました。女性2人が英語を喋ってるようなセリフはあしらいらしくするため、他のフォントとは異なり、手書き風の欧文フォントを使用しました。

6．学んだこと

・ユーザーストーリーを軸にした情報設計
ユーザーストーリーを最初に考えることで、情報設計の軸がぶれることなく、デザインの方向性をしっかりと定めることができるということを学びました。ユーザーに伝えたい情報の優先順位が明確になるため、要素の配置や配色などを考える際にも、常にその軸を意識することができ、より効果的なデザインが制作できると感じました。今後もユーザー目線を大切にし、情報を組み立てていくことを意識していきたいです。

・直感的に何のバナーなのかを伝えるために、あしらいも工夫する必要があるということ
一瞬しか見られないバナー広告だからこそ文字の情報だけでなく、あしらいなどの視覚的要素でも情報を伝えることが大事だと改めて実感しました。

7．著作権・クレジット

サムネイルに使用しているモックアップの一部のモックアップは MockUPhone で作成しました。