ロゴ

Cucina

Web 2022.11

天然酵母のパン教室「Cucina」のWebサイト作成を担当しました。

URL:https://cucina-bread.jp/

概要
大田区にある天然酵母のパン教室「cucina」の新規HP作成
ターゲット
30代から50代女性
サイトの目的
コロナ禍で中止していたパン教室最下位に伴い、新規生徒獲得
近所にあるパン教室はホームページなどがなく差別化をはかる
情報設計
トップページのみの離脱を防ぐために、MVは写真を大きく配置し、スライドショーに。
あえてどのページも大きくデザインを変えないことで、統一感を持たせあまりPCや携帯に慣れていなくてもわかりやすいサイト作成を意識。
サイトのゴールはレッスンの予約のため、フッターにも配置する事でホームページを最後まで読んでいただいた方の離脱を防ぐ。
デザイン
全体を通して丸みのあるデザインにし、柔らかい印象を持たせる
写真を多用する事で、初めてパン作りをする方にもイメージをわいてもらいやすく、かつ親近感を得てもらう
フォントはナチュラルかつ読みやすさ、親近感を持たせるために、フォントは游ゴシックを使用。
(メイン:游ゴシック/ 英語:Noto Serif) カラーはナチュラルかつ、暖⾊系の配⾊に。
ベースカラーにベージュを使⽤、メインカラーには⾚みのある茶⾊で統⼀感を。
アクセントカラーには⾚
コーディング
トップページの背景色が徐々に変化→パンの焼き上がりを表現
歪な丸も動きを持たせ、パンをこねている様子を表現。
デザインがシンプルだからこそ、細かいアニメーションなどを使用。
制作範囲
企画、ワイヤーフレーム:1週間
デザイン:2週間
コーディング:1ヶ月
使用ツール
Illustrator / Photoshop / XD / Visual Studio Code