Les prototypes en fil de fer - outils de communication et de réflexion
Par Marc Poulin, le 16 novembre 2009
Votre organisation désire une refonte de son site web. Un comité a été formé et est constitué des secteurs clés dont le marketing et les communications. Même le gars des TI est invité. Tous ont fait leurs devoirs. Ils ont même répondu à tous les points mentionnés dans le billet de Seth Godin: “Things To Ask Before You Redo Your Website“. Pour la version française de cette liste, voir “Quelles questions se poser avant de refaire son site” sur le blogue de Samuel Parent.
Supposons un instant que le comité de refonte de votre site web produise un rapport sur ses besoins web et que ce document soit distribué à 10 agences web pour obtenir des propositions. Voici mes prédictions:
- Les 10 coûts proposés vont varier du simple au double et peut-être même plus. Ces différences ne seront pas dues à des variations de taux horaire mais plutôt à des interprétations différentes de vos besoins et de vos attentes.
- Peu importe qui sera choisi, ça va coûter plus cher que prévu. En effet, le comité va réaliser, en cours de développement, que certains éléments importants n’étaient pas suffisamment explicites dans leur cahier des charges. Ils vont donc devoir payer des suppléments pour les fameuses demandes de changement.
- Les membres du comité avaient chacun une idée différente de ce que serait le site, même s’ils ont écrit conjointement le rapport des besoins.
- Le site qui sera mis en place ne correspondra pas à ce que les membres du comité avaient imaginé.
Comment mettre les chances de son côté
Au printemps 2009, Paulina Podgorska a décelé une opportunité d’affaires. Suite à ses propres difficultés à trouver une gardienne pour son enfant, elle a décidé de créer un nouveau site web qui faciliterait la rencontre entre gardiennes d’enfant et familles. Ce site s’appellerait www.sosgarde.ca.
Je ne sais pas si elle a lu l’article de Seth Godin mais elle prépara un document de six pages contenant l’essence de son futur site. Ayant déjà travaillé chez Nurun et BBDO, Paulina connaissait bien le web. Cependant, son expérience lui disait qu’elle ne pouvait pas donner ce document tel quel à des développeurs.
Elle parla de son projet à Martin Lessard (Zero Seconde) qui, trop affairé, lui suggéra mon nom. Je lui ai alors proposé de préparer un prototype en fil de fer (wireframe) qui servirait de support à nos discussions sur la conception de son site. C’est ce que nous avons fait et l’expression de ses besoins est passée de 6 pages de textes à un prototype fonctionnel de plus de 70 pages qu’elle pouvait donner aux infographistes et programmeurs à titre de spécifications.
Qu’est ce qu’un prototype en fil de fer (wireframe)?
Un prototype en fil de fer est la représentation visuelle minimaliste d’une solution potentielle aux besoins d’un site web en termes de contenu, de navigation et de fonctionnalités.
Le qualificatif “fil de fer” est dû à l’absence d’éléments graphiques. C’est dans sa nature d’être laid. Ceci permet de se concentrer sur ce qui fera partie du site, sur ce qui sera mis en évidence et sur ce qui sera exclus.
Voici un exemple fictif de prototype en fil de fer:
Il faut distinguer les prototypes des maquettes. Une maquette sert à présenter les éléments visuels qui habillent le site. C’est un livrable très important qui se fait une fois que le prototype est complété et approuvé. N.B. Mon point de vue sur les maquettes est élaboré dans mon billet ” Les maquettes Photoshop dans les propositions de site web“ .
Le prototype en fil de fer: outil de communication
Un prototype est d’abord et avant tout un outil de communication entre le propriétaire du site et l’architecte concepteur du site. Il permet:
- de valider la compréhension des besoins;
- de présenter des solutions potentielles aux besoins du site web (contenu, navigation et fonctionnalités);
- d’expérimenter la navigation du site;
- de documenter, partager et approuver les spécifications du site.
Le prototype en fil de fer: outil de réflexion
Il n’est pas facile d’imaginer ce que sera un site web à partir du rapport des besoins. Le prototype permet à tous les membres de l’organisation de visualiser le futur site et de l’expérimenter. Mieux encore, comme il est évolutif de par sa nature, le prototype s’améliore des fruits de la réflexion. Typiquement, je vais enrichir un prototype plusieurs fois par jour:
- pour incorporer le feedback de mon client;
- pour introduire une amélioration suite à ma propre réflexion;
- pour expérimenter un concept;
- pour développer une nouvelle section.
Avantages d’avoir un prototype fonctionnel en fil de fer
Pour la phase de conception de la solution, les avantages sont:
- L’accès facile à la conception permet à tous ceux impliqués dans le projet de partager la même vision de la solution;
- Des tests utilisateurs peuvent être faits pour valider la solution;
- On peut expérimenter à faibles coûts diverses solutions et ne retenir que celles qui sont les plus rentables;
- Comme le processus itératif du prototype facilite la réflexion et la validation, la solution éventuellement mise en place rencontrera mieux les besoins exprimés initialement.
- Pour des raisons de budget ou d’échéancier, on pourrait vouloir découper la réalisation du site en plusieurs phases. Le prototype facilitera le découpage car on connaîtra d’avance l’ensemble de la solution;
Conclusion
Pour éviter les incertitudes de résultats et de coûts, comme dans le cas du comité dans la première section de ce billet, un prototype fonctionnel en fil de fer est un outil formidable. De plus, si vous désirez ensuite aller en appel d’offres, la plus grande clarté dans ce qui est demandé va vous permettre de comparer plus facilement les propositions reçues.
Pour en savoir plus sur les prototypes en fil de fer, lire le billet “Using Wireframes to Bring Your Site Together” de DesignReviver. Pour un schéma très clair sur la place de l’analyse et du visuel dans la démarche de création d’un site web, voir ce document PDF d’une seule page de Jesse James Garrett intitulé “The Elements of User Experience” . Merci à Sandrine Prom Tep pour m’avoir fait découvrir ce bijou.
Collaboration spéciale : Marc Poulin est architecte et concepteur de sites web rentables. Il développe des prototypes en fil de fer depuis plusieurs années. Pour en savoir plus sur lui, consultez son site web à www.tango.qc.ca.
Sujet : Commerce électronique, Contenu, Ergonomie et utilisabilité, Méthode de travail, Relation agence-client, Stratégie |
Une réponse à “Les prototypes en fil de fer - outils de communication et de réflexion”
Commentaire
« Changements technologiques et résistance : myopie ou déni ? | Accueil | La maquette, un élément très peu important dans la conception web. »
Le 16 novembre 2009 à 20 h 23 min
Très intéressant comme billet Marc. Ta section sur les avantages est sûrement ma préféré.