Fil d'Ariane
Mis à jour le mercredi 19 juillet 2017
  • 8 heures
  • Moyenne

Ce cours est visible gratuitement en ligne.

Ce cours est en vidéo.

Vous pouvez obtenir un certificat de réussite à l'issue de ce cours.

J'ai tout compris !

Créez pour l'utilisateur mobile

Connectez-vous ou inscrivez-vous pour bénéficier de toutes les fonctionnalités de ce cours !

Dans le chapitre précédent, vous avez vu comment se centrer autour de l'utilisateur. Nous allons voir maintenant comment prendre le mobile en considération.

En France, la publicité nous incite à utiliser le mot "mobile" pour parler du téléphone portable. Or le mobile désigne plus largement ce qui est portable, ce que l'on emmène avec nous.

Sachez que c’est surtout l’utilisateur qui est mobile

Avant de concevoir un produit, vous devez comprendre une chose : votre utilisateur est avant tout mobile.

Qu'est-ce que ça veut dire ? C'est l'utilisateur qui est mobile, et non son téléphone ?

En clair, lorsque l'on parle du "mobile", cela ne désigne pas seulement le fait que les utilisateurs utilisent des appareils qui sont mobiles, mais c'est aussi parce que les usages et les comportements ont changé : on est dans l'ère de la mobilité, on est connecté à Internet partout…

"On ne va pas sur Internet. On est dans Internet" - Joël de Rosnay, futurologue français.

C'est donc l'utilisateur qui est mobile. Il :

  • se déplace en utilisant son smartphone : il marche, prend les transports…

  • cherche en permanence à avoir un bon réseau, et suffisamment de batterie 😪

  • communique et capture le réel en instantané : mail, messagerie, mais aussi via la photo voire la réalité augmentée

  • commence à préférer les images, émojis et autres, plutôt que le texte parce que cela va plus vite et transmet mieux une émotion ou un message

  • possède plein d’applications mobiles, pour plein de besoins différents

  • son attention est donc divisée (c'est la course pour capter son attention et parvenir à la retenir)

La version desktop de votre site web peut être très jolie et pleine d'effets graphiques mirobolants… n'empêche que votre utilisateur consultera votre site depuis son mobile dans la très grande majorité du temps. Il ne faut pas l'oublier, ni le négliger !

Intégrez l’approche du mobile-first

Il y a tellement d’utilisateurs sur mobiles (smartphones et/ou tablettes) que c'est impossible aujourd'hui pour tout designer de n'envisager que la version desktop (ordinateur) : vous devez penser "responsive".

Si vous n'intégrez pas le responsive dans votre approche, vous êtes non seulement "has been" (pas à jour) mais aussi vous aurez du mal à faire voir au monde votre site. En effet, le moteur de recherche Google "punit" les sites non "responsives", c'est-à-dire qu'il pénalise les sites non compatibles avec le mobile en termes de référencement : ils ne remontent pas dans les résultats de recherche.

Il est donc indispensable de :

  • prévoir une version mobile lorsque l'on développe un site web

  • le coder en intégrant le responsive (encore mieux)

  • commencer (que ce soit code ou maquette graphique) par la version mobile

  • appliquer les bonnes pratiques de ce que j'appellerais le "design pour le pouce" lorsque l'on développe un site web ou une application mobile.

Ce n'est pas tellement que le mobile est un problème, c'est plutôt qu'il s'agit de prendre en considération les contraintes liées au mobile d'abord pour ensuite passer à la version desktop. 

Assimilez les contraintes de l’appareil mobile

Développer pour du mobile demande d'être conscients de plusieurs contraintes dans le processus de conception :

  1. La taille de l’écran est très petite et l'utilisateur y navigue avec un doigt (souvent le pouce).

  2. Un smartphone s'utilise très souvent en marchant.

  3. Le réseau est aléatoire, parfois bon, parfois fluctuant, faible, voire inexistant…

  4. La batterie des smartphones d'aujourd'hui dure maximum une journée.

Ces quatre contraintes à elles seules permettent déjà de dégager quelques grands principes lorsque l'on doit concevoir une application mobile :

  • afficher l'essentiel du contenu, à la bonne taille et au bon endroit.

  • charger rapidement, même quand le réseau n'est pas en 4G.

  • ne pas consommer trop d'énergie et donc de batterie.

Exemple de certificat de réussite
Exemple de certificat de réussite