コワーキングカフェ LP制作(ワイヤーフレーム、デザインカンプ)

OVERVIEW

SHElikesマルチクリエイターコース内で取り組んだLPデザイン制作課題です。クライアントの要望から要件定義を行い、PCとスマホのワイヤーフレーム作成、PCのデザインカンプ作成を行いました。

YEAR 2023

【制作概要】

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

使用ソフト:Illustrator、Photoshop

制作期間:約2週間

制作時間:約20時間


●クライアントの要望

・ビジネススクールが運営する、新規オープン予定の会員限定カフェ&コワーキングスペースの利用方法やアクセス情報を載せたWebサイト。

・PC版のデザインカンプ、スマホ版のワイヤーフレームの制作。

● クライアント情報

クライアント名:Work ,inc(架空)

20代~30代の女性をメイン顧客とするビジネススクール。

●目的

・カフェ・コワーキングスペースの認知拡大

・利用をきっかけにスクール会員を増やすこと。

●ターゲット

・スクールの既存会員、スクールに興味を持つ非会員

・ビジネス感度が高い20代~30代女性


【制作物】

【工夫したポイント】

●クライアントの要望に沿ったコンセプト設定とモチーフ

キャリアアップへ強い意欲を持つ女性がターゲットであるため、コンセプトとして「前に進んでいく女性を応援する」というものを考えました。そのコンセプトを表現するために「すごろく」をモチーフにしてみようと考えました。

コンテンツをドットのラインで繋ぎ、コマを進めていくイメージにしました。

すごろくの様に、進んでいく未来を楽しんでほしい、自分が思い描く未来を想像してもらいたいという思いを表現しました。


●ターゲットに合わせた配色とフォント

・配色

今回のターゲットは20〜30代の女性ではありますが、上昇志向の強い、キャリアアップに意欲的な方です。まだ男性が有利な社会構造のなか、男性の中に混じって渡り合おうとする心持ちの女性なのではないかと考えました。

ユニセックスな雰囲気にしたいと思い、ベースカラーには白とベージュ、くすんだグリーンをメインカラーとし、アクセントカラーでアプリへの誘導部分でのみピンクを使用しました。


・フォント

カフェとしてのリラックス感も表現したかったため、コピー部分には優しく丸みのある筑紫B丸ゴシックを、本文では可読性を重視してZen Kaku Gothc New、PTsansを使用しました。


【制作を通して学んだこと】

・余白やフォントなどルール化して実装を意識しながらデザインを作ることを身につけることができました。

・配色やフォント、装飾でページ全体に統一感を持たせながらも、ユーザーに飽きさせない工夫も重要であると感じました

・モチーフを設定したものの、どうデザインに落とし込むかに時間をかかりました、その他の情報設計を改善する時間を作るべきだったと思います。引き続きブラッシュアップしていきます。