9 juillet 2010

UX, Beers and… Prototyping (yeah!)


Nous avons eu le plaisir d’accueillir chez PIA (autour d’une bière bien fraîche, comme le titre l’indique :) ), l’UX Book Club, le mercredi 7 juillet. Pour ce troisième épisode, l’ouvrage sélectionné par le groupe était Prototyping de Todd Zaki Warfel disponible chez Rosenfeld Media.



Les outils de prototypage des participants

Nous avons débuté notre séance par un rapide tour de table qui a permis de savoir ce que chacun utilise comme outil de maquettage et de prototypage. Le graphique ci-dessous compare les résultats de ce tour de table par rapport au sondage effectué par Todd en 2008.

Outils de prototypage des participants Vs sondage de Todd Zaki Warfel réalisé en 2008

Le papier fait un carton plein. Tandis que la côte de Visio a chuté terriblement ! Deux autres outils font leur apparition : Balsamiq et Flair Builder. Photoshop est également particulièrement utilisé par les membres du Book Club. Les DA (Directeurs Artistiques) seraient-ils sur-représentés ?

Exemple de wireframe avec Balsamiq

Il est assez frappant de voir que les nouveaux outils proposés par Microsoft et Adobe, respectivement Blend et Flash Catalyst, n’ont pour l’instant qu’une pénétration de marché assez marginale.

Sylvie nous a permis de clore le débat autour de l’outillage en rappelant le “moto” sur la question : chacun prototype avec l’outil qu’il maîtrise le mieux de sorte à être le plus réactif possible, et donner la meilleure impression possible aux utilisateurs ou aux clients de la future ergonomie / design.


Le papier, un média incontournable parfois difficile à dompter

Même si le papier permet de libérer au maximum sa créativité, c’est un média parfois complexe à dompter. Hervé nous a, ainsi, rapporté les difficultés liés à la réalisation d’un prototype papier / carton d’un iPad chez Daily Motion.


Maurice nous a rappelé l’exemple donné par Todd pour réaliser des animations grâce à un fil dentaire… Bref le papier est parfois difficile à dompter. Et il pourra être plus difficile dans certains cas de mettre à jour le prototype papier qu’une version électronique.



Le protytapage Html / Css

De nombreux participants du Book Club utilisent directement Html et CSS pour réaliser leurs prototypes. Ils considèrent, comme Todd dans son ouvrage, que dans bien des cas ça n’est pas si difficile que ça. Le prototype html permet, en outre, de rendre parfaitement compte de certains effets complexes qui sont quasiment impossible à simuler en utilisant d’autres outils. Pour réaliser leurs prototypes html, les partipants utilisent majoritairement CSS Edit.


Si Html / Css permettent d’aboutir à de très bons rendus, ce type de prototype peut parfois soulever des problèmes de “compréhension”, comme l’a relevé Maurice. Au vu d’un prototype Html, les décideurs considèrent parfois qu’il n’y a plus rien à faire pour réaliser la mise en production ou en ligne.


Le processus d’élaboration du prototype

Nous nous sommes ensuite concentrés non plus sur les outils mais sur le processus d’élaboration du prototype ou de la maquette.

Thibault a tout d’abord souligné l’importance de bien avoir défini d’une part les objectifs du projet mais également ceux du prototype. Puis les participants ont débattu de l’articulation entre le travail des responsables UX (ergonomie, utilisabilité) et celui des DA. Cette articulation est parfois complexe et se fait dans certains cas au détriment des DA. Les responsables de l’UX fournissent, en effet, des maquettes ou des prototypes si bien calibrés, calculés au pixel près, que le DA ne peut plus exercer sa créativité.

Un wireframe particulièrement élaboré sur le blog de Cultured Code

Nous (Yoan, Philippe et moi-même) en avons donc profité pour promouvoir auprès des autres participants une pratique que nous utilisons le plus souvent possible chez PIA : la Design Party. Elle vise à réunir Ergonome, DA et développeurs dans la même pièce afin qu’ils élaborent ensemble les grandes lignes du futur produit. La Design Party permet à tous les participants de partager une vision commune du système. Elle donne un espace à chacun pour contribuer à la conception sur son domaine de compétence. Le développeur peut ainsi, par exemple, mettre en avant les risques techniques d’un design.

Toujours au chapitre du processus d’élaboration du prototype, Jérémie et Thibault ont souligné l’importance de travailler de manière itérative et incrémentielle. L’UX n’est pas une science exacte. Il est donc primordial de réaliser des tests fréquents pour mesurer l’impact des évolutions.


Conclusion

Merci à tous d’avoir participé à cet UX Book Club. Cela a été un plaisir de partager ce moment de convivialité avec vous. Vous êtes toujours les bienvenus chez PIA.
Rendez-vous le mercredi 6 octobre pour le prochain Book Club.

Sur le même sujet :

Retrouver les membres de ce Book Club sur Twitter :

(Clément, Thibault je n’ai pas trouvé votre compte, désolé)


  • Twitter
  • LinkedIn
  • viadeo FR
  • Facebook
  • Google Buzz
  • Netvibes
  • Tumblr
  • del.icio.us
  • Digg


2 commentaires

Ajouter votre commentaire
  1. Quelques liens à découvrir au calme. | iErgo, le bloc-notes | Ergonomie & IHM
    [...] blog de PIA : Une trés bonne revue de presse et en plus quand on va chez eux pour UX book club, ils savent [...]
  2. Mercredi prochain UX BOOK PARIS : Undercover User Experience | Kévin André
    [...] Article debriefing sur le site de People In Action [...]