Pourquoi déployer plusieurs directions plutôt que présenter une maquette
Faire choisir un design à un client va plus vite avec 3 ou 4 variantes déployées en ligne, sur de vraies routes, qu’avec une maquette statique. Le client scrolle, teste sur son téléphone, ressent les animations et la vitesse. Il choisit une expérience, pas une image. Les textes restent identiques d’une variante à l’autre pour isoler la seule variable de design.
Une maquette figée déclenche presque toujours la même conversation : la taille du logo, la nuance du bleu, le libellé d’un bouton. Ce sont des détails réels, mais ils arrivent trop tôt. Brad Frost le formule bien dans Atomic Design : présenter des mises en page complètes trop vite pousse les parties prenantes à réagir à « une jolie image » au lieu de discuter de la direction générale et de son lien avec les objectifs (Atomic Design, chapitre 1).
Le site en ligne inverse le rapport. On ne demande plus « est-ce que ça te plaît ? », on demande « est-ce que tu te sens bien dedans en 30 secondes ? ».
Ce qu’on a fait sur une refonte SaaS immobilier
En juillet 2026, chez Peechy, on a refondu le design d’un SaaS immobilier. Plutôt qu’un aller-retour de maquettes, on a déployé quatre variantes de page d’accueil sur des routes dédiées, /v1 à /v4 :
| Route | Direction | Ce qu’elle testait |
|---|---|---|
| /v1 | Sombre, type Linear | Densité, contraste fort, effet produit tech |
| /v2 | Éditoriale claire | Lisibilité, respiration, ton institutionnel |
| /v3 | Immersive avec vidéo | Impact émotionnel, poids ressenti au chargement |
| /v4 | Calquée sur une référence validée par le client | Vérifier si la référence citée tenait vraiment |
Les textes et le blog étaient conservés à l’identique sur les quatre. La variante 4 mérite un mot : un client cite souvent un site qu’il admire. Le construire réellement, avec son contenu à lui, est le seul moyen de savoir si l’admiration survit à la transposition. Parfois oui, parfois non, et c’est une information précieuse.
Les règles de cadrage qui rendent l’exercice rentable
Sans cadre, quatre variantes coûtent quatre sites. Trois règles suffisent à contenir ça.
- Page d’accueil seulement. C’est la page qui porte la direction. Les pages intérieures se déduisent ensuite du système retenu.
- Textes strictement identiques. Changer le copy en même temps que le design rend le choix ininterprétable. La recherche UX de NN/g insiste sur la fidélité du contenu dans les prototypes, y compris via des contenus générés par IA pour éviter le lorem ipsum (NN/g, prototyping).
- Trois à quatre variantes, pas plus. Au-delà, le client ne compare plus, il subit.
Ajoute une règle de politesse technique : noindex sur les routes de test, pour ne pas semer du contenu dupliqué dans Google.
Ce qu’une maquette ne peut structurellement pas montrer
Deux choses n’existent pas dans un fichier de design.
La première est la performance réelle. Le RUM (Real User Monitoring) désigne la mesure de la performance vécue par de vrais visiteurs, par opposition aux tests synthétiques en laboratoire. C’est cette donnée de terrain que Google utilise pour juger les Core Web Vitals, et le seuil est explicite : 75 % des visites de page doivent atteindre le niveau « bon » pour chaque métrique (web.dev, 2025). Une hero avec vidéo plein écran peut être magnifique en image et coûteuse en LCP. Déployée, elle se mesure. Le sujet est développé dans notre guide sur les Core Web Vitals en 2026.
La seconde est le mobile réel : le pouce, le scroll qui accroche, un menu qui recouvre la page. Aucun mode « responsive » d’un outil de design ne reproduit ça honnêtement.
Si vous voulez mesurer objectivement les variantes, cadrez la mesure d’audience. La CNIL autorise l’exemption de consentement pour des traceurs limités à la seule mesure d’audience, pour le compte exclusif de l’éditeur, produisant des statistiques anonymes, sans recoupement ni suivi entre sites (CNIL, mesure d’audience). Hors de ce périmètre, bandeau obligatoire.
L’objection : « quatre fois le travail, donc quatre fois le budget »
C’est l’objection la plus fréquente, et elle est fausse dès qu’on travaille en composants. L’Atomic Design est une méthode qui construit une interface en partant des plus petits éléments (boutons, champs) vers des molécules, des organismes puis des pages, pour obtenir des interfaces cohérentes à coût réduit (Dn’D, 2024).
Concrètement, les quatre variantes partagent la structure, les données, les composants de base. Ce qui change, ce sont les tokens de style, la composition de la hero et le rythme des sections. Et surtout : le vrai coût d’un projet de refonte n’est pas la production, ce sont les allers-retours de validation. Trois cycles de maquette annulés par un « finalement je ne le sens pas » pèsent plus lourd qu’une variante supplémentaire construite en réutilisant l’existant.
Ce qu’on fait après le choix
Une fois la direction retenue, on ne duplique pas la page gagnante. On extrait ses composants dans le système, on supprime les routes de test, on redirige, puis on applique la direction aux gabarits (pages intérieures, blog, formulaires). Les trois variantes perdantes ne sont pas jetées : elles servent d’arbitrage documenté quand, six mois plus tard, quelqu’un demande pourquoi le fond est sombre.
Si vous préparez une refonte, arrêtez de demander à votre prestataire « une maquette de la home ». Demandez trois liens. Et regardez-les sur votre téléphone, dans le train, avec votre vrai contenu, comme le fera votre client. Notre checklist de brief avant de consulter une agence vous aidera à formuler la demande.
Ce problème, Peechy s'en occupe
Plutôt que de tout gérer seul, confiez votre site à une agence qui s'occupe de tout, hébergement, sécurité, maintenance et corrections. Encore plus simple en abonnement : on règle les soucis avant même que vous les remarquiez.
Confier mon site à Peechy