UX Design : Concevoir des interfaces ergonomiques pour tablettes et smartphones Mixte : présentiel / à distance

• Comprendre les concepts clés de l'ergonomie adaptée aux sites web via tablettes et smartphones
• Appréhender les actions des utilisateurs pour optimiser l'ergonomie (lecture ou interaction)
• Concevoir et organiser les informations pour une expérience optimale sur outil mobile
• Optimiser le parcours utilisateur, notamment en fonction de sa posture
• Améliorer l'accessibilité spécifique aux outils mobiles de consultation du site web

• Webmasters
• Webdesigners
• Chefs de projet digitaux
• Graphistes
• Concepteurs de sites web
• UX designers

• Avoir une bonne connaissance du Web
• Être à l'aise avec l'utilisation des supports mobiles (tablettes, smartphones)
• Un questionnaire de positionnement sera réalisé au préalable pour adapter la formation à vos besoins

Jour 1 :

Introduction à l'UX mobile et au responsive design

• Ergonomie et UX Design : définitions clés.
• Différences UX desktop vs
• Enjeux du tactile, responsive design et mobile-
• Introduction aux limites du site web responsive et complémentarités avec les applications mobiles. Exemple de travaux pratiques : Débat collaboratif sur des exemples d'interfaces responsive

Ergonomie des interactions mobiles

• Contraintes d'affichage, tailles d'écran, zones de confort
• Étude de cas : ergonomie de sites web responsive célèbres et d'applications
• Exemple de travaux pratiques : Analyse ergonomique d'un site web responsive existant.

Architecture de l'information mobile

• Navigation mobile : header, burger menu, bottom
• Organisation des contenus dans une logique d'usage
• Exemple de travaux pratiques : Création d'une carte du site responsive et zoning fonctionnel.

Parcours utilisateur & scénarios

• Création de personas, experience map et contexte d'utilisation.
• Analyse des besoins et motivations des utilisateurs
• Exemple de travaux pratiques : Création d'un persona & customer journey pour un site web responsive.

Jour 2 :

Introduction au wireframing mobile pour le web responsive

• Types de wireframes : low-fi, mid-fi, high-
• Bonnes pratiques et lois ergonomiques (Fitts, Hick).
• Exemple de travaux pratiques : Réalisation d'un wireframe papier pour une interface responsive.

Construction des écrans clés

• Menus mobiles, tailles de polices, zones d'interaction.
• Analyse heuristique des interfaces
• Exemple de travaux pratiques : Création de wireframes pour un parcours utilisateur complet (site responsive).

Principes UI mobiles et responsive

• Boutons, contrastes, typographie, icônes,
• Ergonomie des formulaires, call-to-action, design visuel pour consultation
• Exemple de travaux pratiques : Amélioration visuelle d'un écran responsive (ex. formulaire de contact).

Introduction à l'accessibilité mobile pour le responsive

• Bonnes pratiques : taille de texte, contrastes,
• Accessibilité spécifique aux sites web
• Exemple de travaux pratiques : Audit d'accessibilité sur les wireframes créés.

Jour 3 :

Création du prototype interactif pour un site responsive

• Liaisons entre écrans, transitions
• Création d'un mini-parcours de navigation sur
• Exemple de travaux pratiques : Construction d'un prototype interactif pour un site web responsive.

Tests utilisateurs légers

• Méthode d'observation, feedback UX
• Exemple de travaux pratiques : Test utilisateur en binôme et synthèse des retours.

Itérations & finalisation

• Analyse des retours, roadmap d'amélioration.
• Exemple de travaux pratiques : Itérations sur le prototype et finalisation.

Présentation finale et clôture

• Démo du prototype final, feedback croisé entre
• Évaluation des acquis et pistes pour aller plus
• Exemple de travaux pratique : Présentation finale et évaluation qualitative par les pairs.

• Exercices concrets
• Cas pratiques
• Quiz d'évaluation des connaissances

• Mise à disposition de postes de travail
• Vidéoprojecteur, tableau blanc, supports numériques
• Documentation pédagogique numérique

• Positionnement en amont de la formation :
• Un quiz de consolidation des pré-requis sera administré en amont de la formation
• Suivi « pendant » :
• Feuilles de présence
• Exercices pratiques
• Évaluation « fin de formation »
• Évaluation des acquis en fin de formation
• Formulaires d'évaluation de la formation
• Évaluation à froid :
• Suivi post-formation : Questionnaire de satisfaction à j+30

• Expliquer les concepts clés de l'ergonomie adaptée aux sites web via tablettes et smartphones (responsive, mobile-first, tactile)
• Analyser les actions des utilisateurs pour optimiser l'ergonomie selon le contexte (lecture, interaction, posture)
• Concevoir l'architecture de l'information pour une expérience optimale sur supports mobiles (navigation, menus, bottom bar)
• Créer des wireframes mobiles et responsive en respectant les zones de confort et lois ergonomiques (Fitts, Hick)
• Améliorer l'accessibilité spécifique aux outils mobiles (tailles tactiles, contrastes, lisibilité)
• Développer des personas et customer journey adaptés aux usages mobiles

Délais d'accès à la formation

Le délai d'accès à la formation est variable en fonction du dispositif de financement utilisé, du planning des formateurs et des contraintes du client. Pour les formations inter-entreprises, vous pouvez consulter notre calendrier en ligne ou prendre contact avec nous. Nous traitons vos demandes sous 48 heures

Accessibilité

Si vous êtes en situation de handicap, merci de nous en informer afin de vous accompagner, vous orienter, et étudier les compensations nécessaires pour répondre au mieux à votre demande de formation. Certaines formations peuvent nécessiter une adaptation pour les personnes en fonction de leur handicap. Nous restons disponibles pour échanger ensemble et nous pourrons vous orienter vers un de nos partenaires : Agefiph, Cap Emploi

Contactez-nous pour échanger sur vos besoins !

Rachel Girardeau

✉️ formation@napsia.com

📞 05 62 84 10 13