Une maquette est une représentation visuelle et interactive d’un site web, d’une application web ou d’un logiciel.
Elle sert à la fois à la validation de la conception des écrans, des parcours utilisateurs, et à la planification de l’architecture du site ou de l’application.
Une maquette peut être interactive
Une maquette peut être interactive et comporter des éléments cliquables, des animations et des transitions.
Les maquettes peuvent être réalisées des UX designers ou des spécialistes de l’expérience utilisateur, en particulier lorsqu’elles incluent des aspects interactifs.
L’utilité d’une maquette
Une maquette sert de référence visuelle pour les équipes fournissant des indications précises sur la structure, le positionnement des éléments, les dimensions, les espacements, les couleurs, les polices, et d’autres aspects visuels.
Différence entre wireframe, maquette et mockup de présentation
Une maquette peut inclure plusieurs éléments, des wireframes (schémas de disposition) et prototypes interactifs, en fonction du stade de conception.
Wireframe (basse fidélité):
- Définition : Représentation schématique de l’architecture et de la structure d’une interface, utilisant des formes simples et du texte générique.
- Objectif: Tester et valider l’organisation des éléments, la navigation et le fonctionnement de l’interface.
- Caractéristiques: Niveaux de détail et de finition bas, absence d’éléments graphiques complexes, focus sur la logique et l’ergonomie.
2. Maquette (haute fidélité):
- Définition: Représentation détaillée de l’interface utilisateur, incluant les couleurs, les images, les typographies et les éléments graphiques finaux.
- Objectif: Visualiser l’apparence et l’esthétique du produit final, tester l’impact visuel et l’expérience utilisateur.
- Caractéristiques: Niveaux de détail et de finition élevés, éléments graphiques réalistes, focus sur l’aspect visuel et l’interaction utilisateur.
3. Mockup de présentation (intégration dans un environnement simulé réel):
- Définition: Intégration de la maquette numérique dans un environnement simulé réel, comme un appareil mobile ou un site web.
- Objectif: Tester l’intégration du design dans son contexte d’utilisation, visualiser l’aspect et la sensation du produit final dans son environnement réel.
- Caractéristiques: Maquette haute fidélité insérée dans un environnement numérique simulé, permet d’évaluer l’adéquation du design à l’usage réel.
En anglais : mockup