Outil de maquette de site web : Lequel utiliser gratuitement ?

Avant de coder un site, il faut le montrer au client. C'est là que trois types d'outils entrent en jeu, et ils ne servent pas au même moment du projet : la maquette fil de fer, la maquette graphique, et le prototype cliquable.

Maquette fil de fer, maquette graphique, prototype : la différence

La maquette fil de fer (ou wireframe) pose la structure d'une page sans couleur ni typographie définitive : où va le menu, où va le bloc de contenu principal, où se place le bouton d'action. Elle sert à valider l'organisation avant de perdre du temps sur l'esthétique.

La maquette graphique reprend cette structure et lui donne un rendu visuel complet : couleurs, polices, images, icônes. C'est ce que le client voit habituellement comme « le design du site », mais elle reste une image fixe, pas un site fonctionnel.

Le prototype cliquable relie plusieurs maquettes graphiques entre elles pour simuler la navigation : cliquer sur un bouton fait passer d'un écran à l'autre, comme sur le futur site. C'est l'étape la plus proche du produit final avant le développement réel, et souvent celle qui permet de repérer les problèmes d'ergonomie.

Des outils gratuits ou avec une offre gratuite

Plusieurs outils permettent de créer ces maquettes sans payer, au moins pour démarrer. Figma propose une offre gratuite suffisante pour un projet individuel ou une petite équipe, avec fil de fer, maquette graphique et prototype cliquable dans un même outil. Penpot est un outil libre et gratuit, une alternative intéressante quand on veut éviter de dépendre d'un service propriétaire. D'autres outils comme Adobe XD, InVision, Marvel ou Framer offrent aussi des versions gratuites ou des essais, chacun avec ses habitudes d'interface.

Comment choisir son outil

Le meilleur outil est souvent celui que l'équipe de conception maîtrise déjà, ou celui que le client peut consulter facilement sans installer de logiciel. Comme la plupart de ces outils proposent une offre gratuite, tester deux ou trois solutions sur un petit projet avant de choisir reste la meilleure méthode : chacun a ses raccourcis, sa bibliothèque de composants et sa façon de gérer la collaboration en temps réel.

Un point à vérifier avant de s'engager sur un outil pour un projet long : la facilité à exporter ou migrer les maquettes si l'équipe change d'outil en cours de route, et la possibilité pour le client de commenter directement sur les écrans sans créer de compte payant.