Wireframe
Définition
Un wireframe, ou maquette fonctionnelle, est un schéma simplifié d'une page ou d'un écran qui montre l'emplacement des contenus, des menus et des boutons, sans couleurs ni graphisme définitifs, pour valider la structure avant la conception visuelle.
Le wireframe se concentre sur ce que la page doit contenir et dans quel ordre. On parle aussi de « fil de fer », en référence à son aspect dépouillé : des blocs gris, des titres, des emplacements d'images.
Wireframe, maquette et prototype
- Le wireframe fixe la structure et la hiérarchie des informations.
- La maquette graphique applique l'identité visuelle : couleurs, typographies, images.
- Le prototype rend les écrans cliquables pour simuler le parcours.
Pourquoi commencer par là
- Discuter du fond sans être distrait par les couleurs.
- Repérer tôt un contenu manquant ou une étape de trop.
- Modifier une structure quand cela coûte encore peu.
- Donner une base claire à la rédaction des textes.
Comment le relire
Posez-vous les questions de vos visiteurs. Sur la page d'accueil, comprend-on ce que vous faites, pour qui et où ? Le bouton de contact est-il visible sans chercher ? Sur un écran d'application, l'action la plus fréquente est-elle la plus accessible ?
Relisez aussi la version mobile : l'ordre des blocs empilés change parfois la compréhension. C'est le point de départ du responsive design et de la réflexion UX.
Un wireframe validé par écrit évite les allers-retours coûteux une fois le développement lancé.