Outils de maquettage pour les sites web

Le logiciel de mockup est un outil indispensable de l'agence web Joomla! pour définir l'ergonomie de votre site web.

Pourquoi utiliser un logiciel de mockup ?

Un logiciel de mockup est un outil bien pratique qu’il faut compter dans sa toolbox au moment de se lancer dans un projet de création de site web. C’est ce type de logiciel qui va vous permettre de concevoir les maquettes fonctionnelles ou wireframes des pages lors, par exemple d'une refonte de votre site.

Maquettes fonctionnelles me dites-vous ?? En deux mots, les maquettes fonctionnelles ou wireframes servent à représenter de façon visuelle l’ensemble des éléments qui doivent figurer sur une page (titres, textes, images, boutons, …), ainsi que leur taille et leur emplacement sur la page.

L'indispensable maquettage

Le maquettage fonctionnel est une étape indispensable car elle force à se poser de nombreuses questions pour affiner la structure de votre futur site web, l’organisation interne des pages et leur maillage. Le fruit de votre travail sera ensuite transmis au webdesigner qui s’en servira de base de travail pour réaliser les maquettes graphiques de vos pages.

Fournir des wireframes propres à votre webdesigner simplifiera son travail et lui permettra de se concentrer sur le design graphique où est sensée se trouver sa plus grande valeur ajoutée. Cela vous évitera également quelques mauvaises surprises au moment de découvrir vos premières maquettes graphiques.

Des wireframes faciles!

La majorité des logiciels de mockup est très simple d’utilisation et facile à prendre en main. Vous disposez d’un jeu de composants de base à placer, dimensionner et habiller pour composer peu à peu votre page. Les interfaces se veulent épurées et intuitives et proposent parfois du drag and drop pour vous faciliter la tâche de création de site web.

Ces logiciels peuvent se présenter en version installable ainsi qu’en version SaaS, exécutable en ligne. Bon nombre de ces logiciels sont gratuits ou bien proposent au moins une version d’essai gratuite (souvent en ligne) pour vous faire votre propre idée.

Logiciels de mockup ou versions papier pour mes maquettes ?

Vous pouvez certes réaliser vos maquettes fonctionnelles sur papier ou bien faire un usage détourné d’un logiciel comme power point, mais les logiciels de mockup présentent de nombreux avantages :

Ils permettent de travailler à l’échelle et d’avoir une véritable représentation visuelle de l’aspect final des pages du site.
Ils proposent des composants types faciles à personnaliser qui font gagner un temps considérable.
Ils permettent de dupliquer la structure d’un wireframe pour gagner du temps lorsque deux maquettes sont assez similaires.
Le rendu des wireframes étant très proche d’un dessin, le logiciel de mockup oblige à se concentrer sur les aspects fonctionnels de la maquette sans perdre de temps sur son graphisme.
Un wireframe réalisé avec un logiciel de mockup est très simple à faire évoluer.

Du simple wireframe au prototypage de site

Les logiciels de mockup peuvent en fait être plus ou moins riches sur le plan fonctionnel. Certains logiciels de mockup permettent uniquement de réaliser des wireframes très simples, proches du dessin. D’autres proposent une palette de services beaucoup plus étendue, permettant de tout concevoir, de la maquette la plus dépouillée jusqu’à un véritable prototype de site permettant de naviguer d’une page à l’autre !

Choisir son logiciel de mockup

Balsamiq : Un logiciel simplissime à prendre en main, dont l’élégant rendu crayonné permet de se détacher complètement des considérations esthétiques tout en offrant un certain degré de personnalisation.
Cacoo : Un logiciel en ligne très performant et particulièrement adapté aux projets de maquettage collaboratifs. Cacco a également été conçu pour faciliter la création de schémas en tous genres.
Axure : Un logiciel qui couvre tout le spectre du maquettage : des wireframes les plus épurés aux prototypes les plus évolués. Il s’agit d’un des outils les plus complets du marché dont le prix le destine cependant plutôt à des utilisateurs pro.

Voici quelques autres logiciels de mockup gratuits ou avec version d’essai gratuite :

Pencil
MockFlow
Justinid
Pidoco
PowerMockup
WireframeCC
Moqups
Wirefy
iPlotz