01. カフェサイト制作

課題内容
  • カフェについて
  • 住宅地に新規オープンする「ワズカフェ(Was Cafe)」。
    競合店は都⼼にも郊外にも展開するカフェチェーンや喫茶店など。
  • ⽬的・クライアントの要望
  • 店の知名度を上げて集客につなげたい、そして気軽に利⽤できるお店であることをアピールしたい。
    顧客を限定するような極端に個性的・先鋭的なものは望まない。
  • サイト仕様
  • ⽀給された原稿の内容をすべて盛り込み幅1280pxのブラウザで違和感なく閲覧できるサイズにする。
    コンセプトに合ったテーマカラーとロゴマークを作成する。
制作意図
  • カフェのコンセプト
  • オーナーが欧米の飲食店を回ったという経験から(支給原稿より)、どことなく欧米の雰囲気が感じられつつも気負いせず訪れられそうな雰囲気のカフェをイメージしました。
  • Webサイトコンセプト
  • クライアントの要望である気軽に利用できるお店であることをアピールするため丸みのあるゴシック体のフォント使用、そして写真の角を丸くし親しみのある雰囲気にしました。 また、「陽の光が満ちる明るい店内」というお店の特徴(支給原稿より)から、余白を多めに取り明るさと柔らかさを表現しました。
    内容が多いページではページ内リンク・タブを設置し、スムーズに見たい情報に辿り着けるようにしました。
    配色は温もりや落ち着きを感じられるようメインカラーを茶色にし、補色の青をアクセントカラーに使用しました。
  • ロゴデザイン
  • カフェの名前であるWasは英語で過去形であることから、「あの時Was Cafeで過ごした楽しかった時」をコンセプトに作成しました。
    時計をモチーフにし「WASCAFE」を時計の文字盤のように配置、その下には看板メニューであるコーヒーの波紋をイメージした模様を配置し、時が流れている様子を表現しました。 Wascafeロゴ
制作環境
Windows10 / MacOS Monterey
Illustrator CS5・CC
Html / CSS / jQuery
制作時間
December 1-16.2022
デザイン約24時間
コーディング約42時間
サイトを見る