Outils / processus recommandés pour le prototypage UX?
Je suis en train de prototyper l'expérience utilisateur d'un projet d'application web, en itérant avec les utilisateurs deux fois par semaine. J'ai testé différentes approches (modaux vs nouvelles pages, boutons d'édition vs effets de survol, etc.) en mettant les utilisateurs aux commandes, en observant leurs réactions et en recueillant leurs commentaires. Jusqu'à présent, j'ai utilisé jQuery, Backbone.js et Express pour tester différents flux de travail et éléments d'interface utilisateur, ainsi que pour fournir une couche de persistance des données simple. Dans ma quête pour prototyper rapidement une solution contre les extractions du monde réel, cependant, mon instinct me dit qu'il devrait y avoir une meilleure façon.
Pour ceux qui ont un moment libre, j'aimerais entendre comment d'autres membres de la communauté Stack UX abordent les mêmes objectifs. Plus précisément, quels outils et processus avez-vous trouvé efficaces pour prototyper une expérience utilisateur de qualité?
On dirait que vous faites du prototypage HTML avec Javascript pour les itérations de fonctionnalité (Backbone.js wheee!) Alors laissez-moi l'aborder de ce point de vue.
Tout d'abord, faire des choses en HTML vous permet de vous concentrer sur les bons détails de l'expérience utilisateur, alors qu'avec un outil comme Axure ou le prototypage papier, vous dézoomez vraiment trop à un niveau conceptuel. Ce n'est pas le bon niveau de détail pour itérer sur les détails les plus fins de la façon dont quelque chose fonctionne. Vous ne pouvez pas non plus faire les choses que vous essayez de faire maintenant avec ces approches (comme la persistance des données), alors qu'avec HTML et Javascript c'est trivial.
Je pense que vous avez raison dans l'itération avec les utilisateurs et l'utilisation d'un prototype HTML/JS rapide pour changer les choses en fonction des commentaires. C'est génial. Mais je suis sûr que vous vous heurtez également à des problèmes de productivité, comme comment obtenir rapidement et facilement votre prototype mis à jour devant le groupe de test.
Nous étions confrontés aux mêmes problèmes, nous avons donc développé un outil pour le résoudre. Au lieu de travailler localement puis de valider des choses dans un référentiel Git ou quelque chose et de devoir le publier quelque part, notre outil est basé sur le Web et contient un éditeur HTML/CSS/JS dans le navigateur. En conséquence, nous travaillons maintenant à partir de là et tout ce que nous enregistrons est en direct instantanément.
Cela a été vraiment significatif en termes de la façon dont cela a changé notre approche du prototypage. Maintenant, nous pouvons parler à un client au téléphone, changer quelque chose, appuyer sur Enregistrer et lui demander de rafraîchir son navigateur pour voir ce qui s'est passé. Et nous pouvons regrouper les tests d'utilisabilité en quelques heures sur plusieurs itérations plutôt que d'avoir à inviter des participants sur plusieurs jours. C'est un énorme gain d'efficacité.
Je me rends compte que cela semble très produit mais je crois vraiment que lorsque vous faites du prototypage HTML, notre approche est la voie à suivre. Cela s'appelle Artisanat . Dites-moi si cela marche pour vous.
Cela ressemble à beaucoup de travail pour l'étape où vous en êtes. Je serais enclin à le reprendre sur papier et crayon pour le wireframing et le prototypage des différentes interactions et workflows.
Je simulerais ensuite quelque chose dans balsamiq ou inkscape (mes outils préférés) et enchaînerais une interaction de base en utilisant des pages html dans un navigateur avec des images de taille d'écran et des cartes d'images pour faire des boutons, etc., cliquables. Je trouve que c'est un processus rapide et flexible que je peux faire aussi basse ou haute fidélité que j'ai besoin.
Il se trouve que c'est une méthode qui fonctionne pour moi et que j'ai trouvé que les clients aiment vraiment. Vous trouverez probablement que beaucoup de gens ont leurs propres méthodes qui fonctionnent pour eux.
C'est sans doute la meilleure façon de réaliser un prototypage rapide. Les prototypes à base de papier sont bons pour évaluer la taxonomie et aussi pour évaluer si les consommateurs comprendront ce que le produit est censé faire et comment il pourrait fonctionner. Le prototypage fonctionnel vous oblige à vraiment réfléchir aux détails d'exécution et vous permet d'affiner les chemins de l'expérience.
Les seuls inconvénients de cette approche sont a) il peut être coûteux et long de faire des révisions et b) vous pouvez être enfermé dans une conception d'interface utilisateur qui est essentiellement motivée par la technologie par rapport à un concepteur.
J'ai récemment lu un article intéressant qui passait en revue certaines applications de prototypage populaires dont les niveaux de fidélité différaient. Les commentaires des utilisateurs ont également soulevé de bonnes suggestions, telles que iRise, Keynote, Archetype, Fireworks, etc.
http://id8.com/2011/08/15/comparing-digital-prototyping-tools/
Essayez d'utiliser PowerPoint ou tout autre outil de présentation prenant en charge les hyperliens. Pour le prototypage interactif et l'animation, mon point de vue est sur MS Expression Blend ou Flash.