2026.08.23

“いいデザイン”で終わらせない。採用サイトで成果を出すUI/UXディレクションの舞台裏、ぜんぶ話します

Webデザイナー仕事のこと
# コピーライティング# ペルソナ設計# 候補者体験設計# 導線最適化# 採用サイト改善

ペルソナ設計で「誰のための採用サイトか」を徹底的に絞る

採用サイトのUI/UXは、最初のペルソナ設計で8割決まります。ジェイ・ラインの案件では、まず「候補者の一日」をストーリーで書き起こすところから始めます。
・今どんな環境で仕事をしているか
・転職を考え始めたきっかけは何か
・スマホで求人を見る時間帯・シチュエーションはいつか
こうした情報を、人事担当者へのヒアリングと既存社員インタビューから集めます。結果として、「20代後半・初めての転職・現職は忙しい営業」といった“解像度の高い一人”を描き、その人が思わずスクロールしたくなる文脈を、導線やコピーの判断軸にします。

導線設計でやりがちな失敗と「1クリック短縮」の考え方

採用サイトで多い失敗が、「会社を知る →仕事を知る → 人を知る → 応募」の4ステップを、グローバルナビにそのまま並べてしまうパターンです。一見きれいですが、候補者の本音は「応募するか迷っているから、まず条件と雰囲気を知りたい」。
ある案件では、トップから求人一覧までが3クリック必要で、離脱率が高い状態でした。そこで「募集職種」へのショートカットをファーストビュー直下に設置し、「よくある質問」からも募集要項に戻れる導線を追加。結果、求人詳細への遷移率が約1.4倍に伸びました。ポイントは「迷いのワンクリック」をどれだけ潰せるかです。

原稿ディレクションで変わった「この一文」のBefore/After

UI/UXディレクションでは、レイアウトだけでなくコピーの粒度にも踏み込みます。ある製造業の採用サイトでは、トップの一文が「私たちはモノづくりで社会に貢献します」でした。しかしペルソナは「現場で何をするか」「自分の成長軸」を知りたい20代。
そこで、「入社3年で、1ミリ以下の誤差にこだわるプロになる。」と具体的な成長イメージが湧くコピーに変更。さらに「社会貢献」は下層のストーリー記事で補完しました。この一文の変更だけで、直帰率が大きく改善。抽象度の高いメッセージは、候補者の“次の一歩”を促すコピーに分解するのがコツです。

スマホのファーストビューを変えたら離脱が減った話

スマホアクセスが8割を超える案件では、PC前提の“横長ヒーロー”は危険です。ある採用サイトでは、キービジュアルに社員集合写真+長いメッセージを重ねており、肝心の「募集職種」が1スクロールしないと見えませんでした。
そこで、スマホではヒーロー画像をトリミングし、「キャッチコピー+職種導線+エントリーボタン」を1画面で完結する構成に変更。さらに、よくある質問の一部をファーストビュー下に抜粋して「応募前のモヤモヤ」に即答する形に。結果、スマホの1ページ目離脱が目に見えて減り、スクロール率も改善しました。

UIデザインで意識する「安心感」と「スキャンしやすさ」のバランス

採用サイトのUIは、尖ったビジュアルより「安心して読み進められるか」が最優先です。ジェイ・ラインでは、まず情報の優先順位を3段階に分け、文字サイズ・余白・色数をその優先度に合わせて設計します。
例えば、「募集要項」はテキスト量が多くなりがちですが、
・アイコン+小見出しでブロック化
・最初に「3行要約」を置く
・応募ボタンを上下2カ所に配置
といったルールを徹底することで、読み飛ばされにくくなります。装飾を足す前に、「候補者が3秒で“自分ごと”を見つけられるか」をチェックするのが基本です。

「ビジュアル担当」から「採用課題を解くパートナー」へ

採用サイトのUI/UXディレクションは、デザインスキルに加えて、人事や経営の視点を学べる領域です。ジェイ・ラインでは、求人メディア運用や人材育成支援、外国人人財紹介など、採用全体の文脈の中でサイト制作に関わります。
例えば、「応募数は足りているが早期離職が多い」ケースでは、あえて応募ハードルを上げる情報設計をすることもあります。こうした“採用の質”まで踏み込むディレクション経験は、UI/UXデザイナーのキャリアを大きく広げてくれます。ビジュアルの先にある「採用の成果」までを、自分の仕事の範囲だと捉え直してみてください。