• SELECT MENU

2020.09.04

採用サイトをデザインするときの5つのポイント【UXの5段階モデルにおける骨格・表層段階のデザイン】

ATSUSHI SEKIGAWA
[DESIGNER]
早く釣りキチに
なりたい

採用サイトをデザインするときの5つのポイント

オンライン化が加速する採用市場

ウィズコロナ時代の到来によって、企業説明会や面接など採用活動のオンライン化が急加速している採用市場。SNSの活用やオンラインイベントの開催など、新しいコミュニケーション手法が増える中、各企業が学生や求職者に向けて対面せずに自社の魅力を伝えられる『採用サイト』がこれまで以上に重要になってきます。

今回の記事では、採用サイトにおける実際にユーザーが目にし触れる部分のデザインを、UXの5段階モデルになぞらえてまとめました。

目次

  1. 🎣 UXの5段階モデルってなに?
  2. 🐟 採用サイトデザインの5つのポイント
  3. 🍣 まとめ



🎣 UXの5段階モデルってなに?

事業戦略や目標を達成するwebサイトとするためにはチームのメンバーがコンセプトを見失わないことが大切です。UXの5段階モデルは、戦略部分からユーザーが触れる表面上の部分までを5つのフェーズ(戦略・要件・構造・骨格・表面)に分け、コンセプトを見失わず戦略からアウトプットまでをブレなくスムーズにつなぎ合わせ、ユーザーに対して品質の高い体験を提供するのに役立つ概念です。

目的から筋道を立てながら論理的にデザインを設計することが可能になるので、クライアントとの認識ズレが軽減したり、各フェーズの承認が得られやすくなるので、採用サイトにもこの概念はとても役立ちます。

UXの5段階モデルについてのより詳しい説明は、以下のgoodpatchさんの記事がとてもわかりやすいので参考にしてみてください。

UXデザインにおける5段階モデルとは?

🐟 採用サイトデザインの5つのポイント

骨格段階と表層段階のデザインは、実際にユーザーが触れ、体験する部分であり、これまでの3段階(戦略・要件・構造)で築き上げてきたものを反映しながら、採用サイトとして適切なアウトプットにならないと、結果として目的が果たせず、求職者にも届かないものになってしまいます。

目的に対しての成果やユーザーの体験価値を最大化できるように、採用サイトをデザインするときに気をつけたいポイントを紹介します。

1.わかりやすく使いやすいUIに

求職者に対してWebGLなどでワクワクするような演出をすることも時に必要ですが、それ以上にサイト内を見て回るときにストレスがないことがとても大切です。どの企業の採用サイトにも求職者は情報を取りに来ています。その行動を手助けできるような、わかりやすく使いやすいUIでユーザーの体験価値を高めましょう。

たとえば、ページを遷移させるためのボタンのラベルを、特に理由もなく「more」などにするのではなく、できるだけユーザーにとってわかりやすいラベル名を心がけることが大切です。

2.コーポレートカラーは尊重する

基本的なことですがコーポレートサイトをデザインする場合はコーポレートカラーは遵守です。たとえば味の素さんのwebサイトに訪れ、メインのカラーがブルーだったら、ほとんどのユーザーが違和感を感じると思います。コーポレートカラーにはCIとして企業のイメージも内包されているので、コーポレートサイトで無闇なカラーリングをすることはやめましょう。
しかし、採用サイトに関してはカラーの取り扱いについての考え方が少し変わるときがあります。
それは企業が消費者に向けて打ち出しているブランドイメージと求職者に求めることにギャップがある場合です。

たとえば、グリーンをコーポレートカラーとしている優しさと安心を提供する医療系メーカーが、実は採用したい人物像については新規事業や新しいプロダクト開発などに主体性をもって挑戦してくれるようなエネルギッシュな人だった場合、もともとある企業イメージとグリーンというカラーイメージから、求める人物像に刺さるデザインにすることは難しいかもしれません。

大切なことは目的を達成することなので、コーポレートカラーを尊重しつつ、メインとなるカラーを目的に合わせて変更する提案をしても良いと思います。

3.他社と差別化した印象的なサイトに

採用サイトに関わらず昔からよく言われていることですが、競合他社と差別化した印象的なサイトデザインにしましょう。新卒の場合、各企業が同時に採用サイトを公開し、大学生一人につき20社前後の企業を受けているので、採用活動の中で求職者たちの脳裏に残るようなコンテンツやデザインが必要になります。企業名を変えれば他の企業サイトにも見えてしまうデザインは避けましょう。

採用サイトに関わらず印象的なサイトになるように僕が心がけているのは、形容できるデザインになっているか?ということです。たとえば「矢印の会社」「車が写真の隙間を走ってるサイト」「真っ青なサイト」など、企業名以外に引っ掛かりを残すデザインにしています。

4.メインとなるビジュアルで全てを説明しようとしない

採用サイトのメインビジュアル一つでいろいろ伝えたくて、結局何が伝えたいのかを考えさせてしまうビジュアルは、見た人の記憶にも残りづらいので避けた方が良いでしょう。ビジュアルだけでなくサイト内のテキストや写真、コンテンツと合わせれば十分に伝えたいことを伝えられます。

メインビジュアルは最も伝えたい(感じて欲しい)ことを端的に伝える旗印として、求職者の感情を動かし企業の採用スタンスを感じさせることがとても大切です。

5.コンセプトや目的にあったトーン&マナーを全てのページに

コンセプトや採用スローガンとマッチしたインタラクション・デザイン・コピーワークをTOPページだけでなく、下層ページまで反映させることで、一貫した採用イメージを伝えることができるので、よりユーザーの記憶に残りやすい採用サイトになります。

🍣 まとめ

今回の記事では、採用サイトにおけるUX5段階モデルの骨格と表層段階にあたる、デザインをするときの5つのポイントを紹介しました。

株式会社コンテンツでは企業の採用活動のお手伝いとして、様々なデザイン・サービスの提供をしております。ぜひお声がけください!

実際に担当した事例については、こちらをご覧ください。

glasses

[397]

Webデザイン

株式会社コンテンツへのお仕事の
ご相談・ご依頼は、
下記よりお待ちしております。

※Zoom、Teams、Google Meetなどオンライン会議ツールによる打ち合わせが可能です。
ご希望の方は書き添えていただけると幸いです。

© Contents Co.,Ltd.