UX/UI, Ergonomie et Webdesign

Objectifs

• Être sensibilisé à l’ergonomie logicielle et à la prise en compte du facteur humain dans les projets informatiques
• Acquérir une méthodologie de conception centrée sur l’utilisateur final
• Comprendre les exigences ergonomiques particulières d’une application utilisée en situation de mobilité
• Disposer des bonnes pratiques pour la conception d’écrans pour smartphone ou tablette
• Connaître les pratiques pour réaliser des maquettes mobiles et conduire le cycle de maquettage d’une application compatible mobile

Programme

Introduction à l’ergonomie mobile

• Présentation de l'ergonomique logicielle : ce qu'elle est, ce qu'elle n'est pas
• Les différences entre UX et UI Design
• Les 4 éléments à aborder : l'utilisateur, les situations d'usage, l'activité, la technique
• Les différents niveaux de mobilité et les nouvelles situations d’usages associés
• Des capacités propres : capteurs, possibilité d’interagir avec les applications installées
• Techniques de saisie : clavier virtuel, assistance à la saisie
• L’interface tactile : comparaison avec la souris, multitouch, gestures et nouveaux paradigmes d’interactions
• Les questions à se poser avant de faire une application mobile et les pièges à éviter

Conception d’une IHM tactile

• Stratégie de conception : application web mobile, native ou hybride, aspects multi plates-formes
• Les composants graphiques d’une application native Android
• L’importance du maquettage dans la démarche ergonomique
• Maquettage haute et basse fidélité
• Connaître ses utilisateurs : les personas
• Approche par l'activité : définition des scénarios critiques
• Choix d’un outil de maquettage
• Conduite d’un cycle de maquettage pour une application mobile

Aspects propres à la conception des IHMs mobiles

• Principe de navigation sur une application native
• Les principaux patrons de conception sur Android
• Présentation des guidelines Android : material design
• Les différences avec les autres OS mobiles
• Problématique du responsive design
• Approche dans le cas d’une application web : les media queries, grilles de conception (ex : bootStrap)
• Approche dans le cas d’une application native : conception par layout
• Limites du responsive design : approche mobile first

Conclusion