Quel est le wireframe d'un projet?

Quelle est la signification réelle d'un filaire d'un projet?

Un filaire est une représentation visuelle très simple de la conception de la mise en page d'un projet, qui est utilisée pour communiquer rapidement les aspects de base du projet. Il est couramment utilisé dans le développement Web, mais une technique a également été adoptée dans d'autres domaines.

Sur une question très similaire sur User Experience Stack Exchange, DA01, l'auteur de la réponse la plus votée note:

Cela dit, un filaire est un croquis pour communiquer l'idée / concept. Le terme vient de la modélisation 3D où le filaire est les primitives de base de l'objet pour donner une impression de forme et d'échelle sans s'engager dans un modèle entièrement rendu.

Dans le contexte des sites Web, les wireframes servent à diverses fins selon le contexte du projet. Ceux-ci peuvent inclure:

• flux du site (généralement réalisé avec des organigrammes)
• interactions (pas toujours faciles à documenter dans un filaire, mais son commun)
• structure générale du contenu
• mise en page générale

Voici quelques exemples de wireframes , les premiers instantanés de Area51 de Stack Exchange :

Les wireframes d' Andreas Wulf : une excellente façon de démarrer des projets de développement, l' article sur InfoQ donne un aperçu rapide des utilisateurs de wireframes:

Qui utilise les wireframes?

Les wireframes constituent un outil de communication efficace dont toutes les personnes impliquées dans le processus de développement peuvent bénéficier:

• CLIENTS - mieux comprendre ce qui va être développé et juger si la solution répond adéquatement à leurs besoins. Ils peuvent voir s'il manque quelque chose dans l'interface utilisateur, quelles actions sont disponibles et comment les éléments d'interface sont assemblés. Très souvent, le fait de montrer un filaire à un acteur commercial soulève des aspects importants qui n'avaient pas été examinés auparavant. C'est une bonne chose, car la résolution des problèmes à l'étape du wireframing est beaucoup plus facile et moins chère que la résolution ultérieure, lorsqu'ils sont définis dans le code.
• CHEFS DE PROJET - utilisez des wireframes pour vous assurer que toutes les parties prenantes sont sur la même page et conviennent de ce qui va être construit. Au fur et à mesure que le projet progresse, ils peuvent utiliser les wireframes comme listes de contrôle pour suivre les progrès et vérifier que tout ce qui est important a été pris en compte et mis en œuvre.
• DESIGNERS - peuvent s'appuyer sur des wireframes comme plans pour la conception visuelle de l'interface utilisateur. Les wireframes leur fournissent la structure squelettique qu'ils peuvent transformer en maquettes parfaites en pixels avec des couleurs, des polices et d'autres éléments de conception.
• DÉVELOPPEURS - utilisez des wireframes pour comprendre les fonctionnalités et les exigences techniques de la solution. Un tas de wireframes rassemblés dans un storyboard peut être utile aux développeurs pour déterminer comment une série d'interactions utilisateur doit fonctionner ensemble.

Lectures complémentaires:

• Questions filaires sur l'échange d'expérience utilisateur,
• Les avantages du wireframing d'une conception .