TP 1
Quelle est la différence entre le Zoning,
Wireframe, Mockup et Prototype ?
Qu’est-ce que le Zoning ?
Le zoning est une schématisation grossière de ce que sera la future
page web. On utilise des blocs pour déterminer où se trouveront les
contenus et fonctionnalités. Définir l’organisation générale des pages
est l’occasion de présenter une première approche au client ou
décisionnaire. Celui-ci pourra alors valider ou réajuster les grands axes
avant la réalisation des wireframes.
Zoning
Les grandes zones de contenus et autres éléments doivent être
cohérents sur la page. Il n’est pas rare que les souhaits initiaux soient
inadaptés, par exemple une page d’accueil surchargée d’informations.
C’est lors du zoning qu’est effectué ce premier débroussaillage.
Qu’est-ce qu’un Wireframe ?
Le wireframe est la suite logique du zoning. Chaque bloc réalisé lors de
l’étape précédente se voit doté d’image(s), de texte(s) ou de vidéo(s).
Ce contenu peut être fictif car les informations finales ne sont pas
toujours connues à ce stade du projet. L’objectif est de définir
l’organisation des éléments et des formes sans travailler l’aspect visuel,
le graphisme n’interviendra que plus tard.
Wireframe
Là encore, un échange avec le client est nécessaire pour valider les
avancées. Le wireframe, en bon outil de communication, l’aide à se
projeter. Il évite surtout la rédaction d’un cahier des charges
fonctionnel où les besoins peuvent être incomplets ou mal définis, ce
qui entrainerait une refonte coûteuse de la plateforme finale. Les
wireframes jouent le même rôle en présentant chaque fonctionnalité et
spécification associée.
Qu’est-ce qu’un Mockup ?
Un mockup est une image d’interface qui a été transformée en page
HTML dynamique et navigable. Ce nouveau format autorise l’insertion
de liens vers des pages notamment. Il permet aussi de rendre un
formulaire fonctionnel afin d’effectuer des simulations. Grâce à
l’intégration des exigences techniques, les messages de confirmation
ou d’erreur apparaissent. Autant d’actions, qui, même si elles restent
sommaires, sont utiles au client pour se projeter davantage.
Réaliser des mockups via l’outil Balsamiq
https://youtu.be/70hfU7_95Gw
Vous avez besoin de faire valider l’apparence graphique d’un site ou
d’une appli ? Découvrez un outil dédié efficace et facile à utiliser pour
réaliser votre zoning, wireframe, mockup et prototype. Moqups est
composé d’une bibliothèque d’éléments et d’icônes. Un mode
“Preview” est également disponible pour naviguer à travers vos pages
• https://www.youtube.com/watch?v=ZiQb0tvytNY
Qu’est-ce qu’un Prototype ?
Un prototype vient valider les technologies en rendant les interfaces
fonctionnelles, tout est testé pour détecter d’éventuels problèmes. Le
but n’est pas d’inciter le testeur à acheter le produit, il doit seulement
le rendre meilleur. Un prototype permet également d’aller démarcher
d’éventuels investisseurs.
https://www.youtube.com/watch?v=jQAMA49TLBA
