11d444c3270a873c

【課題】LPデザイン(カフェ&コワーキングスペース)  A案

OVERVIEW

2021.0ct // SHElikes MULTI CREATOR COURSE受講中に、"WORK lounge Aoyama"という架空の会員制のカフェ&コワーキングスペースのLPデザインを行いました。

【制作期間】40時間(3週間)

【制作範囲・依頼物】

制作範囲 ②ペルソナ深掘り・デザインコンセプト 〜 ⑥情報設計など

依頼物 ③ワイヤーフレーム(既存のPC版ワイヤーフレームを修正+SP版作成)

    ④デザインカンプ(PC版、SP版)

    ⑤スタイルガイド

【使用ツール】Illustrator

目次

 ① 依頼概要と規定のペルソナ

 ② ペルソナ深掘り・デザインコンセプト

 ③ ワイヤーフレーム

 ④ デザインカンプ

 ⑤ スタイルガイド

 ⑥ 情報設計など

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


①依頼概要と規定のペルソナ


②ペルソナ深掘り・デザインコンセプト


③ワイヤーフレーム


④デザインカンプ


⑤スタイルガイド


⑥情報設計など


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

情報設計に基づいた配置やヴィジュアルデザイン

ページの全体の流れや目的への誘導を考えながら要素を配置していくことでユーザーがよりスムーズにLPをみることができるので情報設計の大切さを実感した。また、競合他社のLPも見ることで第三者の目線に立ってみることができ、必要な要素や見せ方がわかるので大切だと思いました。

レスポンシブ対応を考慮した設計

PCのデザインカンプやワイヤーフレームの制作中にSPになるとどういう表示になるか、どういう表示にするのかを考えながら制作することで、PCの設計をよりスムーズにSPに移行できることがわかった。また、PCではスクロールとクリックだが、SPではスワイプとタップになるので、操作性の違いやどういう気持ちで見る(より詳しくみたい、軽い気持ちでみたいなど)のかということも考慮しながらデザインできるといいのかなと思いました。

様々なアプローチからのヴィジュアルデザイン

ヴィジュアルデザインの方向性を決める段階で、多くの関連するキーワードやイメージ画像をあげ多方向からアプローチすることで、少ない情報でもデザインの幅を広げられることがわかりました。さらにそのキーワードなどを合わせていくことによって、よりしっかりとした意図があるデザインができることがわかりました。


最後まで目を通していただき、ありがとうございます。