キャッチーで独創的な世界観。就職活動生が思わず“クスッ”となるような新卒採用サイト

Structure

就職活動生に“響く”とは？を追求した採用サイト設計

新卒採用に注力しており、メインのユーザー層が就職活動中の大学生であることも踏まえ、キャッチコピー『馬鹿よ来い』のもと、日テレアックスオン様よりご提供いただいたコンテンツの一つが「おバカ診断」です。

「あなたは時代を創るおバカですか？」という問いかけの下にチェックボックスを用意し、「友達がドブに落ちてみんなに笑われている。すかさず自分も落ちて大笑いする。」「自分の大失敗は、テッパンのすべらない話になっている。」など、自分に当てはまるものにチェック。診断をクリックすると「時代を創るおバカ度」のパーセンテージとともにエントリーボタンが表示される仕組みになっています。

「おバカ診断」などのエンタメ要素を含むコンテンツをスクリーンショットした際に、SNSなどでもシェアしやすいように一画面に収まるサイズにするなど、スマートフォンでも閲覧しやすい設計にしました。

配置では、日テレアックスオン様のボリュームある充実した既存コンテンツを、就職活動生に向けてわかりやすくコンパクトに、かつ網羅的に伝えることを重視しています。一例として、会社について伝える「COMPANY」では、パパママクリエイターへのインタビュー・研修制度・福利厚生の3項目を1ページの中でタップで切り替えられるように。インタビューも人ごとにタップで記事が切り替わり、ボリュームあるプロフィールもスクロールして一つのサイズに収まるように設計しています。

Identity

コミックス風の表現を取り入れ、テレビ業界らしさ満載のスタイルに

日テレアックスオン様よりご提供いただいていた、キャッチコピー『馬鹿よ来い』と素材に基づき、テレビのテロップやフォントからも着想を得て、全体をコミックス風のポップで賑やかなテイストに仕上げました。

装飾要素として吹き出し素材を随所に配置。「おバカ診断」の背景には、コミックの集中線（漫画やイラストで使われる効果線の一種）から着想を得て、ストライプの集中線を装飾として採用しました。診断コンテンツの臨場感を高め、ユーザーの注目を中心部に集める視覚的なインパクトを生み出しています。

背景にも水玉模様や派手なストライプを使用するなど、そのテクスチャー感からも世界観を演出しています。

Design

テレビ演出技術を取り入れた世界観のあるデザイン

最も注力したのが、日テレアックスオン様からご提供いただいたコピーやイラストを、いかに世界観に馴染ませていくのか。黒いエッジの効いたキャラクターのイラストなどを起点に、既存の要素を最大限に活かせるようにデザインに落とし込んでいきました。

右下に表示されるエントリーボタンは、テレビ番組でよく用いられる、画面内に小窓状に映像を表示させる技術「ワイプ」を採用しています。働く人を紹介する「PEOPLE」のプロフィール欄には、テレビ番組内で紹介する情報などを文字や図を使ってわかりやすくまとめた「フリップボード」をベースに。映像コンテンツ制作会社らしさをサイトのあらゆるところに散りばめています。

アニメーションにおいては「動き」のあるものを多く取り入れています。サイトのトップは訪れた瞬間に馬と鹿のイラストが左右から、「馬鹿よ来い」の文字が下から中央に向かってスライドしてくるかたちに。企業からのメッセージの一部の文字も動いたり、「おバカ診断」のコンテンツではサイドからキャラクターが飛び出てきたり。思わずクスッとなるような、ユーザーが興味を持ってスクロールしたくなるアニメーションに仕上げています。