Diffly x Gemeos
Complete redesign of diffly.co by Gemeos, a web agency dedicated to B2B SaaS: art direction, UX/UI, product visuals, bilingual Webflow integration, and technical SEO. Diffly is the win-loss analysis and buyer feedback platform for B2B revenue teams.

Diffly, the truth behind buying decisions, finally visible
Diffly helps B2B companies understand why they win, lose, or churn: buyer interviews conducted by neutral experts, questionnaires, cross-referencing with CRM and call recordings, and AI analysis. A strong promise, an average 22% increase in win rate, supported by a site that no longer reflected it: monochrome, heavy on gradients, structured like a generic SaaS, and, above all, unable to convey what Diffly actually does in a few seconds.
Gemeos rebuilt the site from scratch: new architecture focused on problems rather than features, art direction developed through three concepts, a full UI kit and page designs, around twenty product visuals, Webflow integration in French and English, followed by technical SEO QA and team training. Twelve weeks from brief to launch.
- Industry
- Saas
- Services
- Branding
- Artistic Direction
- UX/UI Design
- Development
- Product Design
- SEO

Branding
The brief was clear: keep the name Diffly, retain a place for blue without being trapped by it, move away from the dated gradients, and make the human element at the heart of the product visible. Rather than a complete logo redesign, Gemeos evolved the identity through the surrounding system.
| Element | Evolution |
|---|---|
| Palette | A structuring midnight blue, an electric blue for action, a signal yellow to highlight what matters, warmed up by beiges and a burnt orange |
| Typographie | A legible, deliberately light sans serif for body and headings, paired with handwriting for annotations |
| Gestes graphiques | Keywords highlighted in headings, handwritten annotations punctuating sections, geometric patterns layered over photographs |
| Iconographie | Photographs of real people at work rather than abstract illustrations, to embody human interviews |
| Applications | System applied to the site, product visuals and resources (webinars, white papers), with a Figma UI kit as the single reference |
The result is a warmer, more readable brand that maintains its tech roots while no longer looking like an interchangeable SaaS.

Art Direction
The brief was summed up in one sentence: "not too cold, not too data-heavy, but rigorous and premium." The art direction had to deliver on it. Diffly wanted to keep the blue without being defined by it, move away from corporate gradients, and highlight what makes them different: humans talking to humans to uncover the truth. The cited references (Batch, Gong, Mercateam) all pointed in the same direction: a bold identity, a rich palette, and warmth.
Three concepts, three interpretations of the same product
Rather than a single proposal, Gemeos built three complete visual territories, each with its own palette, typography, and a fully mocked-up homepage.
The chosen direction
Diffly chose the Signal concept as its foundation, enhanced by the most impactful elements of the other two: highlighting keywords in headings, handwritten annotations punctuating sections, and human-focused photography accented with geometric patterns. The result: a structural midnight blue, a signal yellow that draws the eye to what matters, photos of real people at work, and a legible typeface that lets the message shine.
Signal
A tension between warm and cold: a palette rooted in human warmth, balanced by a primary blue that evokes technological rigor. Slightly pixelated line illustrations, neither purely organic nor digital, and a sophisticated, light sans-serif typeface for a premium feel tailored to the C-suite.
Between the lines
Seeing through the noise, reading between the lines, revealing what is blurred. Photographs layered with patterns that evoke the assembly of multiple sources, partial blurring for the "pre-Diffly" state, and handwritten words that recall the human experts behind the platform. A palette inspired by developer consoles: vibrant colors on a dark background.
Confrontation
The most emotionally assertive direction. Colors chosen far from typical AI tropes, with no corporate grays or gradients, hand-drawn icons, and keywords encapsulated in headings as if highlighted with a marker. Rounded shapes and airy compositions create a warm universe: humans speaking to humans to uncover the truth.


