naoのポートフォリオサイトのロゴ

naoのポートフォリオサイトのロゴ
Cafe tantanのカフェサイトのモックアップ

カフェのWeb Site

DESIGN | CODING

内容

クライアントワーク
カフェのWeb Site

使用ツール

Figma/Dreamweaver

使用言語

HTML/CSS/JavaScript
/JQuery

制作期間

デザイン:280時間

コーディング:170時間

制作物

ユーザー名

lv4u

パスワード

lv4u4062

制作の背景

| 現状

  • ・インスタグラムのみ運用している
  • ・Cafe & BARを2023年7月中旬より営業スタート

| 課題点

  • ・スタッフの知人以外の集客
  • ・店舗そのもの・Cafe & BARの周知
  • ・若年層・および女性客への訴求

| ペルソナ

石川 莉子(32)

元々は住宅メーカーの総合職として勤めていたが、出産を機に定時で帰ることができる現職に転職。夫とは前職で出会い、子どもは娘がひとり。夫の仕事の都合で兵庫県西宮市から引っ越してきた。

仕事と育児で追われる日々のなかで、娘と過ごす休息の時間や、趣味のカメラに割く時間を楽しんでいる。元々地元民ではない為、近所の子育て世代との交流を密かに求めている。

既存のメニューデザイン

  • Cafe tantanの朝食メニュー表既存デザイン
  • Cafe tantanのランチメニュー表既存デザイン
  • Cafe tantanのテイクアウトメニュー表既存デザイン

制作のポイント

誠実性・親しみやすさ・こじんまりという3点を軸に進めることを、ご担当者様・並びに常連のお客様へのヒアリングから決め、制作いたしました。

1.使用カラー

彩度が低く、明度が高い、やさしくやわらかいアースカラーを使用。既存のメニュー表から大きく逸脱しないこと・ターゲット層である女性客にアプローチすること・北区の自然に囲まれていることを基準に選定しました。

2.構成

店内での過ごし方・雰囲気・メニューのボリューム感が十分に伝わることを意識し構成。また、色・余白・あしらいを工夫し、各メニューページの印象を変化を与えることで、離脱されにくいサイト制作を心がけました。

3.その他デザイン

わかりやすく・かつ丁寧な印象を与えられるよう、文字の大きさ・ボタンの文言 ・大きさにも意識を向けました。また、やわらかな印象と誠実な印象をバランスよく織り交ぜられるよう、曲線と直線、モチーフを用いる場所、フォントの選定にこだわりました。

ハート

CONTACT

お問合せ

当サイトを見て少しでも
ワクワクしてくださった方、
ときめいてくださった方、
お気軽にご連絡いただけると嬉しいです。

あなたにとって、わたしにとって、
関わるみなさまにとって、
素敵な出会いとなりますように。