(制作事例) コワーキングスペースのデザインカンプ
SHElikes MULTI CREATOR COURSE 4つ目の課題 LP制作です。 架空のコワーキングスペース&カフェのLP制作依頼です。PCデザインカンプとSPワイヤーフレームを作成しました。ターゲットに合わせて、ビジュアルデザインに落とし込みました。
制作時間:40時間
制作期間:3週間
制作範囲:情報設計・ワイヤーフレーム・デザインカンプ
使用ツール:Photoshop/ Illustrator
目次
①要件
②工夫したところ
・コンテンツの再検討
・配色・あしらい
③制作したLP
④感想
①要件
架空のビジネススクール会員限定のカフェ&コワーキングスペースオープンに際した、利用方法やアクセス情報を載せたWebサイトの制作依頼。
<クライアント> WORK ,inc.
・女性向けのビジネススクールを展開。
・会員は20~30代の女性が多い。
・キャリアアップのためにビジネススキルを学べる。
・定期的にビジネスコンテストなどのイベントを開催。
<要件定義>
ターゲット:WORKの会員、会員ではないがWORKが気になっている女性。
目的:WORK lounge Aoyamaについて知ってもらうこと
<提供素材>
・ロゴ、PC版ワイヤーフレーム
<ペルソナ>
②工夫したところ
■他社との差別化
他社:アクセス・設備の充実さ・男女兼用のデザインが多い
何で差別化するか
【同じ目標を持った女性と交流ができる女性向けのワーキングスペース】
→スキルの向上だけでなく、同じ目標を持った女性とも交流できる
1.キービジュアル
新規の方だけでなく、すでに会員の方もアクションできるようにした。
2.NEWS
・交流ができることが分かるようにNEWSを増やした。キービジュアルのあとすぐ分かるように上部に配置。
・同じ目標を持った女性との交流がイメージしやすいように写真を入れた。
・新規会員登録はいつでもできるよう追従する
3.CONCEPT
文章が長いと感じたので、写真と文章を関連づけて、読みやすくした。写真でイメージが湧きやすくした。
4.SERVICE
ドリンクメニューは情報の優先度が低いので、サービスの中に小さく含めた。
5.SYSTEM
アイコンで情報を分かりやすくした。
6.CONTACT
登録を迷っている方もアクションできるように、「見学予約」を配置。
■配色・あしらい
ペルソナ像から配色やあしらいを決めた。ペルソナが読んでいそうな雑誌から、好みそうな色やあしらいを参考にした。
③制作したLP
④感想
0から制作してみて、ペルソナをデザインに落とし込む過程が楽しかった。シンプルなデザインだったので、どのようにメリハリをつければよいのか苦戦した。FBをいただき、アクセントカラーの使い方、フォント選び、情報の優先度を考えてメリハリを出すことができた。今回の学びを今後の制作物に生かしていきたい。中間講評会では、設定したペルソナ像によって様々なテイストのデザインを見ることができ、情報設計の考え方が勉強になった。
最後まで読んでいただきありがとうございます。