（架空サイト）
担当範囲
- ワイヤーフレーム作成
- UIデザイン
- Figma制作
First View
制作背景
架空の地中海レストランをテーマに、
料理や空間の魅力が伝わるWebサイトを制作しました。
ターゲットは
20〜40代のカップルや家族、観光客。
予約まで迷わず進める導線を意識しました。
デザインの工夫
・料理写真を主役にするレイアウト
・ネイビーとゴールドを基調に高級感を演出
・情報量が多くても迷わない導線設計
・予約ボタンを強調しCTAを意識
・Figmaレイヤーを整理し実装しやすい構成
セクション紹介
First View
料理写真で世界観を伝え、ファーストビューでコンセプトが伝わるよう設計。
Menu
料理写真を大きく見せ、
季節限定・昼・夜・ドリンクを整理。
ディナーセクションは「夕方～夜にかけての特別な時間」をイメージした配色を、サイト内のアクセントカラーとして取り入れました。
- Mediterranean Navy （メディテレーニアン・ネイビー）…地中海の深い海をイメージ。
- Sunset Gold（サンセット・ゴールド）…夕暮れの太陽が海に反射する光。
Reservation
ディナーセクション同様、背景色を変更し、
ページ内で最も目立つCTAとして配置。
制作時間
制作期間 約5日
使用ツール
Figma
制作工程
ワイヤーフレーム作成
↓
初稿
↓
フィードバック
↓
改善
↓
完成
設計の視点
「料理を見せること」だけではなく、「予約まで迷わず進める体験」を意識しました。写真・余白・配色・情報の優先順位を整理し、世界観と使いやすさの両立を目指しました。