mellow room（デザイン＋コーディング）
- 制作区分
- 自主制作
- 担当範囲
- デザイン / コーディング / レスポンシブ対応
- 制作期間
- 約1ヶ月
- 使用ツール
- Figma / VS Code / HTML / CSS / JavaScript
- サイトタイプ
- 自主制作 / ECサイト
- ターゲット
- 上質な暮らしを好む20〜40代の女性
架空案件概要
クライアント
架空クライアント
事業内容
自主制作 / ECサイト
ご依頼背景
架空の依頼背景インテリア・ライフスタイルブランドとして、「暮らしに馴染む上質さ」をテーマにしたECサイトを想定しました。制作意図余白の心地よさをテーマに、写真・タイポグラフィ・配色を最小限で構成しています。
サイトの目的
メイン
サービスやブランドの魅力をわかりやすく伝え、閲覧者の興味・行動につなげること。
サブ
情報を整理し、回遊しやすい導線を設計する
PC/SPどちらでも世界観を崩さず表示する
お問い合わせ・購入・閲覧など次の行動へつなげる
ターゲット
メインターゲット
上質な暮らしを好む20〜40代の女性
ペルソナ
デザインの雰囲気や使いやすさを重視し、スマートフォンからもスムーズに情報を確認したいユーザー。
制作意図
架空の依頼背景インテリア・ライフスタイルブランドとして、「暮らしに馴染む上質さ」をテーマにしたECサイトを想定しました。制作意図余白の心地よさをテーマに、写真・タイポグラフィ・配色を最小限で構成しています。
デザインのポイント
世界観を優先した余白設計
写真・文字・余白のバランスを整え、作品ごとの雰囲気が伝わるように構成しました。
ファーストビューで印象を訴求
制作物の特徴が最初に伝わるよう、メインビジュアルと導線を整理しています。
情報を見やすく整理
目的・ターゲット・担当範囲を管理画面から更新できる情報設計にしました。
JOURNALコンテンツによるファン化
Instagramとの連携強化
デザインコンセプト
余白・写真・タイポグラフィを活かし、既存の世界観を壊さず上質で見やすいデザインに整えました。
制作担当
情報設計
ワイヤーフレーム設計
UIデザイン
レスポンシブデザイン
コーディング（HTML / SCSS）
アニメーション設計