Actualités

[22/05/2017] Des Smiliens récompensés lors du Hackathon Carrefour !

Notre équipe, composée en partie de Smiliens, a remporté le Prix du Code et celui de l'Incubation lors du Hackathon Carrefour, organisé ce week-end à Paris !

[18/05/2017] OpenShift, le nouveau livre blanc Smile !

Smile publie aujourd'hui un livre blanc dédié à OpenShift, le PaaS open source orienté DevOps. A télécharger dès maintenant !

[15/05/2017] Smile décroche le label HappyAtWork 2017 !

Pour la 2ème année consécutive, Smile obtient le label HappyAtWork for Starters qui récompense les entreprises où il fait bon débuter sa carrière !

Toutes les actualités picto
       

Vous avez besoin de mettre à jour votre Lecteur Flash Flash 7

Guillemet ouvrant l'actualité des solutions
et des technologies open source Guillemet fermant
picto

Ergonomie mobile: mode portrait ou paysage ?

La phase de conception d’une application ou d’un site pour smartphone soulève souvent la question de l’orientation : « Mode portrait ou mode paysage ? ». Sans consigne de la part d’Apple ou de Google au sujet de l’ergonomie à adopter nous nous sommes bâtis notre propre opinion que nous partageons ici. Nous ne traiterons dans cet article que le cas des smartphones ou phablettes utilisés comme tels.

Chiffres et observations empiriques :

En l’absence de ressources statistiques basées sur du tracking, le site américain « UX Matters »  (www.uxmatters.com) a effectué une étude empirique basée sur l’observation d’individus dans des situations de la vie courante. Cette étude présente de nombreux biais mais elle met en lumière des comportements permettant d’éclairer la conception.

L’observation de 1333 personnes a permis d’établir différentes manières d’utiliser et de tenir son smartphone.

Dans 40% des cas observés, l’utilisateur n’interagissait pas avec son smartphone (i.e. avec son écran), 19% en avaient une utilisation passive (écoute de musique, très majoritaire ou visualisation de vidéo) et 22% l’utilisaient pour téléphoner. Ces cas ne sont pas intéressants pour orienter les choix de conception. Nous nous attarderons donc sur les 60% qui interagissaient avec leur écran.

Sur les 60% qui interagissaient avec leur écran, l’étude a d’abord établit que les utilisateurs changeaient très souvent la manière de tenir leur smartphone ; ils alternent une préhension à une main, à deux mains avec une seule main active ou encore à deux mains avec les deux pouces en action. Ainsi, plutôt que de parler de comportements uniques d’un utilisateur, il convient de parler de situation instantanée.

L’utilisation du mode paysage a quant à elle uniquement été observée dans le cas d’un usage avec les deux mains et les deux pouces en action.

Répartition des observations :

Source : UX Matters

Remarque : L’étude précise par ailleurs que l’usage du smartphone à une main était souvent accompagné d’une action de l’autre (porter un sac, se tenir dans le bus, attraper une rampe). Le biais majeur demeurant l’absence d’observation à domicile et/ou au bureau, là où le confort est optimal.

Sur cet échantillon, on serait néanmoins à une répartition 98% mode portrait et moins de 2% en mode paysage.

En complément, nous avons pris le problème dans l’autre sens et avons étudié les applications elles-mêmes. Si quasiment toutes les applications pré-installées (navigateur web, calculatrice, agenda, SMS, etc.) sur les terminaux proposent le plus souvent un fonctionnement en mode « paysage », les top 30 des applications de l’Appstore et celui de Google Play  ne présentent pas les mêmes statistiques. Environ 80% des applications du top sont uniquement en mode portrait, 10-12% uniquement en mode paysage (des jeux) et 8 – 10% offrent les deux modes (applications de lecture de vidéos, ou jeux « portrait » intégrant des cinématiques).

Analyse :

Les observations de l’étude de UX Matters sur les usages permettent de tirer d’emblée les enseignements suivants :

  • Utiliser son smartphone en mode paysage avec une seule main est quasiment impossible et n’a d’ailleurs pas été observé. A partir du moment où on a besoin de sa deuxième main pour faire autre chose, on sera en mode portrait.
  • Les utilisateurs jonglent constamment entre différentes préhensions, mais celles-ci restent à plus de 95% en mode portrait. Les utilisateurs n’ont pas de manière figée de tenir leur smartphone, ils s’adaptent au type d’usage et aux interactions attendues.

Le mode de préhension et l’orientation dépendent donc à la fois de la situation d’usage et du type d’usage !

 

A quel type d’usage sert le mode paysage ?

  • La visualisation de vidéos ou films est toujours proposée en mode paysage pour accéder à du mode plein écran.

