Brouillionnage d'interfaces

Ce weekend, c'était SudWeb 2014 à Toulouse. Je ne vais pas faire un résumé des excellentes conférences de vendredi, non seulement parce que je n'en serais pas capable, mais parce qu'elles seront intégralement disponibles en vidéo d'ici peu. Cependant, j'aimerais vous résumer le workshop de samedi matin auquel nous a fait participer Alvin Berthelot. Son objectif était de nous sensibiliser à l'importance de faire des croquis d'interfaces collaboratif préliminaires. Et il nous a convaincu.

Participants

Tout d'abord, il vous faudra constituer une petite équipe de 3 à 6 personnes. Ces personnes doivent venir de corps de métiers différents, n'hésitez pas à faire participer la secrétaire ou le commercial. Chaque étape doit être timeboxée pour permettre à l'équipe de se concentrer sur l'essentiel. Je vais indiquer le temps que nous a imposé Alvin pour ce workshop, mais il est permis de le modifier selon les contextes.

Réflexion individuelle

Après que chaque participant aura pris connaissance des contraintes demandée par le client, il devra, individuellement, dessiner l'interface qu'il pense correspondre à la demande sur son calepin. On peut utiliser plusieurs feuilles, dessiner plusieurs écrans, utiliser du crayon, du feutre, tout ce qu'on veut.
On fera ce travail pendant 5 minutes.

Ensuite, chacun, à tour de rôle, présentera sa proposition en l'expliquant aux autres en deux minutes maximum.

Itérations collaborative

On passe maintenant au travail collaboratif. On remplace les calepins par une grande feuille de papier posée sur la table. Et on dessine tous ensemble une interface reprenant les meilleures idées de chacun en argumentant ses choix. Prend le crayon ou la gomme qui veut. Essayez de rester courtois et de respecter les idées des autres.
10 minutes seront un minimum pour cette première itération.

On réitère ce dessin de groupe une ou deux fois, puis, quand on est fin prêt, on peut passer à la dernière étape : le pitch produit.

Le pitch

On peut maintenant présenter l'interface au client ou au chef de service qui sera content et qui pourra donc se servir de ce travail pour réaliser des specs ou des users stories. S'il n'est pas content, on peut repartir sur de nouvelles itérations ou constituer un nouveau groupe qui aura probablement des idées différentes.

Notre exercice consistait à réaliser une appli mobile destinée aux commerciaux d'une entreprise pour les aider à enregistrer leurs notes de frais. Avec mes 5 camarades, nous avons réalisé ceci :

Sketch

Au passage, un grand bravo à toute la thym qui nous a organisé un évènement de très grande qualité même si je pense que le fait qu'il eut été localisé à Toulouse a beaucoup joué :x

Bonus : Quelques photos en vrac de SudWeb.

Bonus 2 : Vous pouvez retrouver les slides d'Alvin pour introduire l'atelier.

Hadrien

Hi, I'm a french Javascript Lead Developer, Web Architect from Toulouse, France. I've worked for 12 years for many projects with YUI, AngularJS, Aurelia.io and now React and React native.

Toulouse, France https://hadrien.eu