🐱制作物
▼ PCデザインカンプ

▼ SPワイヤーフレーム

▼ ムードボード

🐱課題概要
架空クライアントからの依頼内容(ヒアリングからまとめたもの)
- やりたいこと
「ワークラウンジ青山」の利用方法やアクセス情報を載せたWebサイトを制作したい
PC版デザインカンプと、SP版ワイヤーフレームの提案を希望 - クライアント
女性向けビジネススクールを展開する「WORK ,inc.」
会員は20~30代のキャリアウーマンが多く、学んだビジネススキルをアウトプットする場としてコンテストなどのイベントも定期的に開催 - 目的
「ワークラウンジ青山」の認知拡大、ワークラウンジ青山をきっかけとしたビジネススクール「WORK」の会員増加 - ターゲット
20~30代のビジネス感度の高い女性。ビジネススクール「WORK」既存会員、または会員ではないが気になっている方 - 提供画像
ロゴ - その他要望
アプリ(ワークラウンジ青山の席予約可能、イベント情報を配信。会員は無料)を紹介してほしい
🐱情報設計
■ ペルソナ

- テーマ:「都会的で上昇志向な女性が、自分を高めるために通いたくなる場所」。今回のクライアントはサービスを通じてスキルアップや自分磨きなどの付加価値も提供しているため、そのイメージが伝わるよう、またユーザーが自身と重ねられるよう、メインビジュアルには開放的な屋外カフェでPCに向かう上品な女性を配置しました。
- 構成:ターゲットのユーザー心理を想定して知りたい順に沿った設計をしました。利用方法(SYSTEM)を早めに配置し、FAQをアコーディオン形式にすることで、情報量を整理しつつ離脱を防止。スマホでは縦積み構成を採用し、視認性と操作性の両立を意識しました。
全体を通して、「視覚的な心地よさ」と「行動のしやすさ」の両方を重視しています。
🐱工夫したポイント
- 安心感の演出:どんな場所なのかを想像したうえでLPをスクロールできるように、施設内の写真を最初のセクションに配置
- ピクトグラムの活用:SYSTEMセクションに組み合わせて絵を作ったり、ボタンに置き、直感的に理解できる構成に
- 写真加工:全体的に温かみを感じられる黄味のある加工で統一
- 導線:FAQでアコーディオンUIを採用し、情報量が増えてもユーザーが迷わない導線を確保
- 配色:銀座という立地もあり「上品で芯のある女性像」を基に、ネイビー × ベージュで落ち着きを、アクセントカラーの黄緑で温かさと前向きさ、癒しの雰囲気をプラス。ターゲットが女性だからと安易に「可愛い」「親しみやすい」印象に寄らず、かと言って単調過ぎない、ほどほどに真面目なトーンに
- あしらい:このサービスを活用した方が得られる「成長」を、瑞々しい新緑や若葉とリンクさせ、遊び心としてイラストを導入
🐱学び・振り返り
何よりも「情報が正しく伝わること」が大事だと考えながら「何を、どの順番で、どう感じながら読むか」を意識することで、ユーザー視点に基づくストーリー設計の重要性を再確認しました。
また、ムードボード制作を通して、自分が特に惹かれるのは「世界観をデザインで伝えること」だと気づきました。
構造的な理解と感情的な訴求を両立できるよう、引き出しを増やしていきたいと感じました。
