CONNECTED
Une maquette jouable de mise en relation étudiants et recruteurs, construite pour être présentée en direct
Le contexte
Un porteur de projet devait présenter son application de mise en relation entre étudiants et recruteurs devant un jury et des interlocuteurs qui, eux, font ce métier. Il avait un cahier des charges et une date. Ce qui lui manquait, c'était quelque chose à montrer, et surtout quelque chose qui ne s'effondre pas à la première question du type est-ce que ça marche vraiment.
Mon approche
J'ai construit une maquette jouable plutôt qu'une série d'écrans : Next.js devant, Supabase derrière, avec de vrais comptes et de vraies données. Le cœur du travail a porté sur un seul moment, celui du match, parce que c'est là que le produit se comprend ou ne se comprend pas. Les deux profils de personnalité se superposent, la zone commune s'allume, et la mise en relation cesse d'être une promesse pour devenir une image.
Ce que j'en retire
La maquette a été livrée avec un document de dix chapitres qui reprend chaque écran, la règle du match et le chemin de présentation à suivre. Elle reste privée, donc il n'y a pas de lien à ouvrir ici. Ce projet m'a appris à faire un choix que je trouve juste : passer la moitié du temps sur cinq secondes d'interface, parce que ce sont les cinq secondes qui décident.
Les écrans
À quoi ça ressemble
Le test : cinq dimensions, en français courant
Le match : les deux profils se superposent
Une offre, lue avec son propre profil
La conversation qui s'ouvre après le match
Sous le capot
Comment c'est construit
Une maquette qui fonctionne vraiment
Pas un enchaînement d'images : une application avec sa base de données. Un compte créé pendant la présentation existe encore le lendemain. C'est ce qui fait la différence devant un jury qui a vu passer beaucoup de diaporamas.
Montrer le match au lieu de le raconter
Le produit met en relation sur la personnalité autant que sur les compétences. Plutôt qu'une célébration générique, les deux profils de personnalité se superposent à l'écran et la zone commune s'illumine. On voit pourquoi les deux vont ensemble.
Une couleur par rôle, tenue partout
Le vert est l'étudiant, le violet le recruteur. La règle se pose dès l'écran d'accueil et ne bouge plus. Quand les deux couleurs se rencontrent à l'écran, personne n'a besoin qu'on lui explique ce qui se passe.
Un jeu de données de démonstration complet
Deux comptes prêts, profils remplis, tests passés, candidatures en cours, conversations ouvertes. Une démonstration ne doit pas commencer par remplir un formulaire : on entre directement dans le vif du sujet.
Application
Données
Animation