Ce livre analyse les principes de conception graphique, ergonomique des interfaces mobiles ainsi que l'aspect technique lié à leur production, qu'il s'agisse des applications natives, web ou hybrides.

Il s'adresse particulièrement aux concepteurs, chefs de projets, responsables marketing, professionnels de toutes disciplines ayant à concevoir des services pour tablettes, smartphones ou autres accessoires connectés.

La conception d'une IHM mobile passe d'abord par une étude des usages : qu'attend-on d'une application ? Comment sera-t-elle utilisée ? Dans quels contextes ?

Une bonne approche Utilisateur - ou UX Design (User eXperience) - est essentielle pour garantir la pertinence d'une application. L'auteur analyse ainsi les fondamentaux de l'UX : scénario utilisateur, principe des écosystèmes, interactivité, psychologie de la perception, étude de la gestuelle, avant d'en déduire les conséquences sur la mise en page des interfaces mobiles.

Des études de cas permettent de contextualiser cette approche. L'auteur montre notamment à travers ces exemples détaillés, quelles stratégies sont mises en place pour répondre au mieux à la réalité du marché, aux attentes et comportements des utilisateurs.

Dans le chapitre suivant, l'approche technique permet de montrer le lien indissociable qui existe entre design et programmation. Quelles technologies pour quel type d'application ? Cette question est ici posée à travers un panorama des technologies pour les mobiles :

- Les langages machine Java, Objective-C, C#) qui permettent la programmation des applications natives.
- Les outils de productions IOS, Android et Windows 10 : IDE, SDK.
- La sphère des technologies dédiées au Web Responsive ainsi qu'aux applis web : HTML 5, CSS, JavaScript, jQuery, jQuery Mobile.
- Les outils pour la création des applications hybrides : framework Cordova, Angular, Ionic, Kendo-UI, etc...

Enfin, le livre se termine par un chapitre plus prospectif : quelles sont les technologies récentes les plus prometteuses pour l'amélioration des services numériques ? Y sont abordées entre autres les questions de la réalité virtuelle, de la réalité augmentée, de l'Internet des Objets (IOT), de l'intelligence artificielle, des assistants personnels. Autant de pistes pour tenter d'imaginer les interfaces de demain...



Quizinclus dans
la version en ligne !

• Testez vos connaissances à l'issue de chaque chapitre
• Validez vos acquis

Téléchargements

• Webographie

Introduction

1. À qui s'adresse ce livre ?
2. Pourquoi tant d’applications ?
3. Un peu d'Histoire
   1. 1. Naissance des écrans tactiles
   2. 2. Naissance des Market Stores et apparition des applicationstéléchargeables : le triomphe d’un modèle économique
   3. 3. Internet sur les mobiles et l’approche ResponsiveWeb Design
   4. 4. Responsive Web Design / Adaptative Web Design
   5. 5. Puissance de HTML 5 et naissance des applicationsweb
   6. 6. Applications natives ou applications web : une questionrécurrente (mais pour combien de temps ?)
4. Vers une expérience utilisateur unique ?

Conception graphique et fonctionnelle

1. Le rôle de l'expérience utilisateur (UX)
   1. 1. Le contexte d’utilisation des supports mobiles
      1. a. Une expérience utilisateur dégradée
      2. b. Une connexion intermittente
      3. c. La gestion multitâche (multitasking)
   2. 2. La recherche d’efficience
      1. a. De la recherche d’informations à l’utilisationdes services
      2. b. L’efficience dans le cadre des écosystèmes
      3. c. La pratique des écosystèmes
      4. d. Écosystème persistant, continu oucomplémentaire
      5. e. L’architecture des écosystèmes,une contrainte pour la définition des scénariosutilisateurs
   3. 3. UX ou UI : définitions
      1. a. UI pour User Interface
      2. b. UX pour User eXperience
   4. 4. Les 6 commandements de l’UX
      1. a. L’efficience
      2. b. La visibilité
      3. c. L’accessibilité
      4. d. L’intuitivité
      5. e. La crédibilité
      6. f. La satisfaction
2. Concevoir, imaginer l'UX
   1. 1. Audits de sites ou applications concurrentes
   2. 2. Analyse des utilisateurs
      1. a. Les focus groups
      2. b. Les personas
      3. c. Les cartes d’idéation
   3. 3. La création de documents de partage
      1. a. Les cartes heuristiques ou Mind Mapping
      2. b. Experience Maps
      3. c. Maquettes des interfaces (prototypage)
