LP｜女性向けカフェ&コワーキングスペース（架空）

著作者：rawpixel.com｜出典：Freepik

目次

制作物

要件

情報設計/ワイヤーフレーム見直し

デザインコンセプト

工夫した点

課題を通して学んだこと

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

●制作したPCデザインカンプ/SPワイヤーフレーム

●要件

＜クライアント情報＞

クライアント名:WORK ,inc.

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

＜ターゲット＞

・ビジネススクールWORKの会員様

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

＜目的＞

・WORK lounge Aoyamaについて知ってもらうこと

＜ペルソナ＞（クライアント提供）

●情報設計/ワイヤーフレーム見直し

いただいたワイヤーフレームをもとにより良くなるように、以下の改善案を提案しました。

＜課題と改善案＞

・施設の具体的な情報が不足しており、どんな施設で、どんなサービスがあるのか

がわからないため、施設を利用する際のイメージが湧きにくいと考えました。

∟SERVICE・SYSTEM/FACILITY・PRICEコンテンツの追加や写真をたくさん入れることで、利用する際のイメージが湧きやすくなると考えました。

・WORK lounge Aoyamaがどういう施設なのかを知っていただくことが目的なのに、ドリンクメニューが上の方に来ていることに問題があると思いました。

∟ドリンクメニューよりも快適に仕事ができる施設であるということを理解してもらえることの方が優先順位が高いと思ったため、ドリンクメニューを下の方に掲載しました。

●デザインコンセプト

＜伝えたいイメージ＞

ペルソナからそれなりに金銭的余裕があり、上昇志向の女性がターゲットだと考えたので、「スタイリッシュ」「上品」「知的」「大人の余裕」などのイメージが伝わるように制作しました。

●工夫した点

＜メインビジュアル＞

・新規オープンであることがわかるように画像の上にGRAND OPENの文字を設置しました。

・クライアント提供のペルソナ像で「会社外での人脈を作りたい」とあったので、クリックするとイベント情報や施設内のお知らせなどのページに遷移するものを設置しました。

＜CONCEPT＞

・ターゲットに「ビジネススクールWORKの会員ではないがWORKが気になっている方」とあったため、WORKについてあまり知らない人もいる可能性があると考え、WORKのサイトに飛べるボタンを設置しました。

＜SERVICE＞

・無料と有料のサービスを見たときにすぐわかるように配置しました。

・施設の写真がないと、どういう施設なのか具体的にわからないと思うので、施設の写真を設置しました。

＜SYSTEM＞

・アプリをダウンロードしてもらえるようにSYSTEMのコンテンツ部分を見ているときは、アプリのダウンロードボタンが常にあるようにしました。

・トンマナに合うイラストを探すのにかなり苦戦したのですが、フリー素材のものを加工して利用しました。

＜PRICE＞

・見たときにどういうプランがあるのかすぐわかるように配置しました。

・アイコンはフリー素材のものを利用しましたが、トンマナに合わせて色を変えました。

●課題を通して学んだこと

・WEBサイトを制作するときは見た目の良さよりも、情報設計をしっかり行うことの方が大切だということがわかりました。見た目の良さももちろん重要ですが、どういう目的でこのWEBサイトが必要とされているのかやユーザーストーリーなどをしっかり考えて、制作していかなければいけないと思いました。

・途中でFACILITYとPRICEのコンテンツを追加したのですがWFの段階からは考えていなかったため、制作にかなり時間がかかってしましました。今後はWFの段階できっちり情報設計を決めてから制作に取り組みたいです。