【Webサイト】hanacafe nappa 69

職業訓練校での課題制作でカフェサイトのリニューアルサイトをデザインからコーディングまで制作しました。

シンプルで見やすいサイトを心掛け、どのサイズから見てもベストになるようにブレイクポイントをいくつか設けたレスポンシブ対応のサイトに仕上げました。

.

【URL】https://momo11241124.github.io/hanacafe/

.

【担当内容】

サイトデザイン　（figma）

コーディング　（HTML  / CSS  / JavaScript）

ロゴ制作　（Illustrator）

.

【イメージ】

植物と緑に囲まれた空間のカフェをに合うグリーンをアクセントカラーに選び、サイトの見やすさを考え背景を白ベースにしフォントもシンプルなものに選びました。

.

【お悩みごとの提案】

・ナビゲーションがいまいち

→ pc、spともにカテゴリー分けしたナビゲーションをトップに常に表示しました。

→ メインビジュアルに営業時間を表記しました。

→ リンク先があることがわかりやすいように、ボタンをホバーした時に透明度が変わる、リンク画像やロゴがズームしながら透明度が変わるように仕掛けを加えました。

・デザインが単純に古い

→見た目の映える写真をを選定しつつ、手書きのメニュー表をなくし、綺麗に整列されたメニュー表を新しく作成し、ロゴもリニューアルし洗練されたサイトをイメージしてデザインしました。