Retour aux réalisationsÉtude de cas — Site vitrine

Dianko Sylla : un site qui connecte la confiance à la conversion

Comment nous avons transformé l'histoire personnelle d'un entrepreneur sénégalais en un site vitrine sobre, premium, et pensé pour générer des contacts WhatsApp qualifiés.

Client : Dianko Sylla / Mamé TransportSecteur : Import-export de véhicules, Chine → AfriqueType de projet : Site vitrine one-pageStack : Next.js, Tailwind CSS, TypeScript

Qui est Dianko Sylla

Dianko Sylla est un entrepreneur sénégalais basé en France. Fondateur de Mamé Transport, il importe des véhicules et machines depuis la Chine, bus, camions, tuktuks, scooters, 4x4, pour les revendre à des transporteurs et entrepreneurs au Sénégal, notamment à Rufisque.

Son activité repose entièrement sur la confiance : des clients qui engagent des sommes importantes dans l'achat d'un véhicule, à distance, sur la base de la réputation du vendeur. Avant ce projet, cette confiance se construisait uniquement par le bouche-à-oreille et les échanges directs sur WhatsApp, sans vitrine numérique pour appuyer le discours.

Ce qui manquait

Dianko avait un besoin clair mais un brief volontairement large : construire une présence en ligne qui donne immédiatement confiance à un visiteur qui ne le connaît pas encore, tout en restant simple à faire évoluer. Trois contraintes structurantes se sont dégagées dès le départ.

Pas d'équipe technique en interne

Le site devait être livrable rapidement, sans dépendre d'allers-retours longs sur des détails d'infrastructure.

Le canal de conversion réel, c'est WhatsApp

Ses clients ne remplissent pas de formulaires de contact classiques, ils envoient un message WhatsApp direct. Le site ne devait donc pas être pensé comme un site avec formulaire en option, mais comme un site conçu autour de WhatsApp comme canal principal.

Des assets partiels et évolutifs

Logo, photos, vidéos de témoignages arrivaient au fil de l'eau, pas tous prêts au lancement. Le site devait pouvoir absorber ces ajouts sans refonte.

Les décisions qui ont structuré le projet

Identité visuelle héritée du logo, pas inventée

Plutôt que de proposer une nouvelle direction artistique, nous avons construit toute la palette du site à partir du logo Mamé Transport existant : un bordeaux profond et un gris argenté, qui évoquent à la fois le sérieux corporate et l'univers du transport. Cette contrainte a été traitée comme un atout : la cohérence entre le logo, le favicon, et le site renforce la reconnaissance de marque plutôt que de la diluer.

Une architecture one-page pensée comme un argumentaire de vente

Le site suit une structure volontairement linéaire, pensée comme un argumentaire commercial qu'on déroule à un client potentiel : Hero (accroche et preuve visuelle immédiate) → À propos (crédibilité humaine) → Produits (le catalogue, avec fiches détaillées en popup) → Valeurs (réassurance) → Témoignages, textes et vidéo (preuve sociale) → FAQ (lever les objections) → Contact (un seul call-to-action clair : WhatsApp). Chaque section a un rôle précis dans le tunnel de conversion, rien n'est décoratif.

WhatsApp comme colonne vertébrale, pas comme option

Décision la plus structurante du projet : après une clarification avec le client, nous avons retiré le formulaire de contact initialement prévu pour tout centrer sur WhatsApp, bouton flottant permanent, boutons d'action dans le hero, dans chaque fiche produit, et dans la section contact finale. Le site ne cherche jamais à capter un lead par un canal que le client n'utilise pas réellement.

Comment le projet a avancé

  1. 1

    Cadrage initial

    Brief détaillé du client sous forme de prompt structuré : contexte business, ton de marque, structure de page section par section, contenu éditorial pré-rédigé par le client lui-même (son texte sur son parcours entrepreneurial, ses valeurs).

  2. 2

    Première version avec les assets disponibles

    Au lancement, certains assets manquaient (logo, photos supplémentaires, catégories de produits comme moto ou machine industrielle). Plutôt que d'attendre, nous avons livré une première version cohérente avec les assets réels disponibles, en gardant l'architecture ouverte pour les ajouts futurs.

  3. 3

    Itérations rapides pilotées par le client

    Au fil des retours : intégration du logo réel une fois reçu, choix du bon visuel hero parmi deux photos proposées (celle avec le drapeau chinois et la plaque Partenariats Sénégal-Chine a été choisie pour renforcer visuellement le message du titre), refonte de la section Mon parcours jugée trop discrète en une version pleine largeur avec citation mise en avant.

  4. 4

    Simplification en cours de route

    Le formulaire de contact avec validation a été entièrement retiré une fois clarifié que le client n'avait pas d'adresse email de contact et ne voulait gérer que WhatsApp. Plutôt que de garder une fonctionnalité inutilisée, la section contact a été réduite à l'essentiel.

  5. 5

    Enrichissement du contenu au fil de l'eau

    Ajout de deux témoignages vidéo clients (format portrait, façon réseaux sociaux) au-dessus des témoignages écrits, pour renforcer la preuve sociale sans attendre une refonte complète.

  6. 6

    Finalisation de l'identité de marque

    Génération d'un favicon à partir du logo, recadré spécifiquement sur le mot-clé MAMÉ pour rester lisible à la taille réduite d'un onglet de navigateur, un détail qui semble mineur mais qui évite qu'un logo riche en détails devienne illisible une fois miniaturisé.

  7. 7

    Mise en cohérence technique finale

    Correction des métadonnées (URL canonique, Open Graph) pour pointer vers l'URL de déploiement réelle, garantissant que les aperçus de lien partagés (sur WhatsApp notamment) s'affichent correctement.

