【架空案件】LPデザイン制作(コワーキングスペース)
SHElikes MULTI CREATOR COURSEにてクライアントからの要件書を見て、ワイヤーフレームがある状態からデザインカンプを制作しました。
【制作時間】96時間
【使用ツール】Photoshop
【制作範囲】情報設計、デザインカンプ制作
目次
|概要
|制作物
|頑張ったところ/工夫したところ
|制作を通して学んだこと
制作概要
◇制作したもの◇
頑張ったところ/工夫したところ
【作製したLPのコンセプトやテーマ】
・都会的でクリエイティブな女性
・高級感、ワンランクUP
【配色とフォント設定の理由/今回のサイトで伝えたいイメージ】
・グレー×ゴールドを使用
グレー→ペルソナから東京在住/キャリアウーマンということで、都会的なイメージとクリエイティブさを表現
ゴールド→ペルソナからスキルアップへの投資をしてきていることのことなので、高級感と華やかな女性を表現
・見出し→明朝体/本文→ゴシック体を使用
見出しに華やかさとデザインのイメージに合わせるために明朝体を使用
本文は可読性の良いゴシック体を使用
【メインビジュアル】
・既存会員のためにアプリダウンロードがすぐできるようにQRコードを配置(スマホカンプにはQRコードなし)
【UI/UXを意識したデザイン】
ボタンの大きさは大きめに。
スマホデザインでは並んでいるボタンにスペースをしっかりつけて配置しました。
制作を通して学んだこと
〈 制作 〉
・実装を意識した、余白のルール設定や、フォントの大きさのルール設定など今まで意識したことがなかったことを学ぶことができた。
・PC/スマホで変えていかなければいけないレイアウトなど学ぶことができた。
・ユーザーの視線を意識した要素の配置を考える大切さを学ぶことができた。
〈 感想 〉
・今回はワイヤーフレームがある状態からのデザインカンプ作成でしたが、実際にワイヤーフレームから作成するのに情報設計は大切だと感じました。
・クライアントとユーザー双方のニーズを満たすためのデザインを考えるのに時間がかかってしまいましたが、実際にデザインしていくのは楽しかったです。