web-dev-qa-db-fra.com

Comment travailler avec des concepteurs visuels qui traitent les wireframes comme des suggestions graphiques littérales?

Récemment, j'ai commencé à faire face à de nombreux cas sur mes projets clients lorsqu'un concepteur visuel de l'équipe produit un design qui ressemble à des images filaires produites par moi, uniquement colorées. Peut-être, la réponse évidente à ma question est "ne travaillez pas avec ce genre de designers". Dans la plupart des cas, cependant, les projets sur lesquels je travaille sont vraiment intéressants et stimulants, donc si je veux rester sur le projet, je suis obligé de travailler avec qui que ce soit dans l'équipe, donc je ferais mieux de trouver le moyen de le résoudre .

J'ai parlé aux équipes pour expliquer ce que sont les wireframes et ce qu'ils ne sont pas et pourquoi appliquer de la couleur à mes wireframes n'est pas un bon travail de conception. J'ai montré des exemples d'excellents travaux de conception réalisés à partir de wireframes. J'ai également changé d'Omnigraffle à Balsamiq afin de produire des maquettes qui ressemblent plus à des croquis en espérant que cela forcerait les concepteurs visuels à être plus créatifs. Cela ne semble pas très bien fonctionner.

Je sais ce que c'est que de travailler avec des concepteurs qui sont capables (correctement) de traiter les wireframes uniquement comme des lignes directrices pour le contenu, la position, la hiérarchie, les fonctionnalités, les interactions, la définition des flux, etc. et font leur magie pour tout envelopper dans une belle et une surface visuelle élégante. C'est la raison pour laquelle les cas opposés provoquent tant de frustration.

Quelqu'un at-il fait face à une telle situation? Si oui, qu'est-ce qui a bien fonctionné et qu'est-ce qui n'a pas supposé que vous avez essayé de faire quelque chose?

46
Marina

Si il colorie vos wireframes, vous leur fournissez peut-être une version de fidélité trop élevée. Essayez de réduire la fidélité pour qu'ils aient à interpréter vos wireframes tout en respectant les exigences IA.

Voici mon exemple grossier de wireframes haute vs basse fidélité.

mockup

/ EDIT - Modification de la maquette de sorte qu'elle n'est pas aussi extrêmement Lo-Fi.

22
JonW

Un travail plus collaboratif pourrait-il surmonter certains de ces problèmes afin que le concepteur visuel comprenne que la pensée se cache derrière le filaire et, par conséquent, comprenne ce qu'il peut ensuite ajouter au-delà de la couleur?

À la lecture de votre description d'un filaire, cela semble très final avec peu de place pour l'interprétation. Si vous êtes dans le domaine des livrables plutôt que des solutions, les structures filaires sont peut-être trop "définitives". Vous pouvez essayer d'informer un concepteur avec d'autres contours descriptifs des "pages" produites pendant la phase de conception de l'expérience pour améliorer la situation. Ceux-ci peuvent inclure ser stories et diagrammes de description de page .

La position à prendre est celle de la motivation et du mentorat du concepteur, il existe de nombreuses ressources et sites similaires à ce que vous avez montré. Le concepteur doit montrer ce qu'il doit faire et comment construire à partir d'un filaire.

19
Adam Fellowes

Il semble que le problème principal soit de comprendre les concepts fondamentaux derrière un basse fidélité livrable et haute fidélité livrable. Vos concepteurs visuels pensent que vous leur donnez un livrable haute fidélité, même s'ils ne savent pas intellectuellement ce que signifie ce terme. S'ils ne le font pas, vous devez leur enseigner.

Les esquisses et les wireframes sont automatiquement Low Fidelity, ce qui signifie qu'ils ne représentent pas visuellement le produit final, ce sont des approximations approximatives de la structure et la logique du potentiel produit final.

Il existe de bonnes ressources expliquant les différences: Répétez après moi: les wireframes ne sont pas de la conception visuelle est un bon article de blog expliquant cela d'une manière que vos concepteurs devraient comprendre:

Si vous recherchez la définition du design, vous pouvez clairement voir que les wireframes tombent dans l'idée de "spécifier un objet destiné à atteindre des objectifs dans un environnement particulier". Une définition technique qui peut être grossièrement traduite comme une feuille de route de la façon dont quelque chose va interagir avec vos utilisateurs.

Cette présentation SlideShare Wireframe vs Mockup Why and When fait un bon travail pour expliquer quand les wireframes sont applicables et ce qu'ils ne sont pas.

Ceci est une sorte de problème éternel de communication entre les concepteurs visuels/clients et les concepteurs UX, donc vous devez vraiment vous assurer que vos concepteurs visuels l'obtiennent si vous allons travailler avec eux pour une période de temps significative.

9
Ben Brocka

L'approche que j'ai utilisée est de demander au concepteur d'ébaucher 3 ou 4 concepts de conception différents pour le même filaire.

Faire cela les encourage à explorer différentes façons de répondre au filaire et leur permet d'essayer des choses très étranges.

