【制作課題】LP制作・実装（採用サイト）

Mai
何でもデザイナー
OVERVIEW

架空の企業の採用サイトの制作課題に取り組みました。ワイヤーフレームの作成からサーバーアップまで一貫して行いました。

-所要時間：合計 約71時間（情報設計：9h、デザイン制作：25h、コーディング：37h）

-制作期間：6週間

-使用ツール：Illustrator/Photoshop/Lightroom

目次

・制作・実装したLP

・要件

・制作のポイント

・ 制作を通して学んだこと

制作・実装したLP

要件

・クライアント情報：

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

・目的：
LPを通してエントリーをしてもらうこと（採用強化のため多くの方にエントリーしてほしいが、エントリーがあれば誰でもいいわけではなく、カルチャーフィットしている人がに応募してほしい）

  • ターゲット：

-転職希望の方

-報酬面よりTSUTSUMUの世界観に強く共感できる方

-未経験よりは経験を重視したいが、それよりもカルチャーフィットしている

・トンマナ：

明確なブランドトンマナが決まっていないため、事業内容にあうトンマナを自由に提案してほしい

制作のポイント

・ペルソナの設計：

今回の課題では、自分でペルソナを設計しました。

・ユーザーストーリーの設計：

カルチャーフィットする候補者からエントリーしてもらうために、どのようなコンテンツでどういった順番が良いか検討し、ユーザーストーリーを設計しました。

-ポイント①-

コンセプト、事業内容、メンバー紹介をページの上部へ配置

カルチャーフィットする候補者からのエントリーが目的のため、コンセプトや事業内容に共感し、はたらくメンバーに魅力を感じていることが大切だと考えたからです。

-ポイント②-

FAQセクションの追加

応募をする上で気になる点について記載しておくことで、候補者も疑問が少ない状態でエントリーができると考えました。また、企業様にとっても回答する手間や時間の解消になるため、追加しました。


・デザインのコンセプト設定：

①デザインのテーマ

採用サイトに来た人にTSUTSUMUの思いがスッと入って来て、コンセプトに強く共感を得られ、こんな会社で働きたい！と思ってもらえるようなデザイン

-テーマの理由：

今回の目的が、カルチャーフィットした方からのエントリーのため、TSUTSUMUのコンセプトに強く共感してくれることが重要と考えました。そのため、コンセプトへの共感を重視したテーマにしています。

②キーワード

ノスタルジック、あたたかい、幸せ感、ふんわり、優しい、木漏れ日、シンプル、じんわり響く、家族、私の人生、親の愛

採用サイトのため、子供子供しすぎずにじんわりと家族感や子供の雰囲気を演出した方がいいと考えました。今回のペルソナは、仕事も家族の時間も大切にしたいタイプで、自分にとっての大切なもののプライオリティがついている女性をイメージしています。そのペルソナに対しては、ポップでカラフルな雰囲気よりもスッキリでシンプルなデザインの方が心に残ると考えました。

③イメージボード

＜参考にしたデザイン＞


＜参考にした採用サイト＞


・スタイルガイド

・配色の理由：

-グレーを選択した理由

カルチャーフィットする候補者からのエントリーが目的だったため、コンセプトや事業内容などの文章はじっくりと読んでほしいと考えました。そのため、シンプルで邪魔をしないノスタルジックな雰囲気にもマッチするグレーを選択しました。

-ピンクを選択した理由

ピンク色には、愛情や優しさなどをイメージさせる色で、今回のデザインのテーマである【愛情、優しさ、あたたかさ】を表現するためには、ピンクが適切だと思い選択しました。また、今回はピンクの中でも、少しくすみがあるピンクを選択し、全体的な雰囲気と馴染むようにしています。

・フォントの選択理由：

-源ノ角ゴシックJP

視認性が良く、少し丸みがあり、デザインイメージのやさしさや愛情などの雰囲気とマッチするため、選択しました。

-遊明朝体

読みやすく、メリハリのある書体のため、「世界をやさしさでつつむ」のワードがしっかりとペルソナの目にとまるのではないかと考え選択しました。

-Gill Sans

読みやすく、丸みがあり、デザインイメージのやさしさ、愛情などにマッチするため選択しました。


制作を通して学んだこと

・目的達成を考えたデザインをすること

【目的を達成するために必要なことは何か】を考えて情報設計からデザインに落とし込むことが大切だと学びました。今回は、エントリーしてもらうことはもちろん、カルチャーフィットした人からエントリーしてもらうことが重要だったので、カルチャーフィットした人がエントリーしたいと思うには、どの情報をどう表現するかを考えてデザインしました。デザインの知識はもちろんですが、マーケティングやブランディングなどの知識も必要になると感じました。

・コーディングを考えたデザインをすること

コーディングをする時のことを考えたデザインの制作も大切だと学びました。デザインのことだけ考えて制作すると、いざコーディングしてみるととても手間がかかったり、実装が難しいケースがあったので、デザインする段階で、実装する時のことを考えたいと思います。

・レスポンシブ を考えたデザイン

SPのデザインをする時に、PCのデザインからレイアウトを大きく変えてしまうと、レスポンシブ対応が大変になってしまうので、どうしたらPCからSPにシンプルに変更ができるかを考えてデザインをしたいと思います。