Synapse : refonte du site d'un SaaS IA pour l'industrie
Synapse développe un copilote IA qui aide les PME industrielles à exploiter leurs données, notamment dans la métallurgie. Le site devait expliquer un produit technique sans perdre les décideurs métier.
Gemeos a mobilisé son expérience d'agence web pour l'industrie pour concevoir la direction artistique, les parcours UX/UI et l'intégration Webflow du projet.

Faire comprendre un copilote IA aux directions industrielles
Synapse développe une solution SaaS destinée aux PME industrielles, notamment dans la métallurgie, pour mieux exploiter leurs données opérationnelles. Son positionnement se situe entre les outils de pilotage métier et l'intelligence artificielle : un sujet qui peut sembler abstrait à des dirigeants concentrés sur la production. Le site devait expliquer la valeur d'un copilote IA avec un vocabulaire concret, centré sur les difficultés rencontrées dans les ateliers.
Gemeos a travaillé la direction artistique en conciliant les codes de l'industrie et ceux d'un logiciel innovant. Les maquettes UX/UI présentent les problèmes métier, le fonctionnement de la solution et les bénéfices attendus dans un parcours progressif. L'intégration Webflow a permis de transformer ces maquettes en une landing page responsive, dotée de composants réutilisables et d'interactions adaptées à la démonstration du produit.
- Industrie
- Saas
- Industrie
- Services
- DA
- UX/UI Design
- Intégration

Direction Artistique
Synapse opère à l’intersection du monde industriel et de la tech IA. La direction artistique devait refléter cette double identité : la rigueur et la crédibilité de l’industrie, combinées à l’innovation et la fluidité d’un produit SaaS moderne.
Une identité visuelle tech & industrielle
La charte graphique de Synapse, fondée sur des tons bleus avec dégradés, a servi de point de départ pour une DA inspirée des meilleures références SaaS B2B (Stripe, Airtable, Typeform) : typographies précises, visualisations de données et éléments évoquant les connexions et la centralisation des flux d’information.
Le logo au cœur du design
Le logo Synapse, avec ses deux formes symétriques évoquant l’embranchement neuronal, la lettre S et l’idée de connexion, a été intégré comme fil conducteur de la DA : ses codes (symétrie, flux, connexion) se retrouvent dans les patterns graphiques, les illustrations et les animations du site.
| Pilier DA | Choix créatif | Message transmis |
|---|---|---|
| Couleurs | Bleu gradient, tech premium | Innovation & confiance |
| Typographie | Sans-serif précis & lisible | Expertise & clarté |
| Visuels | Connexions, flux de données, IA | Intelligence & performance |
| Références | Stripe, Airtable, Typeform | SaaS B2B premium |
Concept 1 : Dark & Structuré
Un univers sombre sur fond bleu nuit qui installe Synapse comme un outil tech sérieux et ambitieux. Le hero splitté texte/interface démontre le produit dès le premier fold. La section "problème vs solution" joue sur deux cards contrastées, gestion morcelée en sombre vs pilotage sans friction en bleu vif, pour matérialiser visuellement la transformation promise. Les sections features suivantes détaillent les cas d'usage en liste sur fond sombre avec captures produit. Une direction premium et percutante pour les dirigeants de PME industrielles exigeants.
Concept 2 : Blanc & Épuré
Un design clair et aéré qui mise sur la lisibilité et la clarté du message. Le hero centré avec forme organique en dégradé chaud en arrière-plan apporte douceur et modernité sans alourdir. La mécanique "problème / solution" est traitée en texte direct et percutant, "Trop d'infos. Trop d'outils. Trop de doutes.", avant d'introduire la plateforme. Les captures produit sur fond blanc respirent et permettent une lecture fluide et progressive. La direction la plus accessible et pédagogique des trois.
Concept 3 : Gradient & Tech
Un hero bleu-violet en dégradé qui crée une atmosphère tech premium sans tomber dans le cliché dark mode. L'interface produit flotte dans cet environnement lumineux avec élégance. Le bandeau d'intégrations, Stripe, Zapier, Slack, Perplexity, installe immédiatement la dimension connectée et ouverte de la plateforme. Les sections alternent fond blanc et blocs violets pour rythmer la lecture. Une direction moderne et différenciante qui positionne Synapse comme l'outil de pilotage de la prochaine génération de PME industrielles.


Design UX/UI
La landing page de Synapse devait convaincre des dirigeants et directeurs opérationnels de PME industrielles, souvent peu familiers des outils SaaS modernes, que Synapse était la solution la plus simple, la plus intelligente et la plus adaptée à leurs réalités terrain.
Simplifier la proposition de valeur
Nous avons structuré l’architecture de la page pour mettre en avant les deux atouts différenciants de Synapse : la simplicité de mise en place (sans bouleverser l’organisation existante) et la puissance de l’IA pour générer des insights actionnables à partir des données de l’entreprise.
Design adapté au secteur industriel
Contrairement aux SaaS B2C grand public, Synapse s’adresse à des décideurs terrain pragmatiques. Le design a été calibré pour inspirer confiance et crédibilité immédiatement, avec des visuels concrets, des cas d’usage clairs et un ton professionnel et direct.
Conversion & lead gen B2B
Les call-to-action ont été pensés pour un processus commercial B2B : demande de démo, prise de contact, accès à une période d’essai. L’architecture UX guide naturellement le visiteur vers l’engagement, avec des zones de réassurance (témoignages, chiffres clés) stratégiquement positionnées.

Intégration Webflow
L’intégration Webflow du site Synapse a mis l’accent sur la fidélité au design, les animations soignées et la performance, essentiels pour un SaaS B2B dont le site est le principal vecteur d’acquisition.
Intégration pixel-perfect
La landing page a été intégrée dans Webflow avec une attention maximale aux détails : rendu pixel-perfect des maquettes, animations de scroll, micro-interactions et transitions fluides inspirées des références SaaS premium comme Stripe et Airtable.
Performance & CMS
Une architecture Webflow légère a été privilégiée pour garantir des temps de chargement rapides, critiques pour le SEO et la conversion, avec une structure permettant à l’équipe Synapse de mettre à jour leur contenu (cas d’usage, témoignages, fonctionnalités) sans intervention technique.
| Critère | Solution | Impact |
|---|---|---|
| Performance | Assets optimisés, code propre | Chargement rapide |
| Animations | Webflow Interactions IX2 | Expérience premium |
| CMS | Sections éditables en autonomie | Flexibilité équipe |
| Responsive | Mobile-first, 5 breakpoints | UX multi-device |
Nos dernières réalisations
+250 entreprises
accompagnées
Des sites designés et développés avec
Vous allez notre collaboration, c’est garanti
Prêt à faire décoller
votre activité ?
Let’s f*****G GO !!