Si le concepteur éprouve encore des difficultés, je lui demanderais de me montrer à quoi ressemblerait le wireframe si (disons) l'interface utilisateur Metro lui était appliquée, ou s'il était destiné à être utilisé par des enfants (oui, même si c'est un site financier complexe). Ou je demanderais des lignes courbes douces formant une esthétique organique, ou je leur demanderais de se déchaîner avec des formes frappantes angular comme des triangles .. les deux qui sont complètement différents de l'apparence carrée habituelle des wireframes.

8
Erics

Ce que je fais quand je veux que le concepteur visuel prenne plus d'initiative/de liberté avec mes wireframes, c'est:

  1. Donnez une description détaillée de l'application/du site et de ses objectifs, ainsi que les wireframes. De cette façon, je transmets que je ne recherche pas seulement de jolies couleurs, mais un plan de conception visuelle qui soutient ces objectifs.
  2. Précisez quelles parties du wireframe nécessitent plus d'attention - parce que je ne suis pas absolument confiant à leur sujet, ou je veux qu'ils (les concepteurs) explorent différentes solutions. Parfois, je donne 2 ou 3 alternatives, et parfois je les laisse juste faire une suggestion.
8
Yosef Waysman

Nous travaillons avec de nombreux designers depuis de nombreuses années, et ce n'est que récemment que nous avons rencontré ce problème pour la première fois - et pour deux projets à la fois!

Il semble que ce genre de chose se produit lorsque l'arrière-plan du concepteur est imprimé, pas Web. Quand nous avons vu le "design" du designer, nous leur avons dit - le wireframe n'est pas un design, changez-le. Un designer a réussi à amener le design à un niveau où il avait l'air conçu, sans trop de main de notre part; l'autre ne l'a pas fait, nous avons donc dû les nourrir à la cuillère en leur montrant des éléments sur d'autres sites et en leur disant quoi concevoir et comment. Après de nombreuses révisions et de nombreuses contributions de notre part, le site s'est très bien déroulé. Mais notre devis original ne tenait pas compte de cette évolution inattendue où nous devions investir des heures à guider le designer.

Je suggère que lorsque vous commencez à travailler avec un concepteur, demandez-leur s'ils ont de l'expérience dans la conception pour le Web, et si oui, quelle est son étendue? Cela semble être un facteur déterminant important dans leur capacité à transformer un filaire en une conception.

4
Miriam Schwab

Je pense que ces questions seraient plus appropriées en tant que question de gestion de projet car elles ne sont probablement pas spécifiques aux wireframes ou non, mais comment travailler ensemble et de manière collaborative.

Toute la description est de savoir comment vous pensez que cela fonctionne le mieux, mais pas comment fonctionne le concepteur visuel. Je ne sais pas s'il existe quelque chose comme une norme de l'industrie pour travailler avec des wirefrmaes. Cela résume donc la façon dont vous trouvez tous les deux un moyen de travailler ensemble. Et ici, les deux ont des besoins et des désirs appropriés.

  • Vous avez clairement décrit ce que vous pensez de la situation, mais avez-vous demandé au designer? Connaissez-vous son point de vue? Essayez de mieux comprendre la situation des deux points de vue.
  • Si vous en comprenez les causes, vous pouvez chercher une solution . Vous avez écrit que votre solution était d'imposer plus de créativité par des croquis plus grossiers. Mais même ici, c'est votre solution, pas la solution des deux.
  • Si, ensemble, vous avez trouvé une solution, vous pouvez établir un plan pour la réaliser . Surveillez ce plan car rien n'est parfait et il pourrait avoir besoin d'un ajustement.
  • Parfois et très rarement, il n'est pas possible de trouver un moyen adapté aux deux. Ou peut-être que son comportement est mauvais à dessein. Dans ce cas, allez à la haute direction et demandez de l'aide.
2
FrankL

Je trouve que c'est un cas où les graphistes\concepteurs visuels ne sont pas vraiment sûrs de leur rôle dans l'entreprise. La plupart des concepteurs visuels semblent (malheureusement) avoir l'impression que leur travail consiste à rendre le design joli et coloré. Heureusement, je n'ai rencontré ce problème qu'une seule fois et voici les mesures que j'ai prises pour essayer de résoudre le problème

  1. Comme indiqué, essayez de garder vos wireframes très fidèles. Plus ils sont de haute fidélité et plus ils sont proches d'un look fini, moins vous obtiendrez d'opposition en ce qui concerne les lignes directrices de style et de design.
  2. Pendant le wireframing, essayez d'impliquer votre concepteur visuel dans le processus. Cela pourrait être aussi simple que de simplement dessiner sur un tableau blanc et lui demander ses entrées ou simplement lui demander de s'asseoir à côté de vous pendant que vous concevez un filaire et demandez ses entrées
  3. Demandez-leur de proposer plusieurs variantes du design que vous avez conç. Bien que l'une des conceptions puisse être exactement comme le filaire que vous avez créé, des variantes alternatives en termes de disposition de conception et de style de couleur les aideront à exprimer leurs points de vue et à proposer des idées plus innovantes. Cependant, assurez-vous qu'ils sont conscients des restrictions en termes de directives de marque et de spécifications de conception afin de ne pas concevoir quelque chose qui est totalement hors de portée
2
Mervin