目次
①制作情報
②要件
③制作物
④情報設計
⑤工夫したポイント
⑥制作を通して学んだこと&感想
①制作情報
制作時期:2024年12月
制作時間:2週間
使用ツール:Photoshop
制作の目的:
・ワイヤーフレームがある状態からデザインカンプを制作することに挑戦する
・イメージを固めるためのムードボード作成に挑戦する
・Webデザインをする際に気をつけるべき点を学ぶ
・前回の課題でインプットしたPCとスマホのレイアウトの変化を自分で考えられるようになる
②要件
・クライアント情報
〈クライアント名:WORK ,inc. 〉
女性向けのビジネススクールを展開している。会員は20~30代の女性が多く、キャリアアップのためにビジネススキルを学び、さらにそのアウトプットの場として定期的にビジネスコンテストなどのイベントも開催されている。
・目的
会員様限定のカフェ&コワーキングスペース「Work Lounge Aoyama」を新オープン予定に伴い、同スペースの認知拡大&ビジネススクールWorkの会員を増加を目的としてWeサイトを立ち上げる。
・ターゲット
ビジネススクールWORKの会員様
ビジネススクールWORKの会員ではないがWORKが気になっている方
20~30代のビジネス感度の高い女性
・ペルソナ
属性:30代 既婚女性 東京在住
背景や行動:さらなるキャリアアップを目指している。自己学習意欲がある。
同じような活動的な人と繋がりたいと思っている。
・ニーズやゴール
さらなる仕事の成果を求めている。
マネジメントやコーチングに興味があり、自分だけではなく所属する
チームのレベルアップにも貢献したい。
③制作物
④情報設計
ー要件の内容から情報設計をさらに深掘りし、元のWFを見直しました。
・ユーザーストーリー
目的としている「コワーキングスペースの認知拡大」「ビジネススクールWorkの会員数拡大」を達成するために、ユーザーにとってほしい行動とプロセスを組み立てました。
■1引き付け(トップ画面)
=おしゃれなコワーキングスペースだな
=(会員なら)気になる~
■2引き付け②(CONCEPT:女性・会員限定)
=ちょっと気になる
■3利用イメージ(SPACE:施設の紹介)
=いろいろな部屋がありそう!
=一人でも複数人でも使えるしサービスも充実してるな~
=カフェもあるんだ!
■4サービスの案内(SERVICE:各種設備の紹介)
=設備も充実してるんだ!最低限の荷物で済みそう!
■5具体的なご利用方法の案内(SYSTEM:連携アプリも紹介)
=なるほど!こうやって利用するんだ!アプリで予約とれるのもいいね!
■6料金案内(PLICE:料金形態の紹介)
=利用料金はこれくらいなんだ!利用ケースでお値段も変わるのか。
■7よくある質問(FAQ:よくある質問)
=なるほど~(想定される疑問をここで解消)
■8アクセス(ACCESS:場所の掲載・案内)
=場所はここか!行ってみたいな!
・ムードボード
組み立てたユーザーストーリーから、LPのイメージボードを作成しました。
・ワイヤーフレーム
組み立てたユーザーストーリーから、ワイヤーフレームを見直しコンテンツを追加&変更していきました。
⑤工夫したポイント
・配色
クライアントへのヒアリングを経て、ターゲット(30代女性)に刺さりやすいイメージを「活動的」「外交的」「スキルアップ」「知的」等と解釈しました。
そこで、女性的であり、かつ落ち着いた印象のベージュとくすみピンクをベースとして、(ピンクの反対色でもあり、)知的等の勤勉さ(向上心)を連想させるグリーンをアクセントカラーに添えました。
・見て伝わるイラストやアイコンを使用
直感的に内容が伝わるイラストやアイコンを使用しました。LPのトンマナに合わせてシンプルで分かりやすいデザインにしました。
・ワイヤーフレームの見直し・コンテンツの追加
LPの目的や要件からワイヤーフレームの内容を見直し、他社サイトと比較しながらユーザーが自然に下部までスクロールできるよう、各コンテンツの順番を検討しました。
⑥制作を通して学んだこと&感想
ー学んだことー
・目的に沿ったデザインを作ること
LP制作の目的を的確に把握・理解することの大切さ、目的達成のためにクライアントの要件を深掘りし、情報設計をしていくことの重要性を学びました。
・WEBデザインの基礎
ワイヤーフレームの設計からPC・SPそれぞれのUI/UXを意識した構成を考えることや、フォントサイズや余白に規則性を持たせることも大切だということを学びました。
ー感想ー
・今回の課題はこれまでの課題と比べ、格段にクライアントワークを意識することができる内容でした。依頼内容に基づいてイメージを膨らませ、自身ではじめからデザインを作ることに初めて挑戦しました。苦労もしましたが、わくわくしたあっという間の2週間でした。