Webサイト制作（コワーキングスペースLP）

【制作物】

【ペルソナ・ムードボード】

【コンセプト】

ラグジュアリーな空間、女性らしい温かみや優しさも感じられる空間

・ペルソナ像やヒアリングより、自己成長に意欲的な女性・経済的に余裕がありお洒落な空間で勉強したいという内容から設定しました。

・女性ユーザーの利用が多いことからビジネスイメージが強くなりすぎないように、居心地の良い温かみのある空間作りも意識しました。

上記より高級ホテルのラウンジをテーマにし、ゆとりのある空間を想像できるwebサイトを作成しました。

【ワイヤーフレーム】

クライアント様よりご提供いただいたワイヤーフレームを、ユーザー視線にてより自然な流れになるように修正しました。

・利用方法とプランの順番を変更

女性のペルソナ像のため金額も意識し利用を検討すると思うので、先に価格表を持ってきました。

ヒアリングの中でドロップインから利用スタートする流れが好ましいと言うお話しがあったので、ドロップインを先に目がいく左側に移動しオススメタグをつけました。

・イベント・交流会

作業の場だけでなく、自己成長に繋がる出会いの場として活用をアピールするため新たに1セクション設けました。

・よくある質問

文章が長くなるので、必要な物だけ読んでいただくよう折りたたみ形式に変更しました。

・アクセス欄

電話番号の記載を追加。ペルソナ像から他のSNSからも情報を取得することを想定しInstagram等のSNSを追加しました。

最寄り駅の記載があると地図を見る前に場所のイメージができるので、日々忙しいペルソナ像には必要かと思い追加しました。

【SP版ワイヤーフレーム・デザインカンプ（ストーリー）】

【SP版】

・ヘッダー

スッキリ見せるため、ハンバーガーメニューを使用しました。

・料金表、交流会・イベント

縦に長いと離脱率が高くなるので、横に配置しスクロールする形式に変更しました。

【工夫したこと】

・FVでは、ペルソナが好みそうな空間をイメージ出来る画像選びをしました。特に女性は文章よりも写真やイメージから入る方が多いので、見た瞬間に高級間がありお洒落な空間とわかるように選びました。

スクロールしていくと温かみがあり居心地も良さそう、交流会等のイベントもあり参加してみたいと興味を持たせる視線誘導を意識しました。

・情報量が多い内容なので、視覚的にわかりやすく出来る所はアイコン画像を使用し一目でわかるようにしました。

・セクションが変わったことがわかるように、毎回同じスペースを取り見出しをつけました。

・イベント・交流会、よくある質問はスッキリと見せることを意識し他の情報はVIEW ALLをクリックすると読めるように設定しました。

【制作を通して学んだこと】

ヒアリングの内容やペルソナ像に基づいて、何を求めているのかを考え、そこに近づける為の配色・画像選びをすることの大切さを学びました。

常にペルソナを意識しながら制作を進めていくことで、ブレずに制作できることに気がつきペルソナ設定の重要さを改めて感じました。

どのように配置をすると視線誘導が上手くいくのかを考え、クライアントからいただいた WFをブラッシュアップをする、そこに配色や画像を加え、クライアントの求めている物を制作するという経験をし、何故このようにしたのかを言語化する必要性をこれまで以上に感じました。