WORK3
飲⾷店(カフェ)のWebサイト制作
- 課題内容
-
クライアントから制作依頼された「仕事」という前提でカフェ(喫茶店)のWebサイトを制作。
クライアントの要望を理解し、⽬的を達成するためにはどんなWebサイトにすればよいかをよく考え、デザインとコーディングを⾏い、実際にネット上で閲覧できる作品を制作する。 - 制作フロー指示
-
カフェについて
- 駅からも繁華街からも離れた住宅地
- 既存客のいない新規店
- 想定される競合店は、都⼼にも郊外にも展開するカフェチェーン、喫茶店、ファミレスなど
Webサイトを作る⽬的・クライアントの要望など
- ⼀番の⽬的は、店の知名度を上げて集客につなげること
- 地域の⼈たちが気軽に利⽤できるお店であることをアピールしたい
- 顧客を限定するような極端に個性的・先鋭的なものは望まない
サイト仕様
- 幅1280pxのブラウザで違和感なく閲覧できるサイズにすること
- トップページ含め最低4ページ構成
- コンセプトに合ったテーマカラーとロゴマークを作成する
- デザインコンセプト
- どんな年代・性別でも親しみを持てるWEBサイト
- 制作意図 ロゴ:一目見るだけでカフェと分かるように、また遠目からでもわかるようにシンプルにコーヒーカップだけのデザインにした。
- 制作環境
- Windows Illustrator Photoshop CS5 CC
HTML CSS Javascript - 製作時間
-
- デザイン制作:30時間
- コーディング:68時間
サイト配色:カフェを連想させるブラウン系の色をベース、メインカラーに採用し、アクセントカラーは安心感を考えて明るい緑を採用。
画面に1セクションずつ表示されるように余白をじゅうぶんに取り、セクションごとに伝えたいことが伝わるようにデザイン。
メニューページでは、情報量が多いのでスクロールのストレスを軽減するため、各メニューごとのリンクメニューを上部で固定するように設定。また、レスポンシブではスマホ端末で一番見やすいと考えアコーディオンメニューを採用した。
全体を通して、どのように表現したらユーザーが見やすいか?を考えデザイン・コーディングを行った。