LP制作 デザインカンプ|会員制コワーキングスペース

OVERVIEW

SHElikes MULTI CREATOR COURSEの課題にて、会員専用カフェ&コワーキングスペースのLP制作に取組みました。クライアントからの要件書とワイヤーフレームを元に、PCのデザインカンプとSPのワイヤーフレームを制作しました。

目次

1. 制作情報
2. 制作物
3. 課題概要
4. 情報設計
5. デザインコンセプト
6. 工夫したポイント
7. 制作を通して学んだこと


1. 制作情報

制作時間:約2週間
制作範囲:情報設計、PCワイヤーフレーム修正・デザインカンプ、SPワイヤーフレーム
使用ツール:Photoshop


2. 制作物

■PCデザインカンプ・SPワイヤーフレーム


3. 課題概要

■クライアント情報
 クライアント名:WORK ,inc.
 女性向けのビジネススクールを展開している。会員は20~30代の女性が多く、
 キャリアアップのためにビジネススキルを学び、さらにそのアウトプットの場として
 定期的にビジネスコンテストなどのイベントも開催されている。

■目的
 ・Work lounge AOYAMAの認知拡大
 ・Work lounge AOYAMAをきっかけに、ビジネススクールWORKの会員増員

■ターゲット
 ・ビジネススクールWORKの既存会員
 ・ビジネススクールWORKの会員ではないが気になっている方
 ・20-30代のビジネス感度の高い女性

■ペルソナ
 【名前/コピー】
  川上 望美(32)/仕事で成果を出したい
 【属性】
  ・東京在住、某メガベンチャー ゲーム事業部 部長(8年目)
  ・既婚で旦那さんと二人暮らし
 【背景や行動】
  ・キャリアアップのために積極的に交流→外交的な性格
  ・仕事が好きで、自身のスキルアップにも積極的に投資
  ・同じような目標を持った同年代の女性と繋がり、お互いに切磋琢磨し合いたい
  ・会社外での人脈を作っていきたい
 【ニーズやゴール】
  ・仕事での成果をより今以上に出していきたい
  ・経営者との繋がりをつくり、自身の経営の理解を深めたい(会社で役員を目指す)
  ・社会的にインパクトのある仕事をしていきたい
  ・強いチームを作るためのマネジメントやコーチング、組織づくりに興味がある


4. 情報設計

 要件の内容をさらに深掘りし、元のワイヤーフレームを見直して、必要な情報の追加や変更を行いました。


5. デザインコンセプト

「志の高い女性がつながる、上質なワークスペース」
 高みを目指す女性同士が交流し、新たな学びと成長のきっかけを生む特別な空間。
 柔らかさと上質さを兼ね備え、洗練された雰囲気の中で、ビジネスや人脈を広げられる
場を表現できるよう制作しました。


6. 工夫したポイント

■配色 / フォント
 ベージュやピンクの柔らかな色合いを基調にし、アクセントカラーは、赤の中でも落ち着いた色味にすることで、上品さや大人な女性のイメージを演出できるようにしました。
 フォントは明朝体を使用し、余白をゆったり取ることで、落ち着いた印象を与える空間を作り、上品さと読みやすさを意識したデザインに仕上げました。


■FV:写真の追加
 より施設内の雰囲気が伝わるよう、複数枚の写真を自動カルーセルで表示するようにしました。


■奥行きと動きのあるデザイン
 ズラした矩形背景で奥行きと動きを加え、視覚的にメリハリのある上品で落ち着いた雰囲気を出せるよう工夫しました。


■アイコンの追加

 ユーザーに直感的に内容が伝わるようアイコンを使用しました。トンマナに合わせてシンプルでわかりやすいデザインを意識し選びました。


■アプリ動線強化

 スマホモックアップやアイコン、ダウンロードボタンを配置し、FVからダウンロードボタンがスクロールに応じて追従する設計にしました。


7. 制作を通して学んだこと

  ・情報整理の重要性について
  目的を達成するために、クライアントの思いや要望をしっかりと汲み取り、
  情報設計をすることの大切さを学びました。

 ・コーディングを考慮した設計の重要性
  実装をスムーズにするためにフォントサイズや余白に規則性を持たせることが重要で
  あると学びました。