↓ Le Design Ops des équipes qui façonnent le digital.

Bter - logo

Edition #27-2024

Pourquoi les refontes web ne sont pas toujours aussi simples : le cas d’un site à plusieurs millions de visites mensuelles.

Bonjour à toutes et à tous,

Aujourd'hui, encore un format mono-sujet : j'ai préféré vous livrer un concentré de retour d'expérience sur un sujet majeur, plutôt qu'une multitude de petits sujets. Mais n'ayez pas peur, les formats de newsletter plus classiques reviendront, notamment avec le replay de ma conférence IxDA à Lausanne, sur le thème de la pratique du Design Ops en Agences web et en SAAS.

J'en profite pour saluer les nouvelles et nouveaux abonné•es de cette newsletter. Vous êtes désormais plus de 2300 abonné•es !

Bonne lecture à toutes/tous,
et bonne semaine !

Le bootcamp "Concevoir et Designer avec Gutenberg" est relancé !

L'objectif : apprendre à concevoir et à Designer des projets WordPress propulsés par Gutenberg et le Full Site Editing.

8 semaines, 8 matinées, 8 participant•es.
Programme et pré-inscriptions réservées aux abonné•es !

Je suis intéressé•e !

Rattrapage : ça se passait sur LinkedIn dernièrement

Place à l'article :
Pourquoi les refontes web ne sont pas toujours aussi simples : le cas d’un site à plusieurs millions de visites mensuelles.

REX refonte site à fort traffic

Lorsqu’on échange sur le futur d’un SAAS ou d’un site web, le sujet de sa refonte arrive relativement facilement sur la table. C’est un peu l’option facile de temps à autres, tant la gestion de la dette technique (la “legacy” pour les intimes) est un sujet critique. Et c’est vrai que parfois, on a plus intérêt à tout refaire qu’à continuer à élever une tour de Pise.

La refonte, si elle est bien conduite, fonctionne pour la majorité des entreprises positionnées sur un secteur en particulier. Leur positionnement “limite” d’une certaine manière le traffic sur leur site.

Mais qu’en est-il de la refonte de projets grand publics, avec un nombre de vues qui se compte en millions tous les mois ?


C’est le cas d’une entreprise que j’accompagne maintenant depuis la fin 2021. Lyonnaise, référente dans le monde de la tech depuis plus de 15 ans, avec un ±10M de vue mensuelles en moyenne.

On imagine bien que ce chiffre impressionnant va de paire avec des contraintes “hors design” dont il faut tenir compte. Dans le cas de mon client :

  • le modèle business repose fortement sur la publicité, étant donné le traffic
  • mon client possède son équipe de salariés, ce qui signifie que le modèle business doit rester sain et sauf
  • le projet a des contraintes techniques fortes : entre le back-office, le front, la gestion de la régie publicitaire, etc.

Ah, ok. Là c’est une autre histoire.


On est pas dans un cas de refonte de site vitrine d’une PME ou d’un grand compte. Si la refonte affecte le modèle, les effets sont immédiats : sur le modèle et les gens ; ou sur le projet de refonte. Et lorsqu’il faut choisir entre les deux, le choix est généralement vite fait.

Voici le récit de la manière dont on a traité cette refonte, et le point où nous en sommes aujourd’hui. En espérant que ce récit soit instructif !

Étape 1 : le brief, le kiff, le go

Nous sommes fin 2021. Le projet de refonte est gagné et débute de manière classique, avec une série d’ateliers pour définir, prioriser, planifier, etc. Ce projet de refonte n’est d’ailleurs pas uniquement graphique : le back-office sur-mesure du site est en cours de refonte également, tout comme l’éditeur des contenus du site (oui, c’est un gros site de contenus).

On lance ensuite la phase de Design, qui commence avec la Direction Artistique. Classique, une fois validée on enchaîne et on commence à dérouler les écrans.

Après plusieurs mois, on arrive avec une version consolidée du nouveau Design, la base d’un guide de styles qui fonctionne, et un client content et qui a hâte de voir la suite.

Étape 2 : le recul, le plan

Bien sûr, durant la première phase de Design, la tech est mise à contribution. Le développement se fait in-house chez le client (front et back-office), avec plusieurs chantiers à gérer : les évolutions du site actuel, la gestion de la legacy et la maintenance.

Un chantier de refonte qui, mêlé aux autres, a parfois du mal à prendre sa place. Mais jusque là, c’est normal : lorsque le quotidien fait tourner la boutique, il a forcément une priorité haute.

