架空LPデザイン制作（会員限定のカフェ＆コワーキングスペース）

【所要時間】3週間
【使用ツール】Photoshop

目次

① 制作したLP
② 要件・ペルソナ
③ ユーザーストーリー
④ ワイヤーフレーム再設計
⑤ ワイヤーフレームの修正
⑥ 工夫したこと
⑦ 制作を通して学んだこと

----------------------------------------------------------------------------------

① 制作したLP

② 要件・ペルソナ

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

目的
会員様限定のカフェ＆コワーキングスペースをオープンすることになったため、WORK rounge Aoyamaについて知ってもらいたい

ターゲット
・ビジネススクールWORKの会員様
・ビジネススクールWORKの会員ではないがWORKが気になっている方

ペルソナ
　▼ 属性 
　川上 望美さん/32歳/東京在住/某メガベンチャー ゲーム事業部 部長(8年目)/
　既婚で旦那さんと2人暮らし

　▼ 背景や行動
　・お仕事に注力していて、キャリアアップのために外交的な性格
　・仕事が好きで、ご自身のスキルアップのために投資する
　・同じ目標を持った同年代の女性と切磋琢磨し合いたい
　・会社外の人脈を作っていきたい

　▼ ニーズやゴール
　・仕事での成果をもっと出していきたい。
　・経営への理解も含めてゆくゆくは役員になりたいが、起業も考えている。
　・強いチームをつくるため、マネジメントやコーチングのスキルも学びたい。

③ ユーザーストーリー

④ ワイヤーフレーム再設計

⑤ ワイヤーフレームの修正

⑥ 工夫したこと

コンセプトを「3つのできる」に設定し、訴求ポイントが分かりやすく伝わるようにまとめました。
1. WORK rounge Aoyamaで実現できる「3つのできる」
・繋がりができる
・スキルアップできる
・作業に集中できる

2. 利用方法も3ステップでできる
・マイページを見せる
・ご利用時間/座席を選択
・ご利用開始

3. トンマナのメインカラーを3色に設定
・ 仕事に前向きなペルソナのエネルギーを感じる赤色
・ 同じ志を持った同年代女性と知り合える親しみのあるオレンジ色
・ 安心して集中できる水色

フォント選びについて
游ゴシック：仕事に前向きで忙しいペルソナでも読めるような長文でも読みやすいスタンダードな游ゴシックを選びました。
Outfit：デザイン性のあるフォントで、かつ読みやすいOutfitを選びました。
Mina：LPにあしらいを使用していないので、あしらい代わりにデザイン性のあるMinaを選択しました。

⑦ 制作を通して学んだこと

1.  ユーザーストーリーを考慮した情報設計の大切さ
ユーザーが何を求めているのか、どのような心の動きがあるのかユーザーストーリを作成して検討することで、ワイヤーフレームの情報設計の際に優先順位をつけて配置しやすくなることが分かりました。

2.  WEBデザインの基本について
PC・SPそれぞれのデザインを作るにあたり、フォントサイズや余白感、コンテンツの幅など、デザインの基本を学ぶことができました。 また、視認性の大切さも学びました。デザイン性を意識しすぎて視認性が低い状態だと、途中で離脱されてしまったり、コンバージョンに繋げることができずHPの役割を果たすことができないことに気づきました。 サイトに訪れたユーザーを混乱させないよう、「わかりやすく見やすい」デザインを意識することが大切だと学ぶことができました。