こんにちは！mocoと申します。

Shibajaukuサイトがリニューアルするにあたり、サイト内に設置する3種類のバナーを制作いたしました。

関連サイト（CodeHero, Creator Quest, CAMPFIRE入会ページ）の認知を広げるためのバナーで、こちらはその中のCreator Questというサイトに飛ぶためのバナーです。

Creator Questとは

Creator Questは、HTML/CSSなどのWebサイト制作に必要なスキルや、Webデザイン、Webディレクションなどの知識を学習できるオンラインレッスンサイトです。

冒険に出るワクワク感を！

対象となるユーザーは初学者の方が多いと予測し、見た人を新しい世界へ連れ出すような力強いコピーを考えました。

一番見せたいコピーがパッと目に飛び込んでくるよう、太いゴシック体で大きくレイアウト。単語ごとに強弱を付けたり右上がりにしたりと、躍動感を出しました。

文字組みには最もこだわり、文字詰めや文字の傾き、揃える部分とずらす部分を少しずつ検証しながら組んでいきました。

背景のキーボードを叩く写真は、ブルーとグリーンのデュオトーン。Web業界の先進的・クールなイメージを表しています。

掲載イメージ

実際にサイト内にバナーが貼られたイメージはこちらです。

他の2種類のバナーと比べると一番派手な印象ですが、色味を絞ったおかげであまり悪目立ちしないバナーになったのではと思います。

修正前の案をひっそり公開

ちなみにですが、こちらはしば先生による添削前のデザイン案です。

「クエスト＝冒険」というイメージから、高い山に挑む登山者の写真を使ったのですが…

「これだとリアルに冒険に出そうだから、Webっぽい写真のほうがいいかも」とアドバイスを頂きました。

たしかにそうですよね…（笑）

夢中で制作していると連想ゲームが始まり、自分にしか伝わらないデザインになってしまうことがよくあるので注意しなければいけないなと感じました。

常にコンセプトを意識し、確認しながら手を動かすようにしていきたいです。