LP制作（PC/SPデザイン・実装）

✴︎ クライアント情報 ✴︎

ベビー用品をメインとし、ママの育児をサポートするコミュニティ事業や家族みんなが幸せになるフォトブック事業などを展開している。軸はベビー用品だが、今後ママ・パパ・家族向けのサービスも展開していく予定をしている。

✴︎ 要件 ✴︎

目的 ▶︎ LPを通して、カルチャーフィットしている人にエントリーをしてもらうこと

ターゲット ▶︎ 転職希望の方、世界観に共感している人、カルチャーフィットしている人

トンマナ ▶︎ 明確に定まっていないため、自由に提案してほしい

✴︎ ユーザーストーリー ✴︎

目的とターゲットを理解した情報設計

カルチャーマッチした人材を採用することがこのLPのゴールであるため、そのための情報設計を考えました。

コンテンツの順番を決める際に、各コンテンツの目的と効果を書き出した上で優先順位付けをしました。また、事前に詳細なペルソナを立てたことで、ターゲットのペルソナの立場になってリアルなユーザーストーリーを考えることができました。

具体的には、上の図のようにユーザーストーリーを考えました。コンセプト・メンバー紹介・働く環境といった " 共感・魅力付け " のコンテンツを通してターゲットの「働きたい！」という温度を上げ、事業について・募集要項といった " より深く理解 " するコンテンツに進んでもらい、最終的なゴールであるエントリーをしてもらう流れです。

✴︎ 工夫したこと ✴︎

1. 「やさしさでつつむ」という言葉からトンマナを設定

トンマナは「やさしさでつつむ」という温かみのある企業コンセプトから、人の体温を感じるオレンジ色をメインカラーにして設定しました。手書き風の円やクレヨン風のあしらいによって、やさしい雰囲気を出しました。ホバー時のアニメーションも「ふわっ」とやさしく出るようにしています。

2. 調べて書くを繰り返したコーディング

初めてのコーディングだったので、SHElikesのWebデザインコースの動画の復習・Webデザインの本（いちばんよくわかるWebデザインの基本きちんと入門）、Webで検索を繰り返して制作しました。

✴︎ 制作したLP ✴︎

実装したサイトはこちらです。

✴︎ 制作を通して学んだこと ✴︎

1. 実装を意識したデザインを制作する重要性

今回の課題はデザインを制作してそれを実装する必要があるので、実装を意識したデザインを心がけました。事前に参考サイトのデザインを研究して制作したので、htmlとCSSでベースを制作することは比較的スムーズにできました。

ですが、まだまだhtml・CSS・jQueryの理解が浅いこともあり、アニメーション部分は複雑で難しく100%完璧な状態で実装できていません。引き続きブラッシュアップをしていきます。

2. ペルソナ設定の重要性

LPのターゲットについて理解するために、詳しくペルソナを立てました。具体的なペルソナを立てたことで、ユーザーストーリーが作りやすくなり、情報設計に納得感が出ました。

今後も実践を通して、デザインと実装のスキルを向上させていきたいと考えています。