3. L'interactivité au cœur de l'UX
   1. 1. La prise en main des appareils mobiles
   2. 2. Interactivité tactile : Touch, Multi-Touchet Touch3D
      1. a. Toucher, balayage, zoom et autres gestes
      2. b. 3D Touch
      3. c. Susciter les bons gestes de la part de l’utilisateur
   3. 3. L’interactivité au-delà de l’écran
      1. a. Le vibreur
      2. b. Les capteurs de mouvement
      3. c. Interactivité par la caméra
      4. d. Interactivité sonore
   4. 4. Gestion de l’espace
      1. a. Le point focal
      2. b. Les « call to action »
      3. c. Zoning et sens de lecture
      4. d. De la page à l’écran
   5. 5. Les composants d’interface (UI Components)
      1. a. Les barres
      2. b. Les composants d’affichage : les visionneuses(views)
      3. c. Les contrôles visuels
4. Études de cas
   1. 1. Application ViteInscrit
      1. a. Les fonctionnalités de l’application
      2. b. Hébergement et architecture
      3. c. Conditions d’utilisation dégradées
      4. d. Un écosystème complémentaire
      5. e. L’interface : ergonomie et design
      6. f. Conclusion
   2. 2. Application IDEC Sport
      1. a. Les fonctionnalités de l’application
      2. b. Pourquoi un focus sur cette application ?
      3. c. Hébergement et architecture
      4. d. L’interface : ergonomie et design
      5. e. Conclusion
   3. 3. Applications Accorhotels et Accor Virtual hotels
      1. a. Les profils utilisateurs
      2. b. L’écosystème numériqueAccor : un site et des applications
      3. c. Hébergement et architecture
      4. d. L’interface
      5. e. Conclusion

Aspects techniques

1. Les applications natives
   1. 1. Architectures des applications natives
      1. a. Les langages de programmation
      2. b. Apothéose du pattern MVC
      3. c. Langages orientés objet et instanciationdes APIs du hardware
   2. 2. Les outils de production
      1. a. L’environnement de développement : les SDKiOS, Android et Windows
      2. b. L’interface pour Android
      3. c. L’interface pour iOS
      4. d. L’interface pour Windows 10
      5. e. Conclusion
2. Applications web et sites RWD (Responsive Web Design)
   1. 1. Architectures des applications Web et sites RWD
      1. a. Sites et applications web statiques ou dynamiques
      2. b. La séparation des pouvoirs
   2. 2. Langages et programmation : HTML, CSS, JavaScript
      1. a. Le DOM (Document Object Model)
      2. b. L’en-tête
      3. c. Le corps de la page
      4. d. Spécifications W3C/WHATWG pour mobiles
      5. e. Écrire les styles : syntaxe des CSS
      6. f. JavaScript
   3. 3. Adaptation à l’environnement mobile
      1. a. Côté serveur
      2. b. Côté client
   4. 4. Outils de production pour sites RWD et applicationsweb
      1. a. Les frameworks HTML 5
      2. b. Les grilles flexibles
      3. c. Bootstrap
      4. d. jQuery Mobile
      5. e. Frameworks HTML 5 et RWD plus légers
3. Applications hybrides : écrire une fois et déployer partout
   1. 1. Architecture mixte
   2. 2. Les outils de production pour projets hybrides
      1. a. Apache Cordova, le traducteur polyglotte
      2. b. Angular Mobile UI
      3. c. Ionic
      4. d. React Native
      5. e. Kendo UI Core / Kendo UI Professionnal
      6. f. Autres frameworks pour applications hybrides
4. Programmation des accessoires vestimentaires connectés

Et demain ?

1. Introduction
2. Réalité augmentée/réalité virtuelle/réalité mixte : nouveaux territoires des interfaces ?
   1. 1. Réalité virtuelle et augmentée: définition et comparaison
   2. 2. À quoi ressemblent les interfaces intégrantvirtualité et réalité augmentée ?
      1. a. Interfaces virtuelles
      2. b. La réalité augmentée
      3. c. La réalité mixte
      4. d. Quel impact les réalités virtuelleet augmentée ont-elles sur les interfaces écrans ?
      5. e. Limites, obstacles des interfaces virtuelles
3. Apport de l'Internet des Objets (IOT pour Internet Of Things)
   1. 1. Objets connectés, avez-vous donc une âme ?
   2. 2. Des capteurs de plus en plus nombreux, mais pour quelstypes d’interfaces ?
4. La révolution de l'intelligence artificielle (IA)
   1. 1. Qu’appellons-nous intelligence artificielle ?
   2. 2. Les assistants personnels : vers une dématérialisationdes interfaces ?

Annexe

1. Webographie
2. Bibliographie
   1. 1. Marketing mobile et UX mobile
   2. 2. Développement, production : lesaspects techniques des applications
      1. a. Applications natives
      2. b. Applications web et hybrides
   3. 3. Réalité virtuelle et augmentée
   4. 4. Internet des Objets - IOT
   5. 5. Intelligence Artificielle - IA