【HerTech 架空案件】カフェの新作フラッペと新店舗オープンキャンペーンの紹介LP

クライアントへのヒアリングメモを見て、ペルソナを設定し、訴求ポイントを整理。次にワイヤーフレームを作成。その後デザインのトンマナを固め、デザインカンプ制作に着手。ファーストビューを先行して制作し、全体のバランスを見ながら制作を進めました。担当範囲はデザイン全般です。

⚫︎カラー

フラッペの特色である「ベリー」を感じられるレッド系のカラーを選びました。

⚫︎タイポグラフィ

英字のみで表記している箇所はAbril Fatfaceを、日本語のみ、または日本語と英字が混ざっている箇所はNoto Sans JPをそれぞれ使用することで、統一感を出しました。英字、日本語ともに、文字にカフェの「おしゃれさ」や「落ち着いた雰囲気」を出す為にフォントの吟味に時間を掛けて取り組みました。

⚫︎情報設計

FVでは、フラッペに使用している果実のフレッシュさやソースのベリー感を前面に押しつつも、右下部分にCVボタンをさりげなく配置することでInstagramへの誘導を促しています。人の視線がZ型になりやすいという特徴や影がついているボタンを押したくなるという点などをうまく利用し、小さくも存在感のあるCVボタンに仕上げています。

⚫︎工夫したポイント

全体を通して、フラッペの「ベリー感」を節々に感じられるようなカラー配置を行いました。素材の画像の使い方には特に悩み、どのように配置するとより美味しそうに魅力的に感じられるのかを何通りも試して配置を決定しました。

…ワイヤーフレームは手書きで作成し、全体のイメージが掴みやすいように「ここはベリーカラーを入れる」等細かい部分までメモをしながら行いました。

…STUDIOにてデザインカンプ制作を行いました。FVの背景は、Canvaを使用して画像を加工しました。

…制作期間：約2週間。クライアントの要望をLPに表現する方法の多様性、ターゲットに合わせて情報設計を行うことの奥深さを学びました。