LPデザイン

OVERVIEW

SHElikes MULTI CREATOR COURSEの課題で、クライアントやペルソナを想定した、実案件レベルのLPデザイン制作に取り組みました。 (制作時間:25時間 使用ツール:Photoshop)

● 目次

 ① 課題内容

 ②制作した作品

 ③ 工夫したところ

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


【今回の課題で担当したフロー】


① 課題内容

【クライアント】

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

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

【ターゲット】

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

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

【目的】

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

【ペルソナ】     

【提出作品】

課題制作時に渡されるLPワイヤーフレームを参考にし作成した、LPデザインとSPワイヤーフレーム


② 制作した作品


- 課題制作時に渡されたLPワイヤーフレーム -


- 制作したLPデザイン -


- 制作したSPワイヤーフレーム -


③ 工夫したところ

1.  目的を明確にし、ターゲットを意識したデザインにするためのストーリー立て

ペルソナがどうしたら使いたくなるのかを、一番意識し作成を進めました。それにあたり、目的をより可視化し、各ページを見た時のストーリー立てをしていきました。


2. ワイヤーフレームで変更できる要素、足りない要素を考える

自分で決めた目的を達成するため、下記要素を変更・追加をしました。


【変更した要素】

・セクションの順序の変更

セクションの順序を「concept→drink」ではなく「concept→system」に変更し、早い段階で簡単に利用できるとわかるようにしました。


・Drinkをペルソナに合わせたデザインに変更

ペルソナは「仲間と交流すること」を求めているため、「買う」よりも「交流できそう」と思わせるよう、飲み物は会話のお供になるような文章を作成し、変更したデザインにしました。


【追加した要素】

・「Events」のセクションを新たに加える

ワイヤーフレームだけでの要素だとペルソナが求める「交流」の要素が少ないため「Events」を追記し、交流できる場あるとわかるようにしました。


3.  イラストやスマホの予約画面のデザインをいれ、利用意欲が上がるよう誘導する

「SYSTEM」ではイラストを使用することで、文字のみになるのを避け、わかりやすいようにしました。CTAでは予約アプリのUIを制作し、アプリでも予約がしやすそうと、誘導できるように意識しました。


4. ペルソナと企業のイメージあうトンマナにする

クライアントがビジネススクール、ペルソナが「自己成長したいという意欲が強い女性」のため、暖かみはだしつつ引き締まる配色にしたいと考えました。そのため、配色は暖色系のゴールドに近いアイボリー、寒色系の濃いネイビーをメインで使用しました。また、堅実性のイメージのある四角形を中心としたデザインにし、結果にコミットしそうというイメージを出しました。


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

1. ペルソナや目的を考えることで、相手が求めるデザインが完成する

今回の課題では、どのセクションのデザインも、常に「目的とペルソナ」の事を考えてデザインを進めていることに気がつきました。そのため、自分が実際にWEBページをデザインする際は、細かくヒアリングをし、クライアントが本当に求めている事を意識することを考えて行動をするようにします。


2.  デザインのインプット、アウトプットする力

今回の目的に沿ったデザインにするために、コワーキングスペースのWebページや、Pinterestでイメージに近いデザインを集め、5~6種類のWebページを参考ににして進めました。またインプットができても、理想の形にするためにはどんなアウトプットにすればいいのか、というのも時間を要したため、自分で形にしていくことの大切さも制作を通じて経験できました。