UI/UX design (site et application)
Certains liens de cette page sont des liens d'affiliation : nous pouvons toucher une commission, sans surcoût pour vous. En savoir plus
Le UI/UX design répond à deux questions : où mon visiteur doit-il aller pour obtenir ce qu’il veut, et est-ce que le chemin est évident en le regardant. Beaucoup de sites investissent dans le développement et la publicité avant de traiter ces deux questions, puis s’étonnent de convertir peu.
UX : la logique avant l’esthétique
Un bon parcours UX part des intentions réelles des utilisateurs : ce qu’ils cherchent, dans quel ordre, avec quel niveau d’expertise. Un formulaire de devis, une commande ou une réservation bien structuré convertit mieux qu’une page animée et confuse.
UI : un système, pas des écrans isolés
Les maquettes isolées vieillissent mal. Un design system définit les composants une fois (boutons, champs, messages) et permet à l’équipe de créer de nouvelles pages sans casser la cohérence. Il réduit aussi le temps de développement et les allers-retours.
L’accessibilité profite à tous
Contrastes suffisants, textes lisibles en petit format, navigation clavier : ces règles aident les personnes confrontées à des limitations temporaires ou permanentes, et améliorent l’expérience de tous. Elles sont aussi souvent exigées dans les appels d’offres publics. translations: en: “ui-ux-design”
Quand en avez-vous besoin ?
- Votre site reçoit du trafic mais peu de visiteurs remplissent le formulaire ou achètent
- Vous lancez une application ou un SaaS et devez montrer les écrans avant de coder
- Vos utilisateurs appellent l'assistance pour des questions basiques sur la navigation
- Vous préparez une refonte et voulez éviter de tout recoder en même temps que de tout repenser
- Votre interface n'est pas accessible sur mobile et vous perdez une large part de vos visiteurs
Comment ça se passe
- Recherche utilisateur — Analyser les données existantes (analytics, enregistrements de sessions, tickets de support), faire des entretiens avec 5 à 10 utilisateurs et examiner les parcours concurrents.
- Structure et parcours — Définir l'architecture de l'information, les parcours principaux et les cas limites (erreur, paiement refusé, compte non vérifié). Un wireframe de chaque écran clé suffit à ce stade.
- Prototype UI et tests — Créer les maquettes haute fidélité et un prototype interactif, puis le tester sur 5 à 8 utilisateurs réels. Corriger avant de transmettre au développement.
- Design system — Construire une bibliothèque de composants réutilisables (boutons, formulaires, cartes, menus) avec leurs états. Un design system réduit les allers-retours avec les développeurs.
- Accompagnement du développement — Rester disponible pendant l'intégration pour vérifier les écarts entre maquette et code, et décider des adaptations nécessaires quand la réalité technique impose un changement.
Combien ça coûte
| Prestation | Prix indicatif | À savoir |
|---|---|---|
| Audit UX d'un site existant | 8 000 – 20 000 MAD (≈ 730 – 1 800 €) | Analyse des parcours, des données et recommandations priorisées |
| Maquettes d'un site vitrine | 10 000 – 25 000 MAD (≈ 900 – 2 300 €) | 10 à 15 écrans, version mobile incluse |
| UI/UX d'une application | 30 000 – 60 000 MAD (≈ 2 700 – 5 500 €) | Parcours complets, prototype et design system |
| Design system seul | 15 000 – 40 000 MAD (≈ 1 400 – 3 700 €) | Composants, documentation et fichier prêt pour les développeurs |
| Tests utilisateurs | 5 000 – 12 000 MAD (≈ 450 – 1 100 €) | 5 à 8 participants, analyse et rapport vidéo |
Fourchettes indicatives pour le marché marocain en 2026, hors taxes. Les tarifs varient selon le périmètre et le prestataire.
Outils recommandés
Les outils que nous recommandons le plus souvent pour ce type de projet.
Figma
Maquettes, prototypes et design system collaboratif
Maze
Tests utilisateurs à distance avec métriques d'utilisation
Hotjar
Enregistrements de sessions et cartes de chaleur
Google Analytics 4
Parcours réels, abandons et points de friction
Stark
Vérification des contrastes et de l'accessibilité
Erreurs à éviter
- Redessiner sans regarder les données : une refonte sans analyse des parcours réels rate souvent les vrais problèmes
- Dessiner uniquement la version bureau et adapter le mobile à la fin, où les écrans se cassent
- Négliger les états vides, les erreurs et les temps de chargement, qui sont une grande partie de l'expérience réelle
- Faire tester par l'équipe interne plutôt que par de vrais clients, qui n'ont pas la même lecture
- Livrer des maquettes sans design system : le développement reconstruit chaque bouton différemment
Questions fréquentes
Quelle différence entre UI et UX ?
L'UX (expérience utilisateur) concerne la structure, les parcours et la logique : comment on atteint son objectif. L'UI (interface utilisateur) concerne l'apparence : couleurs, typographies, espacements. L'UX sans UI est un plan, l'UI sans UX est une belle coquille.
Faut-il faire le UI/UX avant ou pendant le développement ?
Avant, au moins pour les parcours principaux. Dessiner pendant le développement crée des allers-retours coûteux. Une approche en deux temps (maquettes des écrans clés, puis design détaillé des écrans secondaires) fonctionne bien.
Combien de temps prend un projet UI/UX ?
Un site vitrine prend 2 à 4 semaines, une application 5 à 8 semaines avec les tests utilisateurs. Un design system complet ajoute 2 à 3 semaines.
Peut-on réutiliser un thème existant et faire seulement un peu d'UX ?
Oui. Un audit UX, la correction des parcours clés et l'adaptation mobile sur un thème existant peuvent déjà améliorer nettement la conversion, pour un budget bien plus faible qu'une refonte complète.
Comment mesurer le retour sur investissement du UI/UX ?
Suivez le taux de conversion, le taux d'abandon des formulaires, le temps pour accomplir une tâche et le nombre de contacts au support. Comparez sur une période identique avant et après, pour des portées de trafic similaires.
Mis à jour le