【自主制作】LP ベビー用品企業の採用サイト

【制作時間】5週間 （WF：15時間、デザインカンプ： 25時間、コーディング:30時間）

【制作年】2025年12月～2026年1月

【使用ツール】Figma・VScode 

【使用言語】HTML・CSS・Java Script

|  制作物

※FVおよび「事業について」セクション内写真はAdobeFireflyを使用して作成

| 課題要件

| 制作背景・コンセプト 

TSUTSUMUが掲げるテーマから、特に今回「男性も当たり前に育児を担う社会」にフォーカスしました。それを体現するため、従来のベビー用品サイトにみられる甘い表現を抑え、「誠実さ」と「意志の強さ」を軸にデザインした。性別役割の固定観念を払拭し、男性も主体的に関われるよう信頼感のあるビジュアルを採用。大人の背中を子どもが見て育つ、家族全員の幸福を包み込む企業姿勢を、誰でも迷わず使えて情報が整理された画面設計で表現した。

| ペルソナ

課題要件から以下のペルソナを想定した。

| 情報設計・ユーザーストーリー

提供されたワイヤーフレームをもとに、ブランドコンセプトや訪問者の行動導線を意識しながら、情報設計を見直した。

・ユーザーストーリーを軸に、共感から理解・納得を経て応募へ進む情報設計とした 。
・キービジュアルや社員・事業紹介を通じて、企業理解を段階的に深める構成とした 。
・働く環境や社員の一日を具体的に示し、自身の働く姿を重ね合わせやすくした上で、CTAへ迷わず進める導線を設計した 。

| デザインコンセプト

ターゲットに対してTSUTSUMUが掲げる「世界をやさしさでつつむ」というビジョンが直感的に伝わる世界観を構築した。

｜ キーワード

「誠実」「家族」「暮らし」「生成り」「日常」「日々」  

作り込まれた理想像ではなく、実際の生活の延長にあるありのままの子育ての風景を切り取ることで、性別を問わず自然に育児に関わる姿を表現し、企業の誠実さと信頼感が伝わる世界観を設計した。

｜ 配色

・採用サイトであることと、ママ向け事業＝オレンジやピンクの暖色という固定観念を排し、性別を問わず自分事として捉えられる印象を目指した 。
・ベージュを基調に、装飾を抑えた余白のあるトーンを採用 。
・メインカラーはCTAなど行動を促したい箇所に限定し、アクセントカラーは視線誘導に用いた 。

｜ 意図・与えたい印象 　

・採用サイトとして、誠実さや企業としての信頼感が自然に伝わることを重視 。

・知的で落ち着いたプロフェッショナルな印象 。

・やさしさと誠実さを感じさせつつ、男性や多様なキャリアを持つ層にも自分事として捉えてもらえる配色バランスを目指した 。

| 工夫したところ|まとめ

• 情報設計・デザインカンプ・コーディングは相互に密接につながっていることを理解した 。

• 情報設計段階で優先順位を明確にすることで、以降のデザイン判断や実装がスムーズになると実感した 。

• 表現の美しさだけでなく、「課題をどう解決するか」という視点を持つことが、意図が伝わるサイトとしての説得力につながると感じた 。