Comme je l’expliquais plus haut, la refonte technique de ce site est sensible car elle touche au modèle de données, au back-office sur-mesure (et à l’éditeur de contenus), et à l’intégration front avec un changement de techno. Les enjeux sont également énormes sur le SEO. Des chantiers lourds pour un site avec plusieurs strates de complexité. Et on se rend compte que la nouvelle vision Design va prendre du temps à prendre vie. Beaucoup de temps. On a été un peu ambitieux, et si on ne veut pas que le poussin meure dans l’œuf, on doit penser à une solution.

Les nouveaux Design ayant emballé toute l’équipe client, on décide d’en faire la vision Design “à terme”. Le plan est donc de décomposer les chantiers qui nous ferons arriver, à terme, à cette vision.

Au final, c’est smart. Et c’est surtout très adapté aux contraintes techniques et business du site, ainsi qu’aux capacités de production de l’équipe technique.

Étape 3 : la v1 de la refonte

Nouveau plan, donc. On sait où on va en terme de vision Design, il ne reste qu’à débuter le voyage.

Dans l’ordre, la stratégie choisie est la suivante

  1. Développer les nouvelle pages clés avec le nouveau guide de style du site, sur les nouveaux Designs.
  2. Intégrer le nouveau guide de styles aux templates existants du site, sans en changer leur structure : on met à jour les boutons, le traitement typographique, les couleurs, les espacements, et d’autres petits éléments.
  3. Ensuite, template après template, on intègre les nouvelles versions de composants et de modules (c’est l’amorce du passage aux nouveaux layouts).
  4. Enfin, on vérifie le rendu de tous les templates, on ajuste au cas par cas, et on aura une refonte progressive mais effective.

Bref, on y va petit à petit, méthodiquement.

Et ça marche bien mieux : les premières pages stratégiques prennent vie assez rapidement avec la nouvelle vision Design, tandis que le nouveau guide de styles s’affine et se confronte aux layouts actuels ainsi qu’à la stack technique. La transition vers la nouvelle version du site est plus lente, mais elle est plus solide et réfléchie.

Étape 4 : demain, la v2

Aujourd’hui, nous sommes entre l’étape 2 et l’étape 3 (décrites ci-dessus). Et on peut déjà dresser un bilan du chemin parcouru, et des apprentissages liés.

Par exemple :

  • La transition s’opère sans que le modèle économique ne soit perturbé : le client peut donc continuer à développer son activité et ses projets sans être dépendant d’un projet de refonte. Et la “refonte en transition” permet de soutenir un modèle économique qui s’affine et s’adapte à son temps.
  • L’acculturation des équipes tech à la vision Design se fait sur le moyen/long terme. Ça prend du temps, oui, mais l’assimilation est plus durable puisque les principes Design trouvent une traduction technique plus juste.
  • Le temps de refonte long permet de revoir des décisions Design prises au début du projet. On a la chance de pouvoir repenser les choses avec du recul, rationaliser, simplifier, et aller à l’essentiel. Et au final, c’est tout ce qu’on veut.

En gros, on compense une vélocité de refonte moindre par une intégration bien plus solide des grands principes de la refonte.

Et c’est sans doute la chose principale à retenir : lorsqu’on attaque la refonte d’un produit/service ou d’un site avec des enjeux élevés (traffic, modèle économique, quantité d’utilisateurs, stack technique…), le temps long est nécessaire. Parce que chaque décision doit être considérée dans le spectre de tous les métiers qu’elle affecte, et des contraintes propres à chaque métier. Sinon, c’est trop facile. Sinon, c’est trop naïf. Sinon, c’est simplement un délire de nouveaux pixels à coller sur une vitrine.

On a aussi besoin de développer la collaboration et la confiance, sur le long terme. Pour montrer à nos clients que même en étant externe, on peut être pleinement impliqués dans leurs projets (j’en profite d’ailleurs pour remercier Philippe pour sa confiance depuis tout ce temps).



En espérant que le récit de ce projet (toujours en cours) vous aidera !

Bonne semaine,
Joffrey

Ce type de contenu vous plait ? Ou pas ?
N'hésitez pas à me faire vos suggestions en réponse d'e-mail !

Équipes digitales
d'agences / scale-ups / grandes entreprises :
je travaille avec vos équipes à décupler l’impact
de la fonction Design pour vos projets.

→ Design Strategy avec les managers :
avant-ventes, acculturation, workshops, stratégie

→ Design Ops avec les équipes de production :
process et méthodes, collaboration design-tech, documentation et Design System, Design avec Gutenberg (WordPress)

→ Design Mentoring des individus :
feedback, roadmap d’évolution, hard & soft skills, posture

Vous êtes convaincu•e de la valeur stratégique du Design
dans votre organisation ?

Entamons la conversation !
Joffrey Jochum on LinkedIn

Merci de m'avoir lu !

Joffrey

La suite ? Rendez-vous sur LinkedIn !

Si vous ne souhaitez plus être contacté, vous pouvez vous désinscrire.