LP制作 ｜情報設計〜実装

▍要件

-クライアント情報

クライアント名:TSUTSUMU 株式会社

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

-目的

 LPを通してエントリーをしてもらうこと(エントリーがあれば誰でもいいわけではなく、カルチャーフィットする方)

-ターゲット

・転職希望の方

・報酬面よりもTSUTSUMUが作っていきたい世界に強く共感してくださる方

・各職種において全くの未経験よりは経験を重視したいが、それよりもカルチャーフィットしている人がターゲット

▍制作したLP

実際のサイトはこちら

▍制作ポイント

-ペルソナとユーザーストーリー

-制作したLPのコンセプトやテーマ

ベビー用品の採用サイトなので、子供の絵本のような色でかつ、大人らしく仕事や真面目さをイメージさせるようなシンプルなWebページを作成しました。

TSUTSUMUという会社名から、やさしさ、やわらかい、あたたかいを想像し写真と色を選びました。写真の角等を丸くして見た目にも赤ちゃんにもやさしくして、応募する方の緊張している気持ちが和らぐようなものにしました。

キービジュアルはおかあさんがあかちゃんの手をつつんでいる写真にしました。

今後は家族向けサービスの展開をしていくと依頼内容にあったので、私たちについてには家族の楽しそうな写真を入れています。

会社名ロゴと「世界をやさしさでつつむ。」がふわっと出てきて、一番目立たせたい会社名ロゴをヘッダーに持っていくことで、会社名を覚えてもらえるような動きをつけています。採用サイトなのであまり派手なアニメーションはありませんが、写真の位置が交互になるように単調にならない視覚的な動きや背景色配置を意識しました。

働く環境と募集職種はボタンを並べると奇数でバランスが悪く、余白の開け方や文字の大きさを意識しました。

エントリーの写真はあかちゃんがぬいぐるみをつつんでいるものにして、応募する方の緊張している気持ちが優しい気持ちになって応募できればと思いました。

▍制作を通じて学んだこと

webサイトは文字でできていること。HTMLとCSSに載せる画像の違い。Photoshop上とウェブ上では見え方に違いがある。レスポンシブでの表現方法。

コーディングははじめてで不安でしたが、何事も楽しむという目標で取り組みました。反映されない部分が解決した時の嬉しさは、成長欲の強い私にはとても刺激的で楽しかったです。もっと深く知りたいという気持ちで溢れています。