Selon les classements de l’Appstore et de Google Play, dans la majorité des cas, une application en mode paysage est un jeu.

  • Le mode paysage est plus immersif et permet d’offrir d’avantage de contrôles directs à l’utilisateur : les deux pouces de l’utilisateur peuvent accéder en un geste à une très large zone de l’écran tout en laissant le centre visible.
  • Le navigateur Internet permet une utilisation en mode paysage, celle-ci semble particulièrement adaptée à la consultation de sites non-optimisés pour mobile… En effet, tout scroll horizontal étant à bannir sur mobile, il permet de le limiter.
  • Plus globalement, le mode paysage permet d’afficher une image ou un graphique en plein écran, ce qui rejoint assez vite l’idée que le paysage est adapté à l’utilisation passive et à l’observation.

 

A quel type d’usage ne peut pas servir le mode paysage?

  • Les normes d’accessibilité (Accessiweb) très largement admises expliquent que pour une lecture optimale sur un support digital, il faut idéalement limiter le nombre de mots à 12 par lignes ou ~80 caractères. En mode paysage on dépasse rapidement cette limite, ce qui implique d’augmenter la taille des polices, qui a pour résultat de réduire fortement l’espace utile et donc de multiplier les scrolls verticaux.

Pour l’anecdote, rappelons que la majorité des livres sont au format portrait et que les livres au format « italien » (i.e. paysage) sont généralement des livres d’images ou de photos.

  • L’usage du mode paysage à une seule main étant particulièrement difficile, celui-ci ne sera pas adapté à des besoins « urgent », « en mouvement », dans les transports. Regarder sa cartographie en marchent, taper un SMS dans le bus, ou lire un article d’actualité tout en sortant le chien ne seront possibles qu’en mode portrait, avec une seule main.

Double utilisation, en portrait et paysage :

Mis à part pour les applications pour lesquelles l’orientation d’utilisation est clairement établie, on peut aussi vouloir développer des applications fonctionnant dans les deux sens. C’est l’utilisateur qui aura alors la surprise d’avoir une application qui s’adapte lorsqu’il tournera son smartphone.

Deux approches, pour cette « adaptation » sont disponibles :

  • Approche « fluide » : comme sur la majorité des sites web mobiles, l’application étire ses cadres et zones tout en gardant les proportions des images et en maintenant la taille des polices. Les lignes de textes deviennent plus longues, les scroll plus nombreux et les images prennent souvent d’avantage d’espace ;
    • Exemple : Facebook sur Android ou Wikipedia sur iOS et Android
  • Approche « responsive » : l’application est conçue pour adapter l’organisation de ses blocs de contenus à la nouvelle orientation. La colonne unique de contenu se découpera par exemple en deux colonnes. Cette approche offre un rendu de meilleure qualité mais nécessite un travail de conception dédié et des développements supplémentaires.
    • Exemple : Le Monde sur Android, sur la vue « liste d’articles »

Dans les deux cas, les utilisateurs « fans de paysage » sont servis et les autres ne sont pas impactés. Reste à arbitrer entre le coût supplémentaire (variable selon les technologies) et la réalité du besoin.

 

Proposer des fonctions spécifiques impliquant de tourner le smartphone en mode paysage :

Dans certaines rares applications, une fonctionnalité est accessible en passant son smartphone en mode paysage. Généralement cette fonctionnalité est aussi accessible au clic, il s’agira par exemple de la lecture en plein écran d’une vidéo.

La détection de la rotation économise alors un clic par rapport à l’appui sur la fonction « plein écran ». Pour bénéficier de cette économie, l’utilisateur devra comprendre qu’il a accès à une fonction particulière en tournant son écran, ce qui ne correspond pas forcément à un usage courant.

On retrouve alors des pictogrammes du style :

ATTENTION : ce mécanisme est incompatible avec une application qui propose au choix une lecture portrait et paysage… en effet, l’utilisateur déjà en mode paysage atterrira automatiquement sur l’écran de détail sans être passé par le premier.

 

Cas particulier de l’accès uniquement disponible depuis la rotation :

Certaines applications imposent de tourner son smartphone pour accéder à une fonction ou un écran sans offrir d’alternative explicite via un lien ou un bouton.

Cet usage est à éviter. En effet les utilisateurs qui auront bloqué volontairement la détection de la rotation de leur écran n’auront pas accès du tout à la fonction. Et ces cas de blocage volontaire de la détection sont bien réels : consultation de son smartphone à plat sur une table, ou encore plus simple en étant allongé sur son canapé avec le téléviseur allumé…

Exemple : Boursorama Banque sur iOS (détail du graphique d’un indice boursier)

 

Synthèse :

L’utilisation d’un smartphone en mode paysage semble aujourd’hui assez limité et surtout réservé aux jeux et vidéos.

Exiger de l’utilisateur qu’il tourne par lui-même son smartphone n’est pas recommandé. Par contre, lui permettre de le faire, en fonction de ses goûts peut être apprécié par une partie d’entre eux.  On privilégiera alors une approche « fluide » comme pour le web en général, plus simple à mettre en œuvre.
Attention alors aux conflits avec d’éventuels écrans de détails s’affichant en mode paysage par défaut.

Mickaël Brard
picto

Commentaires

Soyez la premiere personne à ajouter un commentaire sur cet article.
Ecrire un nouveau commentaire