実績
- ワイヤーフレーム
- WFの意図
- ファストビュー
- FVではそれぞれ写真をスライドをすることにより、キャッチコピーを写真に加えることにより教室の魅力が伝わるように考えた。
- WF時はヘッダー部分にハンバーガーメニューを実装することを考えた。
- 表示順番
- 表示順番をNewsからFutureの順に考えていた。
- 区切り・境目
- NewsやFutureの部分は区切り線を入れないことを考えていた
- リラックススペース
- 「View More」を用いて次ページのリンクで表示することを考えていた。
- デザイン時の意図
- ファストビュー
- それぞれの写真にキャッチコピーを載せてただスライドするよりも五譜線とともに文字の大きさを変え、音符の大きさを表現することによってピアノの品格や楽器を習う楽しさを提供できると考えた。
- ハンバーガーメニュー→ヘッダー固定にすることで、それぞれの得たい情報に項目に飛べることができるようにと考えた。
- 表示順番
- FutureからNewsの順に順番を変更した。新規客の習得が目的のため、この教室の特長を伝えることが最優先だと考えた。
- 区切り・境目
- デザイン時には、項目の境目に区切り線を入れることで各コンテンツ毎に認識しやすくなると考えた。また、Future部分において下地をそれぞれに色を足すことでグループピングすることで、情報が整理できると考えた。
- リラックススペース
- このピアノ教室の一つの売りでもある「リラックススペース」を下層ページにおくのではなくTopページに置くことですることを考えた。
- 製作のポイント
- ファーストビューの3つの写真のスライダー
- それぞれの写真に五譜線があり、音符の大きさに合うようにキャッチコピーの文字の大きさを変え、音の大きさを表現している。
- 向日葵連想する配色
- ロゴにくすんだ黄色と明るい黄色を使用することで、温かみのある印象を与えている。
- 余白
- 余白を取ることで、ピアノ教室の上品さが伝わるようにしている。
- 情報
- 架空のピアノ教室
- 設定
- 教室名
- soleil(ソレイユ)
- 所在地
- 〒180-0004東京都武蔵野市吉祥寺本町1-17-3
- TEL
- 0422-23-XXXX
- 営業時間
- 月〜金：10:00~22:00
- 土・日：12:00~20:00
- アクセス
- 新宿駅から12分
- 渋谷駅から京王井の頭線で15分
- 製作期間
- 約3ヶ月
- コンセプト
- 新規客獲得(20代〜30代の比較的若い男女)
- 男女問わず、気軽に通えるピアノ教室
- 目的
- 新規客獲得(20代〜30代の比較的若い男女)
- 楽器を習う“楽しさ”をアピール
- ターゲット
- 20~30代の学生や会社員(男性,女性)
- 昔習った経験があり、もう一度習いたい人
- 使用ツール
- Photoshop
- Dreamweaver
- XD
- 製作担当
- デザイン
- コーディング
ペルソナ
- 山本拓真(22歳)
男性
職業：大学生
家族構成：父、母
居住地：家族と同居
月収：アルバイト
よく使うデバイス：スマホ,PC
- プロフィール
- ITを学ぶ大学生。平日、大学で講義を受け勉強している。講義が終了 すると居酒屋でアルバイトをしている。真面目で交友関係が広い。休日は友達とカラオケやボーリングなどの遊びを楽しんでいる。単位取得はされており平日も空いている日がある。スマートフォンやPCを利 用しYouTubeを用いて、JPOP音楽などを鑑賞している。楽器の演奏 に関心がある。
ペルソナ
- 宮川奈々美(26歳)
女性
職業：会社員
家族構成：父、母、妹
居住地：家族と同居
月収：20万円
よく使うデバイス：スマホ
- プロフィール
- 平日は、千代田区の化粧品メーカの営業職で働いている。 プラス思考で明るく男女問わず、誰とでも仲良くできる社交的な性格。 休日はカフェなどで、友人たちとの談笑を楽しんでいる。 スマホやSNS（InstagramやTwitter）を使用し、情報収集する。 過去に、3歳頃から中学1年生ピアノを習っていた。
PC
SP
