岡山交通株式会社の新卒採用サイトを、HONOKAで制作しました。デザインからコーディング、CMS構築までを担当しています。
▶ 制作サイト：https://okayama-kotsu.com/recruit/
課題：新卒の学生に向けて、求人サイトをつくり直す
もともと使用していた求人サイトが使いづらい、という課題からのスタートでした。今回のターゲットは、大学院・大学・短大・専門学校の新卒の学生。これから社会に出る若い世代に「この会社で働いてみたい」と感じてもらえるサイトを目指しました。
狙い：あえて“らしくない”色で、新しい印象を
デザインで一番のポイントは、色です。岡山交通のコーポレートカラーは青ですが、今回はあえてそこから外し、黄色を基調にしました。狙いは、明るく新しいイメージを与えること。既存の会社の印象にとらわれず、新卒の学生に「フレッシュな会社だ」と感じてもらうための選択です。コーポレートカラーをそのまま使うのが定石の中で、あえて外すことで生まれる印象を狙いました。
さらに、斜めのオブジェクトを全体に効かせて、スタイリッシュな印象に。背景や写真の見せ方に斜めのラインを取り入れることで、まっすぐな四角の組み合わせにはない、動きとスピード感のあるデザインに仕上げています。
制作内容：シンプルだからこそ、色と形で印象づける
サイトは約7ページ。ページ数としてはコンパクトな構成です。だからこそ、色（黄）と写真・オブジェクトの形で印象を作ることに集中しました。要素を足して賑やかにするのではなく、絞ったからこそ効く見せ方です。
特に見てほしい箇所には、スライドなどのアニメーションを入れて、自然と視線が誘導されるように設計しました。読ませたい場所、伝えたい場所へ、動きで導く。シンプルな構成の中に、伝えたいことの優先順位をきちんと組み込んでいます。
技術：更新しやすさと、「社員の顔が流れる」動き
サイトはWordPressで構築しています。両備バスの中途採用サイトと同じく、デザイン・コーディングからCMS構築まで一式で担当し、採用担当の方が公開後も自分で更新できることを前提に設計しました。
職種紹介や会社概要などレイアウトの固まったページは固定ページで、社員インタビューのように人が増えたり入れ替わったりするコンテンツは、管理画面から追加・編集できる仕組みにしています。写真やコメントを登録すれば、一覧や詳細だけでなく、トップの動きのあるエリアにも反映される。作って終わりではなく、公開後も社内で育てていけるサイトです。
動きで特に印象的なのが、トップの社員紹介まわりです。よくある「スクロールすると一人ずつふわっと現れる」タイプではなく、社員の写真カードが横方向に、切れ目なく流れていく演出にしました。上の列は右から左へ、下の列は左から右へ。向きを反対にすることで視線が自然に止まり、眺めているだけで「こんなにいろんな人が働いているんだ」と伝わります。指で動かすカルーセルではなく、会社の顔ぶれを見せるための、常に動いている“人の川”です。社員が増えたら、管理画面に登録すればこの流れに乗る仕組みにしています。
採用サイトの制作をお考えの方へ
新卒向けの採用サイトは、ターゲットである学生に「らしさ」と「新しさ」の両方をどう伝えるかが鍵になります。色ひとつ、動きひとつで、伝わる印象は大きく変わります。岡山で採用サイト・リクルートサイトの制作をご検討でしたら、お気軽にご相談ください。困ったら相談してね！
Web Site:岡山交通株式会社採用サイト
Client:岡山交通株式会社
Direction+Design+Coding+CMS:HONOKA,Inc.