架空カフェ　サンプルサイト

URL:https://ryoworks.com/bookcafe/

コンセプト
大人が落ち着いて過ごせるブックカフェをテーマに、架空のカフェ店「CAFE NOIR(カフェノワール)」のウェブサイトを制作しました。厳選したコーヒーと手作りスイーツを楽しみながら、読書や一人の時間をゆっくり味わえる、静かで上質な空間を表現しています。

キャッチコピーは 「心をほどく、深い一杯」 です。

ターゲット
20代後半〜40代前半の社会人男女を想定しています。平日は仕事帰りに立ち寄り、休日は一人でゆっくり過ごしたい人をイメージしました。コーヒーや空間の質を重視し、SNSは見るものの、騒がしい店よりも落ち着いた場所を好む人をターゲットにしています。

サイトの説明
職業訓練の課題として、HTML・CSS・JavaScriptを使用し、架空のカフェサイトを制作しました。初めてこの店を知った人に「行ってみたい」と思ってもらえることを目的に、店舗の雰囲気や魅力が自然に伝わる構成を意識しています。
落ち着いた雰囲気やカフェの世界観を感じ取ってもらえるよう、できる限り無駄を削いだシンプルなWebサイトに仕上げました。トップページ・メニュー・アクセス／お問い合わせの各ページを通して、情報が見やすく、統一感のあるデザインになるよう工夫しています。
また、スマートフォン表示にも対応し、ハンバーガーメニューの実装や表示崩れの調整、ファビコン設定まで行い、実際の公開を意識して細部まで制作しました。
※使用テンプレート：https://template-party.com/

制作時間
12時間

使用技術
HTML / CSS / JavaScript / Photoshop（メインビジュアル）