UX / UI Design
The audit of the existing site highlighted three main issues. The value proposition was too abstract: it focused on win-loss analysis before defining the problem. The product wasn't understood quickly enough: was it a SaaS, an interview service, or a research firm? It was actually all three, but nothing communicated that. Finally, the navigation was "feature-driven," modeled after a standard SaaS, even though Diffly sells a strategic shift for Revenue teams. The web design had to bring these business challenges to the forefront before showing the software screens.
A problem-oriented architecture
Gemeos rebuilt the site structure with the Diffly team, starting with the hook rather than the features: "90% of the reasons for loss in your CRM are inaccurate." The site is now organized by product, use case, and persona, with dedicated pages for every combination.
| Section | Pages | Objectif |
|---|---|---|
| Home | Homepage FR/EN | State the problem, show the product in action, prove it through customers |
| Produit | Platform, Live Interviews, AI Insights & Alerts, Integrations | Make it clear that Diffly = SaaS + service + AI |
| Solutions by use case | Win-loss analysis, Customer Experience, Retention, Customer Adoption, Competitive Intelligence, Product Research | Capture industry searches and speak to each challenge |
| Solutions by persona | Sales, Marketing, Product, Customer Success | Speak directly to decision-makers and users |
| Customers | Case studies with industry filters | Preuve sociale (Adobe, Workday, Didomi, Skillup…) |
| Resources | Blog, Toolbox (webinars, livres blancs), ROI Calculator, Diagnostic | Feed SEO and lead generation |
| Pricing / Demo | Separate pages | One clear path to compare, another to convert |
| About | About us, Careers, Partner Program | Put faces on the team and open the partner channel |
UI kit and page design
A complete UI kit was designed before the pages: colors, typography, components (cards, tabs, pricing tables, testimonials, FAQs, CTA banners), states, and responsive variations. All templates were then designed for desktop and mobile in Figma, first in English (the site's default language) and then adapted into French. Every key section includes a product visual to ensure visitors are never left with an abstract promise.

Product Design
Diffly had no product design system or web-ready visuals. However, the brief was clear: communicate at a glance that Diffly is a single source of truth for multiple data streams and that its AI can answer any question about your deals. Gemeos therefore created a library of product visuals for the site, based on actual platform screens and a list of features provided by Diffly.
| Famille | Visuels | What they show |
|---|---|---|
| Diffly AI | Search bar, “Ask Diffly AI” (question, question library, result), AI recommendation on an ongoing deal | Ask any question, get a sourced answer |
| Insights | Decision criteria dashboards (won, lost, satisfaction, churn), criteria on an interview, deal page / post-mortem | The depth of insights gathered from each interview |
| Organisation | AI Tag, global Tag page, tag categories | How Diffly structures and aggregates feedback |
| Campagnes | Format choice, sequence customization, trigger criteria | Launch feedback collection in a few clicks |
| Ecosystem | Multi-source (interviews, surveys, call recordings, CRM), AI-generated battle card, integrations | Diffly as the single source of truth |
Each visual was redesigned to match the site's style (cards, shadows, palette, typography) rather than simply captured as-is, ensuring the product looks as polished as the messaging. The visuals are available in both English and French, with several animated versions created for the hero sections.

Webflow integration
A bilingual site, a three-tier architecture (product, use case, persona), a resource hub, and a blog to migrate: Diffly’s Webflow integration was a complex project, carried out in parallel with the final design stages to meet the early July launch deadline.
| Livrable | Details |
|---|---|
| Page build | About thirty static and dynamic templates built pixel-perfect from Figma, desktop and mobile |
| Multilingue FR/EN | Webflow Localization across the whole site: static pages, CMS, translated title tags and meta descriptions, visuals managed per language |
| Architecture CMS | Collections for case studies (with industry categories), blog and authors, Toolbox resources (webinars, white papers), testimonials selectable page by page, client logos |
| Custom components | Tabbed sections, testimonial sliders, pricing tables, FAQ blocks, Toolbox hub |
| Animations | Micro-interactions and scroll transitions, animated product visuals in the heroes, optimized so loading doesn't suffer |
| Hub Toolbox & landing pages | Webinar and white paper landing pages migrated to a single template, reusable for email campaigns |
| Redirections & mise en ligne | 301 redirect plan from the old site, SEO acceptance testing, domain switch with no downtime |
| Formation | Video series: managing languages, tab sections, adding logos, editing the blog, replacing visuals and selecting reviews |
Collaborative QA
Diffly challenged the integration closely: over 140 pieces of feedback were submitted before launch, each addressed one by one. This high standard paid off: the site went live with content validated word-for-word in both languages, and the Diffly team is now fully autonomous in managing their pages, resources, case studies, and translations.

Technical SEO
The redesign changed everything: the domain was kept, but the URLs, site structure, and default language were completely rethought. The SEO challenge was twofold: to retain all existing search rankings while laying the groundwork to capture industry-specific queries (win-loss analysis, voice of customer, churn analysis, buyer feedback) in both French and English.
| Chantier | Details |
|---|---|
| Redirect plan | Old site → new site mapping, page-by-page 301 redirects, 404 checks after the switch |
| Semantic structure | One H1 per page, a heading hierarchy consistent with the use case / persona architecture, internal linking between solutions, product and case studies |
| Tags & metadata | Title tags and meta descriptions written and translated for every static page, FR/EN hreflang tags through Webflow Localization |
| Structured data | Organization schema on the site, Article and authors on the blog |
| Performance | Optimized images (WebP, lazy loading), lightweight animations, limited third-party scripts |
| Content strategy | Recommendations on article frequency, freshness of publication dates, author pages and the use of writing assistance tools |
Designed for search engines and LLMs
The solution and persona pages were written using clear, verbatim language, structured as Q&As and concise definitions, the exact format ChatGPT, Perplexity, and Google’s AI Overviews pull from when citing sources. Combined with structured data and a readable architecture, this approach positions Diffly to be cited as a reference for win-loss analysis in Europe, rather than just ranked.
Our latest projects
+250 companies
supported
Websites designed and developed with
You're going to working with us, guaranteed
Ready to launch
your business?
Let’s f*****G GO !!
























