【実践課題】LP制作（デザインカンプ）

使用ツール：Photoshop

制作範囲：情報設計・ワイヤーフレーム・デザインカンプ

制作期間：2週間

［ 目次 ］

1.  制作物

2. 要件定義

3. 工夫した点(情報設計)

4. 工夫した点(ビジュアルデザイン)

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

1. 制作物

2. 要件定義

3. 工夫した点(情報設計)

■ コンテンツの内容を再検討した

① コンセプトの前に、「イベントやニュース」のセクションを追加

ペルソナのニーズとして、スキルアップや人脈づくりが設定されていたので、メインビジュアルの直下にそのセクションを置くことによって、「自分がWORK lounge Aoyamaに入ったら、こういう活動をすることができる」などといったプラスの未来を想像してもらえる、思わずスクロールしたくなるというふうな期待を込めました。

② 文量の分散

ページの中間にあるコンバージョンエリアに辿り着く前に、ユーザーが離脱するのを防ぐ必要があると考えました。セクション内における文章の分量を少なくし、補足の説明として都度内容を付け足すことで、サクサクと下にスクロールしてもらえるような情報設計を心がけました。

③ コンバージョンエリアを複数設置する

クライアントの目的が「Work lounge Aoyamaについて知ってもらうこと」なので、CVボタン（お問い合わせボタン）をヘッダーとメインビジュアルの中央に配置し、ユーザーに次に取って欲しいアクションを明確にしました。

ユーザーに対して「アプリで簡単に予約取れるし、通いやすいかも」など利便性をアピールし、会員の方には専用アプリを登録してもらう、逆に会員ではない人にも興味を持ってもらい、スクロールを進め、ビジネススクールWORKのサイトを訪れてもらうという狙いがあります。

4. 工夫した点(ビジュアルデザイン)

■ 多様な価値観を意識し、中性的な配色に

① 配色

ひた向きに仕事に取り組むペルソナを含め、いろんな価値観を持った女性が集うコミュニティを意識して中性的な色を設定しました。たくさんのアイデアを受け入れて、自分の成長に生かすイメージです。

仕事のスイッチが入るような白と黒をメインカラーとしつつ、茶色をアクセントカラーにすることで、どこか落ち着く雰囲気を目指しました。

② フォント

可読性を意識し、読みやすいゴシック体を選びました。

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

■ 何を目的としているデザインなのかを明確にすることが大事

つい見た目を重視してしまい、機能性を何も考えていない場面があったので、いつでも基本に立ち返ることが大事なのだと感じました。他のサイトを参考にすると、セクションごとによく見る表現の仕方があることに気づきました。サイトを作成するときには、万人に広く親しまれている、分かりやすいデザインにすることが、設定した目的を達成する一番の方法なのではないかと思いました。