Mobile Design (Live Virtual Class)

Chefs de projets, Concepteurs, Consultants, Web Designers

Mobile Design: Design d’interfaces et ergonomie tactile

Introduction sur le Design d’interfaces et sur l’ergonomie tactile

• Qu’est-ce que le Design d’interfaces?
• Définition et buts de l’Ergonomie, l’IHM (Interaction Homme-Machine)
• Analyse des différentes actions sur les interfaces tactiles

L’interactivité, qu’est-ce que c’est?

• Définition et objectifs de l’interactivité
• Comment être interactif sur les supports mobiles grâce au design?

Panoramas des différentes plateformes, les différents contextes d’usages

• Design d’interfaces logicielles
• Design d’interfaces web responsive
• Design d’interfaces mobiles
• Autres plateformes (bornes, TV, terminaux alternatifs, etc.)
• Les objets connectés

Quelles sont les différentes fonctionnalités, les nouveaux usages et les technologies de demain?

• Les fonctionnalités récentes
• Les nouveaux usages
• Quelles seront les technologies de demain?
• Pourquoi et comment utiliser les nouvelles fonctionnalités dans son application mobile?
• Atelier 1: imaginez un concept d’application avec une technologie innovante (du futur)

Le Design mobile

• Quels sont les différents types de design d’une application (informatif, social, utilitaire…)?
• Les avantages et les inconvénients d’une Mobile web app et d’une Native app
• Atelier 2: analyse d’une application dans les médias – comment passer avec succès à l’interactivité,l’importance de la théâtralisation, les services supplémentaires, répartition de l’information
• Étude de cas: les stagiaires échangent avec le formateur sur la présentation de projets et analysent ensemble les axes d’amélioration.

Respecter les différentes règles d’ergonomie dans le design mobile

• Les principales plateformes mobiles et leurs particularités
• Étude de cas des différentes Guidelines fabricants/éditeurs (GUI)
• Les particularités ergonomiques de chaque OS (Material Design, Windows Phone et iOS 8)
• Les bonnes pratiques, ce qu’il ne faut pas faire et pourquoi?
• Les Design patterns mobiles
• QCM de connaissance sur les Guidelines User Interface (GUI)
• 20 tendances Ergonomiques et Design
• Atelier 3: Étude de cas sur une application mobile et d’une application tablette

Adapter le design aux caractéristiques d’identité de la marque

• Repartir des objectifs de la marque et respecter la cohérence inter support: charte graphique, image demarque…
• Les étapes de création d’un concept
• L’ergonomie et l’application et les enjeux sectoriels
• Pour Qui? Pourquoi? Comment?
• Cas pratique avec une analyse sur la marque OASIS

Identifier et collaborer avec les interlocuteurs impliqués dans le projet

• Les interlocuteurs impliqués dans le projet: client, commercial, chef de projet, Directeur Artistique,développeur
• Le rôle et l’implication du designer mobile dans le projet

Dossier de spécifications: suivre les étapes du dossier de spécifications pour respecter les attentes clients et l’aspect créatif

• Cahier des charges: contexte du projet, documents applicables et de références
• Storyboard, wireframes, ergonomie
• Design, phase technique, étapes du développement, arborescence de l’application, fonctionnalité:Nombre de jours dédiés à chaque intervenant

Les étapes de la phase de modélisation sur mobile et tablette

• Le briefing
• La réflexion sur la corrélation de interactivité avec la marque/ le produit
• Exemples d’utilisation des wireframes pour les supports mobiles
• Réaliser les maquettes: étapes clés et écueils
• Les spécificités de la création sur mobile et tablette

Mener la phase des tests utilisateurs

• Les enjeux pour chaque phase (vitesse d’exécution…)
• Les rectifications
• Atelier 4: échange avec les stagiaires sur le développement d’une application mobile d’une formation-learning sur les aspects suivants: story board, fonctionnalités, ergonomie, design (travail en groupe)

Qu’est-ce qu’une application réussie? Étude de cas avec Instagram

• Pourquoi une application plait-elle?
• Analyse du rapport technologie/fonctionnalité utilisateur
• Pourquoi a t-elle été rachetée par Facebook?
• Comment l’ergonomie et le design intervient dans le succès de l’application?
• Qu’est-ce qui nous incite à y revenir régulièrement?
• Pour résumer, une application réussie…c’est quoi?
• Les 10 règles d’or à retenir
• Quels sont les points à vérifier avant de débuter un projet?
• Jusqu’où peut-on aller dans son Design pour un dispositif mobile?

Être force de proposition dans la "vente" de son concept

• La phase d’écoute et d’analyse des besoins de son client
• Valoriser les spécificités des fonctionnalités et du concept
• Les points de tension

Responsive Design

• Définition et et principes de conception pour le Responsive Web Design
• Qu’est-ce que l’expérience utilisateur?
• Un design permettant d’impliquer l’utilisateur, d’interagir sur le mobile
• Grille flexible (mise en page, typographie, points de rupture, designer avec les media queries)
• Avantages et inconvénients du Responsive Web Design? Les incidences sur le Design?

Conclusion

• Exemples et analyses de différents sites en Responsive Web Design
• Atelier 5: Conception/Ergonomie d’une application mobile ou Conception d’un site en Responsive WebDesign

Une attestation de participation sera transmise aux participants