Diffly : refonte du site d'une plateforme de win-loss analysis

Branding

Le brief était clair : conserver le nom Diffly, garder une place au bleu sans en être prisonnier, sortir des dégradés qui dataient l'identité, et rendre visible l'humain au cœur du produit. Plutôt que de refaire le logo, Gemeos a concentré le travail de branding sur le système visuel qui l’entoure, pour conserver la reconnaissance de la marque tout en renouvelant son expression.

Le résultat est une marque plus chaude et plus lisible, qui garde son ancrage tech mais ne ressemble plus à un SaaS interchangeable.

Direction Artistique

Le brief tenait en une phrase : « pas trop froid, pas trop data, mais rigoureux et premium ». La direction artistique devait conserver le bleu sans se limiter aux dégradés habituels des SaaS, et surtout incarner ce qui distingue Diffly : des échanges réels avec des acheteurs, à l'origine des enseignements de la plateforme. Les références citées (Batch, Gong, Mercateam) allaient toutes dans le même sens, une identité bold, une palette riche, de la chaleur.

Trois pistes, trois lectures du même produit

Plutôt qu'une seule proposition, Gemeos a construit trois territoires visuels complets, chacun avec sa palette, sa typographie et une homepage maquettée de bout en bout.

La direction retenue

Diffly a choisi la piste Le signal comme socle, enrichie des gestes les plus forts des deux autres : le surlignage des mots-clés dans les titres, les annotations manuscrites qui ponctuent les sections, les photographies humaines rehaussées de motifs géométriques. Le résultat : un bleu nuit structurant, un jaune signal qui attire l'œil sur ce qui compte, des photos de vraies personnes au travail, et une typographie lisible qui laisse la place au message.

UX / UI Design

L'audit du site existant a fait ressortir trois problèmes. La proposition de valeur était trop abstraite : on parlait de win-loss analysis avant d'avoir posé le problème. Le produit n'était pas compris assez vite : SaaS, service d'interviews, cabinet d'étude ? En réalité les trois, mais rien ne le disait. Et la navigation était principalement organisée par fonctionnalité, alors que Diffly répond d’abord à des problèmes de performance commerciale. Le web design devait faire apparaître ces enjeux avant les écrans du logiciel.

Une architecture orientée problème

Gemeos a reconstruit l'arborescence avec les équipes Diffly, en partant du hook plutôt que des fonctionnalités : « 90 % des raisons de perte dans votre CRM sont inexactes ». Le site s'organise ensuite par produit, par cas d'usage et par persona, avec des pages dédiées pour chaque combinaison.

UI kit et design des pages

Un UI kit complet a été conçu avant les pages : couleurs, typographies, composants (cartes, tabs, tableaux de pricing, témoignages, FAQ, bandeaux CTA), états et déclinaisons responsive. L'ensemble des templates a ensuite été designé en desktop et mobile dans Figma, en version anglaise (langue par défaut du site) puis déclinée en français. Chaque section clé embarque un visuel produit pour ne jamais laisser le visiteur sur une promesse abstraite.

Product Design

Diffly ne disposait d'aucun design system produit ni de visuels exploitables sur le web. Or le brief insistait sur un point : faire comprendre en un coup d'œil que Diffly est une source unique de vérité multi-sources, et que son IA permet de poser n'importe quelle question sur ses deals. Gemeos a donc conçu, dans le cadre du product design, une bibliothèque de visuels pour le site à partir des écrans réels et des fonctionnalités prioritaires fournies par Diffly.

Chaque visuel a été redessiné dans le style du site (cartes, ombres, palette, typographie) plutôt que capturé tel quel, pour que le produit paraisse aussi soigné que le discours. Les visuels existent en anglais et en français, et plusieurs ont été déclinés en versions animées pour les sections hero.

Intégration Webflow

Un site bilingue, une architecture à trois niveaux (produit, use case, persona), un hub de ressources et un blog à migrer : le développement Webflow de Diffly représentait un projet dense, mené en parallèle de la finalisation du design pour tenir la mise en ligne début juillet.

Une QA à quatre mains

Diffly a challengé l'intégration de près : plus de 140 commentaires remontés avant mise en ligne, traités un par un. Cette exigence a payé : le site est parti en production avec un contenu validé mot par mot dans les deux langues, et les équipes Diffly gèrent aujourd'hui seules pages, ressources, cas clients et traductions.

SEO technique

La refonte changeait tout : domaine conservé mais URLs, arborescence et langue par défaut repensées. La stratégie SEO répondait à deux priorités : préserver les acquis lors du changement d’arborescence et mieux couvrir les requêtes métier (win-loss analysis, voice of customer, churn analysis, buyer feedback) en français comme en anglais.

Pensé pour les moteurs et pour les LLM

Les pages consacrées aux solutions et aux profils utilisateurs ont été structurées autour de définitions courtes, de questions concrètes et de cas d'usage. Cette organisation aide les visiteurs à comprendre l'offre et facilite l'exploration des contenus par les moteurs de recherche et les assistants IA. L'objectif est de rendre l'expertise de Diffly plus facile à identifier sur le win-loss analysis, le buyer feedback et la rétention client.