Refacto livrée en preprod · Manag-in

De 14 étapes plates
à 6 étapes intelligentes.

Audit complet du funnel d’inscription manager actuel, puis refonte UX livrée en preprod : compression du parcours, scan LinkedIn intégré, micro-UX premium et persistance. Stack Manag-in conservée, intégrée nativement.

Comparaison

Le parcours, étape par étape

Aujourd’hui · 14 étapes

app.manag-in.com/fr/manager

  1. 1
    Intro
    écran vide d’intro
  2. 2
    Profil mission
    4 sous-questions empilées
  3. 3
    Email + social
    compte demandé en milieu de parcours
  4. 4
    Identité + adresse
    5 champs + carte mobilité
  5. 5
    Bienvenue
    écran transition décoratif
  6. 6
    Détail expérience
    7 sous-sections sur une seule page
  7. 7
    3 postes ordonnés
    drag & drop sans instruction
  8. 8
    Transition
    page totalement vide à 45% de progression
  9. 9
    Soft skills
    24 chips sans priorité
  10. 10
    Langues
    CECRL en sidebar
  11. 11
    Formation
    upload diplôme + sous-formes
  12. 12
    KYC + DDN + tél
    pièce d’identité demandée en milieu
  13. 13
    Activité pro
    select natif + KBIS
  14. 14
    Remerciement
    flat, sans suite claire
Refacto v2 · 6 étapes

app.managin.preprod.cysc.fr

  1. 1
    Mission idéale
    Poste, TJM (avec contexte marché), rythme hebdo, types — sur un seul écran cohérent.
  2. 2
    Où & jusqu’où
    Adresse Google Places + zone de mobilité en 4 cartes visuelles.
  3. 3
    Vous
    Prénom, nom, email, téléphone (formaté automatiquement par pays).
  4. 4
    Expérience
    Années (slider avec bulle) + secteur principal. Le reste sur le dashboard.
  5. 5
    Statut pro
    Indépendant / Portage / Plus tard, en 3 cartes. SIRENE auto si indé.
  6. 6
    Compte
    Mot de passe avec validation live (4 critères) + CGV. 30 secondes max.
Et après le compte ? Scan LinkedIn auto pour importer les expériences. Les détails (compétences, langues, formation, KYC) basculent vers le dashboard, dans un parcours « Complétez votre profil » gamifié.
Audit

19 pain points identifiés

Parcours complet capturé (14 captures écran), classés par impact sur la conversion. Chacun corrigé ou réorganisé dans la v2.

Bloquant conversion · 6
  • 14 étapes, sans indication du nombre total
  • Email contenant « + » rejeté (RFC valide pourtant)
  • Compte créé au milieu du funnel, avant engagement
  • Page 7 totalement vide (45% de progression, zéro contenu)
  • Validation HTML5 en anglais sur un site français
  • Pas de sauvegarde locale, perte des données si abandon
UX dégradée · 9
  • Hiérarchie visuelle plate, l’œil ne sait pas où se poser
  • Pages surchargées (4 puis 7 sous-questions hétérogènes)
  • Aucune transition entre pages — full reload à chaque fois
  • Barre de progression sans repères ni étape nommée
  • CTA principal en vert, marque en violet — incohérence
  • Drag & drop sans instruction ni feedback visuel
  • 10 checkboxes verticales pour les types de mission
  • Slider rythme sans contexte (5 = full-time ? part-time ?)
  • Aucun feedback positif quand un champ est valide
Polish · 4
  • Logo et tagline dupliqués en haut-gauche partout
  • Lien « Retour » presque invisible (gris très clair)
  • Cartes mobilité en gris terne, sans hover
  • Pages 7 et 14 sans progress bar (incohérence)
Principes appliqués

Les 8 leviers UX activés

Chaque levier est concret, vérifiable en direct sur la preprod, et mesurable côté analytics.

Réduction d’étapes

Tout ce qui n’est pas indispensable au matching prioritaire est reporté en post-inscription (compétences détaillées, langues, formation, KYC). 14 étapes deviennent 6.

Hiérarchie visuelle nette

Un seul focus par étape. Titre + sous-titre + champ principal. Le secondaire en chip ou en sidebar contextuelle. L’œil sait toujours où se poser.

Micro-UX premium

Validation live (icône verte au focus out), bubble sur le slider, transitions slide entre étapes, animations courtes (180ms), micro-feedback sur chaque interaction.

Persistance localStorage

Sauvegarde automatique à chaque champ rempli. Si le manager ferme l’onglet et revient, il reprend exactement où il s’était arrêté. Le stepper devient cliquable sur les étapes déjà visitées.

Micro-copy qui guide

« — vos prochaines missions », « — hors taxe, en euros ». Chaque label porte un sous-texte qui répond à la question implicite. Plus de placeholder muet.

Indicateurs intelligents

TJM avec hint marché en temps réel. Slider années avec bulle de valeur. Stepper avec étapes nommées (« Mission », « Géo », « Vous »…). « 3 minutes restantes » pour réduire l’angoisse temporelle.

Gamification subtile

Tous les champs valides → tick vert immédiat. Mot de passe → 4 critères qui passent au vert un par un, jauge de force gradient rouge→vert. Confetti au passage de l’écran final.

Perf & poids

SPA Vue 3 montée sur la stack existante (Symfony + Webpack Encore). Plus de full reload entre étapes. Bundle minimal : 1 entry, 700 lignes de SCSS, 9 composants Vue.

Au-delà du funnel

Scan LinkedIn intégré

Après la création du compte, on enchaîne directement sur un scan automatique LinkedIn pour retrouver le profil du manager et importer ses expériences.

  • Scan auto déclenché immédiatement après création de compte
  • Affichage 1 à 3 profils LinkedIn matchés, le manager choisit le bon
  • Fallback URL manuelle si on n’a pas trouvé
  • Lien discret « Passer cette étape » sans pression
  • Import des expériences en arrière-plan, redirection auto vers la page de vérification
  • Récupération + sauvegarde de la photo LinkedIn (option payante prise)
Bienvenue Adam

On a trouvé ces profils

Sélectionnez le bon pour importer automatiquement vos expériences.

AR
Adam Rotard
Directeur de projet chez ManagIn
Paris, France · 6 expériences détectées
AR
Adam Rotard
Senior Directeur de projet
Lyon, France · 4 expériences détectées
Importer mes expériences
Ce n’est pas moi → saisir manuellement mon URL LinkedIn
Passer cette étape
Bugs critiques corrigés

Les défauts qu’on a fait disparaître

Bug email « + » rejeté

Validation RFC 5322 standard côté front et back. La règle business « pas de + » n’avait aucun intérêt produit.

Page 7 vide supprimée

Le funnel ne porte plus que des étapes avec valeur ajoutée. Zéro page décorative.

Anglais HTML5 → français

Validation custom en français cohérente avec la marque.

CTA vert → violet brand

Gradient violet → violet bright pour tous les CTA primaires. Cohérence visuelle stricte.

Prochaine étape

La preprod est en ligne.
Vous pouvez la tester maintenant.

Sur votre poste, sur mobile, depuis n’importe où. La v2 tourne sur la stack que vous connaissez, avec la palette violet Manag-in conservée. Aucune donnée de la v1 n’est touchée.

https://app.managin.preprod.cysc.fr/fr/manager/inscription