Introduction aux Outils de Conception : Zoning, Wireframe et Storyboard

Outils de conception
Vidéo non disponible ! Réessayez plus tard
Cette vidéo fait partie de la formation
Apprendre l'UX Design
Revoir le teaser Je m'abonne
5,0
Transcription

59,90€ Je commande

À partir de
27€ /mois
Je m'abonne à Elephorm

Description Programme Avis
5,0
59,90€ Je commande

À partir de
27€ /mois
Je m'abonne à Elephorm

Les objectifs de cette vidéo sont :
- Comprendre la différence entre un zoning et un wireframe.
- Reconnaître l'importance des croquis à main levée dans la phase de conception.
- Découvrir les outils adaptés pour la création de storyboards d'interface.

Apprenez les distinctions essentielles entre zoning et wireframe, et découvrez l'importance des storyboards en conception.

Dans cette leçon, nous commencerons par revoir les outils de conception tels que les croquis et le zoning. Nous mettrons ensuite en évidence la différence entre un zoning et un wireframe, en soulignant que le wireframe est plus précis.
Nous approfondirons l'importance du dessin à main levée avec des marqueurs, qui permet d'explorer rapidement différentes options de conception, augmentant ainsi la qualité du produit final. Par exemple, il est possible de tester diverses organisations d'onglets ou de navigations.
Nous examinerons les logiciels couramment utilisés pour créer des storyboards, avec une comparaison entre Powerpoint, Keynote et des outils spécifiques comme Axure, Balsamiq, et OmniGraph. Axure, en particulier, sera décrit comme l'outil de référence pour les wireframes et les storyboards interactifs, permettant ainsi des tests utilisateur poussés.

Voir plus
Questions réponses
Quelle est la différence principale entre un zoning et un wireframe ?
Un zoning est un croquis grossier qui aide à visualiser la disposition des éléments majeurs, alors qu'un wireframe est plus détaillé et précise les fonctionnalités des éléments sur la page.
Pourquoi privilégie-t-on l'utilisation de croquis à main levée avec des marqueurs ?
Les croquis à main levée permettent une itération rapide et l'exploration de multiples options de conception en un temps réduit, améliorant ainsi la qualité du travail final.
Quels avantages présentent les logiciels comme Axure pour un designer UX ?
Axure permet de créer des wireframes interactifs et de gérer des masters de navigation, facilitant les modifications globales et les tests utilisateurs.
Alors, on va commencer par quelques rappels sur les outils de conception. On a parlé donc de croquis, de zoning. Vous voyez maintenant bien la différence entre un zoning et un wireframe. Le wireframe est plus précis que le zoning. Et maintenant, on va parler donc des storyboards. Alors, pourquoi dessiner ? Eh bien, on voit très bien que les croquis au marqueur, on est capable d'en faire 20 en une heure. Les wireframes, que ce soit avec Powerpoint ou Axure ou un autre outil, on peut en faire au maximum 1 à 2 par heure. Le design, dans Photoshop, quant à lui, peut prendre plusieurs jours. L'idée, c'est donc que plus on va passer de temps dans l'étape au marqueur, plus on va pouvoir essayer différentes options de conception. Par exemple, les onglets au-dessus, ou bien une navigation sur le côté, ou bien des onglets en dessous. Donc, plus on va passer de temps à cette étape, plus on va augmenter mécaniquement la qualité du travail fourni. Pour la réalisation des storyboards, on peut utiliser plusieurs logiciels. Les logiciels les plus faciles d'accès sont Powerpoint et Keynote, dans la mesure où c'est des logiciels qui sont installés sur la plupart des machines, qui sont des logiciels de présentation, mais qui peuvent servir pour faire les storyboards d'interface. L'avantage, c'est que les autres membres de l'équipe auront ces logiciels aussi, et donc pourront faire des modifications. L'inconvénient, c'est que ce ne sont pas des outils qui sont dédiés à la conception d'expérience utilisateur, contrairement aux autres qu'on va voir juste après. Donc, Axure, c'est le logiciel de référence en ce moment. C'est un logiciel qui est extrêmement puissant, qui permet de gérer des masters, c'est-à-dire, par exemple, de faire la navigation à un endroit, de l'appliquer sur toutes les pages, et de la modifier à un seul endroit, et les modifications seront appliquées partout. C'est un logiciel qui permet de réaliser des wireframes interactifs, ou en fait des storyboards interactifs, pour pouvoir réaliser du test. Bref, c'est vraiment un logiciel qui est pensé pour le métier du X-Designer. Dans le même registre, il existe beaucoup d'autres logiciels, notamment Balsamiq, et puis un autre qu'on doit mentionner, c'est OmniGraph, qui permet de faire du storyboard d'interface, mais aussi qui est très bon sur les arborescences et les parcours utilisateurs, tout ce qui est schématique, représentation, diagramme, etc.

Programme détaillé de la formation

5 commentaires
5,0
5 votes
5
4
3
2
1
elephorm-1351405@addviseo.com
Il y a 9 months
Commentaire
Je suis en train de me reconvertir dans les métiers de l'UI/UX design. Cette formation va à l'essentiel, évite tous les superflus barbants ! C'est une bonne introduction et ça me donne envie d'en savoir plus !
pioupiou06
Il y a 2 years
Commentaire
Très intéressant et très bien expliqué.
bertrand.deloffre
Il y a 2 years
Commentaire
Très bonne formation pour débuter dans l'UX.
contact_2672
Il y a 3 years
Commentaire
Un terme qui me paraissait totalement barbare mais on ne peut plus familier maintenant. Merci
paul_25
Il y a 3 years
Commentaire
Très bonne introduction synthétique à l'UX Design.
Nos dernières formations WebDesign UX / UI