Meilleurs outils pour la création de maquettes de sites Web

Question

Lorsque je crée une structure filaire pour un site web, je commence toujours par une Pochoir Visio pour fil de fer de Garrett Dimon . Le pochoir est étonnant mais cela fait quelques années qu'il n'a pas été mis à jour et je cherche quelque chose de nouveau et d'excitant.

Quel(s) outil(s) de conception filaire utilisez-vous, le cas échéant ?

Answer 1

Checkout Maquettes Balsamiq

Answer 2

Chez nous, nous utilisons réellement le HTML / CSS. Je sais, je sais - écoutez-moi bien... :)

Nous utilisons une grille simple de mise en page css telle que Système de grille 960 avec des couleurs monochromes et pratiquement aucun graphique (peut-être une version monochrome du logo du client, mais c'est tout) pour mettre en place les pages les plus importantes.

Au lieu de devoir exprimer des éléments d'interface utilisateur complexes, tels que les éléments qui peuvent se déplacer lorsqu'on clique dessus, nous pouvons utiliser un simple JQuery pour simuler le mouvement.

Avantages

• Nous utilisons les outils que nous connaissons tous pour le construire.
• Nous savons que le client pourra visualiser facilement l'image filaire.
• L'aspect très basique montre clairement qu'il s'agit d'une maquette.
• Nous pouvons montrer les interactions / mouvements au lieu de devoir les expliquer.
• Nous savons que nous ne construisons pas quelque chose qui sera trop difficile à mettre en œuvre en HTML !
• Il ne nous faut pas plus de temps qu'il n'en faudrait pour utiliser un outil graphique.

Désavantages

• Il faut être très à l'aise avec le HTML/CSS pour faire cela rapidement, mais si vous l'êtes, ce n'est pas plus lent qu'une autre méthode.

Cela vaut certainement la peine d'y réfléchir, je dirais...

Answer 3

Avez-vous essayé Pencil, l'addon de Firefox, qui est gratuit ?

http://www.evolus.vn/Pencil/

La mission unique du Pencil Project est de construire un outil gratuit et open source pour la création de diagrammes et le prototypage d'interfaces graphiques que tout le monde peut utiliser.

Caractéristiques principales :

• Pochoirs intégrés pour la création de diagrammes et de prototypes.
• Document multi-pages avec page de fond
• Édition de texte à l'écran avec prise en charge du texte enrichi
• Trame PNG
• Supports Undo/redo
• Installation de pochoirs définis par l'utilisateur
• Opérations de dessin standard : alignement, ordre z, mise à l'échelle, rotation...
• Plates-formes croisées
• Ajout d'objets externes

Answer 4

Le denim est plutôt cool. Il est facile à utiliser et peut produire des "croquis" très "bruts", ce qui est un gros avantage lorsqu'on le montre à un utilisateur. (Si la démo a l'air trop "brillante", ils pensent que c'est déjà fait). Il est également gratuit.

http://dub.washington.edu:2007/denim/

Answer 5

Je viens de tomber sur Oiseau moqueur et ça a l'air très intéressant.