カフェサイト

デザイン / Adobe XD / HTML / CSS / jQuery

cafe-mockup
https://camino.yu-dachs.com

制作概要

(ターゲット、目的)
普段と違う場所でゆっくりと過ごす時間が欲しい20代、30代の男女をペルソナに設定し、架空のブックカフェサイトを制作しました。
チェーン店とは違った静けさや特別感をアピールし、来客数を増やしたいという設定のもと、デザインを作成しました。

(デザインの方向性)
「日々の生活の中で一息つきたいときに訪れられる場所」というコンセプトを考え、余白を充分にとることで、お店の落ち着いた雰囲気が感じられるサイトになるように意識しました。

(ファーストビュー)
ファーストビューだけでも、お店の雰囲気が分かるように、店の外観と内観写真をスライドショーで見せられるようにしています。
また、ターゲットとなるユーザーが自分ごとと思えるように「あなただけの」という言葉を使い、お店を利用することで得られる体験をイメージできるようなキャッチコピーを入れるようにしました。

(配色)
落ち着いた色味のサイトになるように、深い灰緑色をメインカラーに設定し、リラックスや落ち着きを感じられるようにしました。アクセントカラーは、メインカラーを引き立てつつ、特別な印象を与える灰みのある薄茶色を選択しました。

(フォント)
落ち着いた雰囲気を出したかったので、和文、欧文フォント共に温かみを感じられ、安定感のある字体のサンセリフフォントを選択しました。

(その他工夫した点)
カフェを選ぶ基準として、利用のしやすさや店内の快適さを重視する点があることから、店の雰囲気やサービス内容などの情報をページ内で優先的に掲載するようにしました。

cafe-camp1 cafe-camp2