Contexte
Renforcer la marque employeur directement depuis le site client
Les clients RH d'Altays gèrent leurs recrutements via l'ATS Altays. Le besoin identifié : leur offrir un site carrière clé-en-main, autonome et brandé à leurs couleurs, sans développement sur mesure, sans dépendance à leur DSI.
La réponse produit : un site carrière mobile first complet, alimenté par un mini CMS back-office que les équipes RH pilotent en autonomie. Côté candidat, un vrai site dédié pas un widget, pas une iframe, avec une page d'accueil marque employeur, une liste d'offres filtrables et un parcours de candidature optimisé mobile.
Phase 1 — Cadrage & Recherche
Un produit, pour deux publics distincts
Ce projet avait la particularité d'avoir deux publics à satisfaire simultanément : les équipes RH clients (qui configurent et administrent), les candidats (qui postulent depuis mobile).
Ateliers
Recueil du besoin
- Workshop avec les PO et responsables produit Altays pour définir le périmètre du MVP
- Entretiens avec 4 clients RH pilotes. Quels contenus valoriser ? quelles offres mettre en avant ?
- Identification des contraintes actuel iframe : responsive, CSS isolé, pas de cookies tiers sans consentement
- Benchmark : Welcome to the Jungle, Teamtailor, Flatchr, Workable Career Pages
Personas
3 profils utilisateurs
- L'administrateur RH : configure le CMS, gère les offres, veut de l'autonomie sans dépendre de l'IT
- Le candidat mobile : découvre l'entreprise via son téléphone, souvent entre deux transports, veut postuler en 3 min
- Le candidat desktop : lit attentivement, compare, veut des infos sur la culture et les avantages
- Priorisation : l'expérience mobile candidat est le parcours n°1. 73% des consultations d'offres se font sur mobile
Contraintes
Techniques & UX
- Personnalisation couleurs et logo sans recompilation, variables CSS injectées
- Mobile first absolu : conçu d'abord pour 375px, adapté ensuite pour desktop
- Performance : chargement <2s même sur 3G. Contrainte explicite des clients
- Accessibilité RGAA obligatoire (clients secteur public)
Phase 2 — Parcours candidat
Concevoir le parcours candidat de A à Z
Avant le moindre wireframe, j'ai cartographié l'intégralité du parcours candidat : De la découverte de l'offre jusqu'à la confirmation de candidature, en identifiant tous les points de contact, les décisions, et les moments à risque d'abandon.
Parcours candidat
Flowchart page d'accueil
Flowchart fiche offre d'emploi
Flowchart Postulation
Points de risque d'abandon identifiés
Formulaire trop long
Décision : champs réduits au strict minimum — CV + email + téléphone. Lettre de motivation optionnelle.
Upload CV sur mobile
Solution : import depuis Google Drive, Dropbox ou LinkedIn en plus de l'upload classique.
Pas de retour immédiat
Confirmation visuelle forte + email automatique dans la seconde — indispensable sur mobile.
Phase 3 — Wireframes & Prototype
Mobile first, du pixel au prototype
Wireframe 3 pages principales
Maquette finale 3 pages
Phase 4 — Spécifications & Handoff
Documenter pour deux équipes : front et back
Front candidat
Spécifications mobiles
- Spécifications détaillées pour chaque écran mobile (375px base)
- Règles d'adaptation desktop : breakpoints 768px et 1200px
- Comportements de scroll, sticky header, lazy loading des offres
- Gestion des états : 0 offre, chargement, erreur réseau
- Contraintes iframe : hauteur dynamique via postMessage, CSS scopé avec préfixe
- Annotations Figma pour l'équipe front — composants Vuetify correspondants
Back-office CMS
Spécifications admin
- Maquettes du back-office : gestion des offres, éditeur de contenu marque employeur
- Configurateur de personnalisation : couleurs primaires, logo, typographie
- Flux de publication : brouillon → révision → publié → archivé
- Dashboard statistiques : vues, candidatures, taux de conversion par offre
- Rédaction des spécifications dans Jira avec critères d'acceptation
Résultats
73%
des consultations d'offres sur mobile — confortant l'approche mobile first
2
produits livrés : front candidat iframe + back-office CMS
AA
accessibilité WCAG 2.1 — obligatoire pour les clients secteur public
Livrables