Définir des maquettes d’IHM permet d’impliquer utilisateurs et développeurs en amont de la réalisation, pour bien valider l’ergonomie d’un site grand public ou d’une application métier. Ce stage vous montrera comment bien utiliser les outils de maquettage et en particulier Axure pour la réussite d’une telle démarche.
Description
Durée : 28 heures
Modalités techniques d’évaluation : Évaluation des connaissances par QCM, évaluation des compétences au travers de travaux pratiques et de cas d’études. Contrôle de l’acquisition des connaissances et des compétences pendant la formation par le formateur.
Moyens pédagogiques : Apports théoriques réalisés en classe et complétés par de nombreux travaux pratiques permettent aux participants de disposer d’une expérience concrète. A l’issue des sessions magistrales, réalisation de cas d’études tutorés.
Objectifs pédagogiques
À l’issue de la formation, le participant sera en mesure de :
- Se familiariser avec les concepts de zoning, architecture de l’information, navigation
- Créer des maquettes statiques et dynamiques avec Axure
- Intégrer les principes de bases de la rédaction de spécifications d’IHM
Travaux pratiques
Introduction
- Pourquoi faire une maquette IHM ?
- Coûts et bénéfices.
- Quand faire une maquette IHM ?
- Les principes de « design centré utilisateur » : rappels.
- Utiliser une maquette pour des tests utilisateurs : l’approche AgileUX.
- Exemples de projets.
Les outils existants : panorama (Balsamiq, Visio, Axure, InVision…)
- Le maquettage vertical et le maquettage horizontal.
- Basse, moyenne et haute fidélité des maquettes.
- Différence entre maquettes et prototypes.
- Les outils du marché, gratuits et payants : avantages et inconvénients. Quel choix faire ?
Démonstration
Exemples de réalisations mises en œuvre avec différents outils.
Structurer les contenus
- Concevoir la structure du produit et l’architecture de l’information.
- Les flux de navigation.
- Valider une structure de contenus avec les utilisateurs finaux : le tri de cartes.
- Outils de mind mapping : XMind et les autres.
Exercice
Utilisation de XMind, outil de mind mapping, pour structurer les éléments de l’interface.
Créer une interface avec Axure : des bases aux comportements dynamiques
- Axure RP Pro : un outil puissant et complet.
- Créer des pages statiques. Widgets, masters, liens.
- Importer des bibliothèques (icônes, polices…) et gérer le style des pages.
- Widgets et masters.
- Créer des interfaces Responsive pour tablettes et smartphones.
- Créer des interactions.
- Les comportements dynamiques (panels dynamiques, événements, variables).
Exercice
Mise en œuvre de maquettes variées avec Axure.
Ecrire des spécifications d’interface homme-machine
- Pourquoi écrire des spécifications IHM ? Temps nécessaire et bénéfices.
- Générer des spécifications IHM avec Axure : un document exploitable ?
- Bonnes pratiques dans Axure afin d’optimiser les spécifications générées par l’outil.
- Charte ergonomique et charte graphique : complémentarités et différences.
- Exemples de réalisations.
Exercice
Exporter et compléter des spécifications IHM.
