Accueil » Blog » Les meilleurs outils pour réaliser vos maquettes

Les meilleurs outils pour réaliser vos maquettes

Dans mon boulot de conception d’interfaces, je suis régulièrement amené à réaliser des maquettes.

Maquettes, prototypes, ergolayouts, mockups, wireframes,… de nombreux vocables existent pour désigner ce qu’on peut considérer comme du design fonctionnel (qui s’intéresse au découpage des contenus, à la taille et à la position des fonctionnalités,…) par opposition au design graphique (qui s’intéresse aux couleurs, aux effets graphiques, aux formes,…).

Microsoft Visio reste un des classiques pour réaliser ce genre de tâches. Personnellement, il me déçoit. Je le trouve faible dans son rendu graphique, fermé dans son approche et incomplet en termes d’éléments d’interface.

Jusqu’ici, je trouvais sympathique des outils tels que Gliffy ou Mockingbird.

Mais là, j’ai testé Mockflow, et je l’ai tout de suite adopté !

Tout y est ! Glissez et déposez les objets suivants :

  • Menus verticaux, horizontaux, en onglet, en liens textes, fil d’Ariane,…
  • Cartes géographiques et calendriers interactifs
  • Boutons, barres de défilement, cases à cocher, en-veux-tu-en-voilà
  • Icônes fonctionnelles les plus variées (imprimante, enveloppe, loupe,…)
  • Fonctions sociales et participatives
  • Texte « lorem ipsum » à la demande
  • Et bien d’autres possibilités

Suite à vos commentaires, chers lecteurs, je rajoute Balsamiq, dont j’aime l’allure « brouillon manuscrit ». Elle lève toute ambiguïté sur le fait qu’il s’agit d’une maquette, et non d’un produit fini.

 

J’aime le résultat, car on produit des maquettes propres et professionnelles, sans prendre le risque de dériver sur les questions graphiques, beaucoup plus subjectives en termes de gestion de projet (« Les goûts et les couleurs », comme on dit!). Je vous conseille de passer par ce stade de prototype fonctionnel, avant de vous lancer dans la finition graphique. Même s’il reste souvent intéressant, ensuite, si vous avez la chance de travailler avec un bon créatif, de lui laisser du champ et la possibilité de remettre en question certains choix.

Bon, il reste tout de même les risques liés à un outil en ligne, comme la nécessité de posséder une connexion Internet performante et fiable. Je me rappelle avoir amèrement regretté, en Algérie, mon choix de travailler avec des outils en ligne.

Vous pouvez tester Mockflow gratuitement. Pour une utilisation intensive, il vous en coûtera 59 euros par an. Microsoft Visio coûte 999 $, à titre de comparaison.

Si vous optez pour un produit payant, le « must », c’est Axure Pro, qui permet d’ajouter de l’interactivité à vos maquettes : effets au clic ou au passage de la souris, et bien plus.

Découvrez services en maquettes web ! Faites-vous une idée avec notre poster « avant / après » !

Commentaires des lecteurs

  • Commentaire by krysttof — 8 décembre 2010

    Il manque à ta liste l’excellent Pencil Project : pencil.evolus.vn/en-US/Ho… qui est une extension à Firefox !
    Grandiose !

  • Commentaire by max — 8 décembre 2010

    J’aime bien "Balsamiq Mockups"
    balsamiq.com/products/moc…

  • Commentaire by J.Juraver — 8 décembre 2010

    Pareil que max, j’utilise pas mal balsamiq, assez complet et avec un certain charme "manuscrit"…

  • Commentaire by jmh — 8 décembre 2010

    Oui, j’ai été voir… et je comprends maintenant ce que vous voulez dire par "charme manuscrit" 😉

  • Commentaire by Matthieu — 8 décembre 2010

    Mockflow a l’air vraiment puissant, je vais essayer!

  • Commentaire by Agence Web Wixiweb — 9 décembre 2010

    Le meilleur sans hésitation c’est Axure RP Pro
    http://www.axure.com/

  • Commentaire by Zakaria — 9 décembre 2010

    En effet http://www.axure.com reste un outil excellent pour les approches ergonomiques, et prototypes web !

  • Commentaire by Choko — 11 décembre 2010

    Salut,
    Merci pour ces conseils. Je vais les utiliser prochainement.

  • Commentaire by jmh — 6 janvier 2011

    Protoshare a l’air super aussi… voir le billet d’Elie Sloïm sur le sujet : blog.temesis.com/post/201…

  • Commentaire by Patrice — 8 février 2011

    Je viens de jeter un oeil à pencil.evolus.vn/en-US/Ho… et je le trouve très intéressant, pour un outil gratuit. Ceci dit, je vais tester Mockflow, à ce prix dérisoire …

  • Commentaire by agence web maroc — 28 avril 2016

    Merci pour ces outils , je vais essayer prochainement

Et votre avis ?

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Je suis un human *

https://yellowdolphins.com/wp-content/themes/yellowdolphinshttps://yellowdolphins.com/wp-content/themes/yellowdolphins