（株）Atip 様 フミダスWebサイト制作

ZohoCRMとのAPI連携が必須要件でした。新規サイト立ち上げの目的は認知度向上と反響数・売上の増加。第二新卒の方や未経験業界への異業種転職を希望する方、フリーター・高卒・短期離職などバックグラウンドに不安を感じやすい20代前半を中心としたユーザーに向けて、「『踏み出す』きっかけになる」というコンセプトのもと、親しみやすさ・敷居の低い雰囲気のデザインと、直感的に探しやすいUIをご希望いただきました。スマートフォン中心の閲覧でアテンションスパンが短いユーザー層のため、情報量よりも「わかりやすさ」「安心感」を重視したいというご要望もいただきました。

求人検索・詳細・応募機能までを含むシステム構築案件でしたが、通常より短い期間で公開することができました。ターゲットユーザー像が明確だったため、スマートフォン閲覧を前提に情報量を絞り込んだ、見やすく使いやすいサイト設計を心がけました。一覧ページではアイコンで情報を省スペースに表示するなど、直感的な操作を促す工夫をしています。

ブランディング面では、ロゴのカンガルー（一歩踏み出す・親子で寄り添うイメージ）を活かし、くすみブルーの色相を保ちながら彩度を上げたウルトラマリンブルーをメインカラーに設定。フレッシュで信頼感のある印象を演出しつつ、補色の黄色をサブカラーに使いメリハリのある配色にしました。メインビジュアルには俳優のウエンツ瑛士さんを起用し、「この人が顔になっているなら安心」という直感的な安心感を第一印象から伝えられるよう設計。押せる要素はすべてボタン化し、視線がちらつかない整理されたレイアウトとすることで、直感的な操作を促しています。

Zoho CRMで管理する求人情報をWebサイトで活用できるよう、Laravelで求人検索・詳細表示・応募導線を構築しました。APIから取得した情報をWeb表示向けに変換し、検索の使いやすさと運用のしやすさ、表示速度のバランスを図っています。

求人一覧・求人詳細、条件検索、フリーワード検索、新着求人、関連求人の表示、応募・相談フォームを実装しました。管理画面では、Zoho CRMから取得する項目や検索対象項目を設定でき、求人情報の構成変更にも対応しやすくしています。

Zoho CRM APIと連携し、CRM上で管理している求人情報をWebサイトへ取り込む仕組みを構築しました。認証情報やトークンを使って安全に接続し、取得した求人データを検索・表示に適した形式へ変換しています。また、管理画面から連携項目や検索設定を調整できるようにしました。

APIから取得したデータや検索設定の一部をJSON形式で生成し、画面表示時のAPIアクセスや処理回数を抑えています。求人一覧や検索結果を素早く表示できるようにするとともに、応募時のメール送信をキュー処理に分離し、受付完了画面へ早く遷移できるようにしました。

求人企業様の掲載写真を活かせるよう、サイト全体のカラーリングを絞って設計しました。メインカラーにはロゴのくすみブルーの色相を活かしたウルトラマリンブルーを採用し、フレッシュさと信頼感を両立。ターゲットである20代前半の求職者が「自分でもできそう」と感じられるよう、堅すぎず親しみやすいトーンを意識しています。

システム構築では表示スピードを上げるために、事前にjson化し、クエリーを回す回数を減らしています。
また、API連携によりZoho CRMから情報を取得しております。