＜課題概要＞
クライアントからの要件書を元に、ワイヤーフレームからデザインカンプ作成、実装、サーバーアップまでを一通り行う。
＜制作依頼書＞
＜LPのコンセプト・テーマ＞
TSUSTSUMU 株式会社の価値観を伝えられる採用サイト。赤ちゃんだけではなく、ママ・パパ・家族全員を支えたり繋げたりしてサポートする。温かさやみんなの幸せが伝わってくるサイト。
採用サイトとして、きちんと分かりやすく情報を伝えることや、エントリーへの導線も明確にしている。
＜ムードボード＞
＜ユーザーストーリー＞
１．1stビュー：キービジュアル＋キャッチコピーで会社の雰囲気や大事にしている世界観を知り、好印象を受ける
２．私たちについて：企業理念を読み、共感する
３．事業について：具体的に何をやっている企業なのか知る
４．募集職種：自分が応募するならどんな職種か？または希望の職種があるか？確認する
５．働く環境：働きやすいか、福利厚生が希望条件に合うか
６．メンバー紹介：働き始めたらどんな人たちと一緒になるか？あるいは自分の未来の姿として、〇年後のキャリアをイメージする
７．エントリーページへ。すべて読まなくても「応募したい！」と思えたタイミングでエントリーできるよう、追従ボタンも設置
＜ワイヤーフレーム（PC/スマホ）＞
＜デザインカンプ（PC/スマホ）＞
サイトの目的・ゴールが達成されるデザインになっているかどうか、終始気を付けて制作しました。制作期間が長くなればなるほど、最初に設定したコンセプトからブレそうになるので、要件定義・ユーザーストーリー・ムードボードと逐一見比べながら進めました。
http://shiho-0222.cutegirl.jp/practice-5/
＜工夫した点、学んだことなど＞
HTML・CSS・jQueryについて、自分で一からLPを作ることが出来る一通りの知識を学びました。また、コーディングで実装した時のサイズ感や動きまで意識したLPデザインが出来るようになりました。
特にコーディングについては、今回の課題で学べることは出来るだけ吸収したいと思い、最適なデザインや動きを再現するために、自分で調べたり講師に聞いたりして自分の中に知識を蓄積していきました。
Photoshopでデザインしていた時と、実際にコーディングした際の印象の違いも制作中に感じられました。ワイヤーフレーム作成→デザインカンプ作成→コーディングの流れの中で、最初の意図と違う画面になってしまったときは、都度元のデザインから修正・調整に戻っています。作業効率が悪く時間もかかってしまいましたが、課題だからこそ時間をかけてでもインプットを意識して取り組みました。
結果的にデザインカンプ作成以外の全体のサイト制作の流れも意識したアウトプットをする力が身についたと思います。
５週間のスケジュール管理や、最初から最後までサイトを作る目的がブレないことを意識するのも、今後のデザイン制作にあたって大切な学びになりました。