【デザイン】LP(コワーキングスペースWebサイト)

OVERVIEW

SHElikes MULTI CREATOR COURSEの課題で、コワーキングスペースのWebサイトのデザインカンプを制作。クライアント様からの要件書とワイヤーフレームをもとに、PCとSPのデザインカンプを制作しました。(制作時間:約2週間)(Photoshop使用)

YEAR 2021

<目次>

① 要件
② ワイヤーフレーム
③ 制作したLP(PC版/SP版)
④ 制作にあたって工夫したところ
⑤制作を通して学んだこと


① 要件

②クライアント様よりいただいたワイヤーフレーム


③制作したLP(PC版/SP版)


④制作にあたって工夫したところ

◼︎メインターゲットが20〜30代の女性
⇒女性らしくシンプルで落ち着きのあるシックな感じのデザインに。
利用方法やコンセプトなどの文字情報が多くなってしまう部分
⇒写真やイラストを使用し、流し読みをしても何が書いてあるか直感的にわかるレイアウトに。

◼︎サイトのコンセプト「理想の姿に向かって頑張るあなたへ」というところから...
⇒自身がデザインするうえで「シンプルに淡く、寄り添う」という言葉のコンセプトを設定。


【配色】ピンク・白色・モスグリーンをメインに使用

ピンク:きついピンクやパステルなピンクではなく、淡く少し濁りのあるピンク
⇒女性らしさを演出。落ち着いた色味で20〜30代向け。
白色:清潔感の演出。
モスグリーン:自然の色味として。
⇒ピンクと白だけでは少し甘いページとなるため、それを抑えつつ、女性の豊かさを演出。

工夫したポイント】
クライアントとペルソナの情報+自分が使う立場になって考えてみました。

1.いただいたワイヤーフレームに情報を追加

▷トップの部分にSNSと新着情報の追加

女性の方は特に20 〜30代の方は、SNSで情報を収集することが多いため、こちらを載せることでより興味を持ってもらえるようにする。また、上昇志向の女性をターゲットとし、ネットを扱うスペースなのでSNSも使いこなしているというアピール。クライアントがイベントも行っているとのことでしたので、このスペースでもイベントがあったら食いつきやすいかなと思い、まず目に付くトップに配置。


▷サービス項目の追加



2.コンセプト部分の写真

こちらを向いている笑顔の女性にしたことで、「この場所に来たら、あなたもそうなれるよ」という意味を込めています。


3.ドリンクメニュー項目をカフェっぽく。

作業をするスペースであっても、おしゃれさには惹かれると思います。女性の間ではカフェ巡りが流行っていて、写真からその空間がおしゃれだとわかれば、場所を選ぶポイントの1つにもなると思ったからです。

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

自分の考え方次第でデザインはどのようにも変わるということを学びました。したがって、いかに自分がクライアントの意図に寄り添いながら、ペルソナをしっかりイメージできるかが大切なのかなと感じました。また、同じようなデザインでも、余白や文字のデザインひとつで見え方が大きく変わることが身をもって体感できました。