De deux sites fantômes à un écosystème digital reprenable en autonomie.

La méthode a commencé par un audit heuristique Nielsen (score global 4,8 / 10) et une analyse sémantique de 405 avis clients collectés sur Google, Uber Eats et TripAdvisor entre 2022 et 2025. Quatorze thématiques UX ont émergé, croisées avec un quadrant stratégique (forces émotionnelles vs frictions critiques) et une segmentation en quatre proto-personas : clients fidèles 15+ ans, jeunes / étudiants, actifs pressés, familles locales.

Verbatim révélateurs sur la marque : « la meilleure sauce du monde », « 17 ans de fidélité », « accueil chaleureux ». Verbatim sur les frictions : « oubli de viande », « pas possible d'enlever les oignons », « mal au ventre toute la nuit ». L'écart entre la promesse de marque et l'expérience livrée a orienté toutes les priorités de la refonte.

Cinq couleurs principales sourcées sur le logo Costa Kebab :

• Costa Primary #919436 — vert olive, fond institutionnel, packaging
• Costa Secondary #C75B38 — rouge paprika, accent fort, boutons d'appel (contraste vérifié 4,7:1 sur fond blanc, RGAA AA)
• Costa Accent #EDBC36 — jaune sauce, surlignage, pictos UI
• Costa Digital #165FAA — bleu navigation, liens web, réseaux sociaux
• Costa Neutral #414242 — gris anthracite, texte principal

Chaque couleur déclinée en variants light et dark pour les états hover et active (12 couleurs au total). Typographie Open Sans (32 / 24 / 20 / 18 px titres, 16 / 14 / 12 / 10 px corps). Grille 8 points (XS 4 px → 3XL 64 px), radius XS 4 px → Full 32 px, quatre niveaux d'ombre. Conforme RGAA niveau AA sur tous les contrastes et tap targets.

Composants atomiques calibrés Desktop et Mobile distincts pour respecter les tap targets RGAA :

• Boutons : 4 tailles (Small 32-36 px, Medium 40-44 px, Large 48-52 px, Extra Large 60 px) × 4 variants couleur × 2 supports
• Badges : 3 tailles (20-22 / 24-26 / 28-30 px) × 4 variants couleur
• Inputs : 3 tailles (32-40 / 40-48 / 48-56 px) × 2 supports × 2 états focus

Tap targets Mobile à 48 px minimum sur tous les CTA. Tous les composants taggés ✅ Conforme RGAA AA dans Figma.

Stack WordPress + Elementor, back-office personnalisé avec widgets visuels et tutoriels vidéo intégrés pour un gérant non-technique.

Résultats mesurés sur la V1 livrée :

• Audit RGAA 4.1 (WAVE + Axe + Lighthouse) : 94 / 100 — conforme aux exigences légales
• Cross-browser testé : Chrome 127, Firefox 129, Safari 17, Edge 117
• Résolutions vérifiées : 390 px mobile, 768 px tablette, 1440 px desktop
• Temps de chargement : < 3 secondes sur mobile
• Contraste texte/fond : ratio minimum 4,5:1 respecté

SEO : 65 / 100 (bases solides, structure technique saine, URLs propres, mots-clés locaux « kebab Saint-Médard-en-Jalles », balises Title + meta, images WebP avec alt). Optimisations V2 prévues : RankMath, Schema.org markup, sitemap auto, Google Search Console et Analytics.

RGPD : 75 / 100 (mentions légales, politique de confidentialité, opt-in formulaires, cookies essentiels uniquement). V2 : plugin Complianz et registre de traitement.

Newsletter : plateforme MailPoet retenue (intégration native WordPress, RGPD compliant, gratuit jusqu'à 1000 abonnés). Maquette responsive Mobile + Desktop, template de base réutilisable, intégrée au parcours utilisateur post-commande et post-inscription fidélité.

Vidéo promotionnelle : storyboard détaillé, ratio 16:9 (1920×1080) pour YouTube et écran vitrine, ratio 9:16 pour stories Instagram. Hébergée YouTube, accessible via QR code en magasin.

Print : flyer 2 volets, fichier imprimeur PDF/X-1a haute définition (300 dpi, fonds perdus 3 mm, traits de coupe). Mockup réaliste pour validation client.

Stratégie réseaux sociaux : Instagram retenu (cible jeunes/étudiants/familles locales), calendrier éditorial 2 plats du jour + 1 témoignage + 1 contenu fondateur par semaine, templates Canva cohérents avec la charte, hashtags géolocalisés Bordeaux. KPI 90 jours : +20 % followers, +15 avis 5*, +30 % scan QR fidélité, +25 % commandes via QR menu.

Dans le cadre pédagogique de la formation CDUI, une réflexion stratégique sur le naming a été conduite. Trois propositions argumentées et vérifiées juridiquement (INPI + noms de domaine) :

• Kébaboo — recommandation principale, « Ton kebab. Ton style. Ton appli. » — viral, app-friendly, mascotte possible, programme BooPoints
• Broch'App — orienté application mobile + fidélité
• Közta — premium, méditerranéen, logotypable

Le nom Costa Kebab a été conservé selon la volonté explicite du gérant. Les propositions restent disponibles pour une extension future (gamme produits, app dédiée, rebranding franchise).