Les détails d'exécution

Le hero — site Mamé Transport

Le hero

Le message central, "L'homme qui connecte la Chine à l'Afrique", est appuyé par une photo choisie précisément pour son contexte visuel : le drapeau chinois et la plaque Partenariats Internationaux Sénégal-Chine rendent le positionnement lisible sans qu'aucun texte n'ait besoin de l'expliquer davantage.

Les fiches produits en popup — site Mamé Transport

Les fiches produits en popup

Chaque catégorie de véhicule (bus, camions, tuktuks, scooters, 4x4) dispose d'une fiche détaillée accessible en un clic, avec galerie photo navigable et bouton d'action direct vers WhatsApp, pour transformer la curiosité en conversation sans jamais quitter la page.

La section Mon parcours retravaillée — site Mamé Transport

La section Mon parcours retravaillée

Version initiale : texte dense en deux colonnes serrées. Version finale : pleine largeur, citation phare du client mise en exergue en grand format, photo humaine à côté du texte. Un ajustement simple qui change complètement la perception de cette section, de paragraphe corporate à histoire personnelle qui inspire confiance.

Le menu mobile — site Mamé Transport

Le menu mobile

Repensé en cours de projet après un retour direct du client sur son expérience mobile : overlay avec fond opaque, animation fluide, fermeture au clic extérieur, liens généreusement espacés, pour une navigation mobile qui ne fait pas à moitié fini.

Le bouton WhatsApp flottant — site Mamé Transport

Le bouton WhatsApp flottant

Présent sur toutes les pages, en toute circonstance, avec une animation de pulsation discrète pour attirer l'œil sans être intrusif, le point de conversion le plus important du site est aussi le plus visible.

Pourquoi cette stack

Next.js et Tailwind CSS pour un site rapide à livrer, facile à faire évoluer, et hébergeable gratuitement sur Vercel avec déploiement automatique à chaque mise à jour du code. TypeScript pour fiabiliser le code sur la durée, même si le projet est amené à être repris ou enrichi par d'autres personnes plus tard. Framer Motion pour des animations subtiles (apparition au scroll, transitions de popup) qui donnent une sensation de finition sans jamais ralentir le chargement de la page.

Ce choix technique n'est pas un dogme : c'est le bon compromis pour un site vitrine qui doit être livré vite, coûter peu à héberger, et rester maintenable sans expertise technique lourde du côté du client.

Ce qui a été livré

  • Site vitrine complet en une seule page, 7 sections, entièrement responsive
  • Identité de marque cohérente du favicon jusqu'au footer, construite à partir du logo existant du client
  • Tunnel de conversion entièrement centré sur le canal réellement utilisé par le client : WhatsApp
  • Catalogue de 5 catégories de véhicules avec fiches détaillées et galerie photo
  • Témoignages écrits et vidéo pour la preuve sociale
  • Déploiement continu opérationnel : chaque mise à jour du code est en ligne en quelques minutes
  • Lien du site intégré directement au profil WhatsApp Business du client, pour connecter le canal de conversation au site de présentation
WhatsApp comme canal de conversion unique

Un site conçu autour du canal que le client utilise réellement, pas autour d'un formulaire qui n'aurait mené nulle part.

Honnêtement, ce qui reste à faire

Un projet vivant reste toujours en mouvement. Ce qui est identifié comme prochaine étape avec le client :

  • L'ajout d'un vrai canal email une fois disponible, pour compléter WhatsApp sans le remplacer
  • L'enrichissement du catalogue avec des catégories actuellement en attente de photos (motos, machines industrielles)
  • Le remplacement des témoignages placeholder par les retours réels de clients supplémentaires
  • L'acquisition d'un nom de domaine dédié pour renforcer encore la crédibilité de marque au-delà de l'URL de déploiement par défaut

Cette transparence sur les itérations en cours fait partie de notre manière de travailler : livrer vite une base solide, puis l'enrichir en continu avec le client plutôt que d'attendre une version parfaite avant de lancer.

Vous avez un projet similaire ?

Que vous soyez entrepreneur, indépendant, ou dirigeant de PME, nous construisons des sites vitrines pensés pour votre réalité business, pas pour un template générique. Discutons de votre projet.

Démarrer mon projet

Prêt à donner une vraie voix à votre business ?

Discutons de votre projet. Premier échange gratuit et sans engagement.

Premier échange gratuit
Sans engagement
Réponse sous 24h