iPad et presse
Upcoming SlideShare
Loading in...5
×
 

iPad et presse

on

  • 471 views

 

Statistics

Views

Total Views
471
Views on SlideShare
471
Embed Views
0

Actions

Likes
0
Downloads
9
Comments
0

0 Embeds 0

No embeds

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

iPad et presse iPad et presse Presentation Transcript

  • L’ipad et la presse
    Que nous apprennent les tests utilisateurs ?
    Fabien Fericelli – Juin 2010
  • Sommaire
    0 > Méthodologie
    > La presse sur iPad : point de vue des utilisateurs
    > 10 recommandations pour une meilleure expérience utilisateur
    • Mettez le menu principal en évidence
    • Guidez l’utilisateur
    • Employez des symboles à la signification claire
    • Exploitez les possibilités tactiles de l’iPad
    • Intégrez une fonction de recherche
    • Restez cohérents
    • Favorisez la personnalisation de la navigation
    • Utilisez l’ensemble de l’écran
    • Proposez une application fluide
    • Pensez à supporter le format portrait et paysage
    > Conclusion
    Fabien Fericelli – Juin 2010
    2/57
  • Méthodologie
    Fabien Fericelli – Juin 2010
    3/57
  • Fabien Fericelli – Juin 2010
    4/57
    Le test utilisateur
    15 utilisateurs ont été recrutés pour cette étude. Le test utilisateur est individuel et dure environ 30 minutes
    L’utilisateur a pour consigne de réaliser un certain nombre de scénarii d’utilisation pour chaque application testée. (par exemple : « vous avez envie de consulter les nouvelles concernant l’équipe de France de football »)
    Le consultant ergonome invite l’utilisateur à s’exprimer sur ce qui lui facilite ou complique la tâche, ce qu’il aime ou qu’il n’aime pas, ce qu’il recherche etc.
    A l’issue du test, l’utilisateur rempli un questionnaire sur son ressenti et ses impressions sur les applications testées.
  • Les applications testées
    • Presse française
    • France 24
    • Le Figaro
    • Le monde
    • Les Echos
    • Paris Match
    • Presse anglo-saxonne
    • AssociatedPress
    • BBC News
    • Financial Times
    • The New York Times
    • The Wall Street Journal
    • USA Today
    Note
    Les applications ont été testés avec leur version la plus récente durant le moi de Juin 2010; il est fort probable que depuis, les mises à jour aient modifiées significativement les applications
    Fabien Fericelli – Juin 2010
    5/57
  • Conventions graphiques
    Glissement du doigt sur l’écran, de la droite vers la gauche (fait défiler l’écran vers la droite)
    ou
    Glissement du doigt sur l’écran, de haut en bas (fait défiler l’écran vers le haut)
    ou
    « ceci est une verbalisation issue de nos entretiens avec les utilisateurs»
    « ceci est une verbalisation issue de nos entretiens avec les utilisateurs»
    2,8/3
    Note tirée du questionnaire post-test
    Fabien Fericelli – Juin 2010
    6/57
  • La presse sur iPad
    Point de vue des utilisateurs
    Fabien Fericelli – Juin 2010
    7/57
  • Une grande facilité à parcourir librement le contenu
    Question : évaluez la facilité à parcourir librement le contenu
    Les utilisateurs trouvent que l’iPad est un outil efficace pour « se balader entre les articles »
    « On retrouve cette sensation qu’on avait un peu perdu avec internet»
    « c’est très agréable, on parcourt le journal assez facilement»
    Fabien Fericelli – Juin 2010
    8/57
  • Une recherche parfois laborieuse
    Question : évaluez la facilité à trouver une information précise
    Une fonction de recherche peu présente, des menus de navigation dissimulés sont autant de freins à la recherche d’une information particulière
    « Je suis obligé de tout parcourir c’est un peu frustrant »
    «c’est bien pour flâner mais dès qu’on recherche quelque chose de précis…  »
    Fabien Fericelli – Juin 2010
    9/57
  • Un outil de mobilité
    Question : si vous aviez le choix, quel support utiliseriez-vous pour lire les nouvelles ?
    Les utilisateurs éprouveraient néanmoins certaines réticences à utiliser l’iPad dans les lieux publics ou les transports de par son prix ou son aspect fragile
    « Je le sortirais pas comme ça dans la rue, j’aurais trop peur de me le faire piquer »
    Fabien Fericelli – Juin 2010
    10/57
  • Plusieurs sources d’information sur un même support
    « D’avoir tout sur un même objet je pense que ça me ferait lire plus; si j’ai un temps libre, je sors l’iPad et hop je lis »
    « Ce qui me parait le plus intéressant c’est le fait d’avoir tous les journaux ou magazines que l’on veut dans son iPad »
    « C’est sûr que c’est plus pratique que de se trimballer trois ou quatre journaux avec soi »
    Les utilisateurs sont satisfaits de pouvoir réunir leurs sources d’informations favorites sur l’iPad
    Fabien Fericelli – Juin 2010
    11/57
  • 10 recommandations
    Pour une meilleure expérience utilisateur
    • Mettez le menu principal en évidence
    • Guidez l’utilisateur
    • Employez des symboles à la signification claire
    • Exploitez les possibilités tactiles de l’iPad
    • Intégrez une fonction de recherche
    • Restez cohérents
    • Favorisez la personnalisation de la navigation
    • Utilisez l’ensemble de l’écran
    • Proposez une application fluide
    • Pensez à supporter le format portrait et paysage
    Fabien Fericelli – Juin 2010
    12/57
  • Un menu de navigation caché
    Afin d’accéder au sommaire l’utilisateur doit au préalable ouvrir un menu de navigation locale
    « Tiens, il y a un sommaire ici ? Pourquoi il l’ont pas mis directement en haut »
    « J’avais même pas vu qu’il y avait un sommaire »
    Fabien Fericelli – Juin 2010
    13/57
  • Un menu de navigation peu incitatif
    Un symbole peu signifiant
    En voyant ce symbole l’utilisateur ne s’attend pas à trouver la navigation principale
    «  Ca ne me semble pas intuitif comme bouton, on sait pas que c'est un menu  »
    Fabien Fericelli – Juin 2010
    14/57
  • Un menu contre intuitif
    Une affordance négative
    Le logo de USA today est reconnu intuitivement par les utilisateurs comme un outil permettant de revenir à la page d’accueil.
    La fonction de menu du logo n’est, la plupart du temps, découverte que par mégarde
    « C’est pas naturel; normalement si on clique sur le titre ça nous renvoie à la page d’accueil »
    « Je cherchais à revenir à la première page et ça m’a ouvert une fenêtre »
    Fabien Fericelli – Juin 2010
    15/57
  • Un menu invisible
    Sa petite taille couplée avec sa localisation et sa proximité avec d’autres items avec lesquels il n’a rien à voir, rendent ce menu extrêmement difficile à trouver (aucun des utilisateurs ne l’a remarqué)
    Fabien Fericelli – Juin 2010
    16/57
  • Des conventions iPhone à double tranchant
    Bien reconnues par les possesseurs d’iPhone, ces conventions se retrouvent peu efficaces pour les autres utilisateurs, plus sensibles aux conventions classiques du web, avec un menu attendu en haut de la page
    « Le menu est placé comme sur une appli iPhone c’est pratique»
    «  Ca ressemblait pas à la barre de navigation d'un site internet alors j’y ai pas fait attention»
    Fabien Fericelli – Juin 2010
    17/57
  • Un menu facilement perçu
    Un wording clair, une position conforme aux attentes des utilisateurs, ce menu, bien que peu mis en évidence, est trouvé facilement par les utilisateurs
    Fabien Fericelli – Juin 2010
    18/57
  • Une aide appréciée
    A défaut de proposer un menu de navigation classique, Financial Times propose une bulle d’aide qui permet de le trouver
    Attention : Une interface qui nécessite une aide afin d’être comprise est une interface qui ne guide pas assez son utilisateur !
    « Elles [les bulles d’aide] sont pratiques, on se sent aidé »
    Fabien Fericelli – Juin 2010
    19/57
  • 10 recommandations
    Pour une meilleure expérience utilisateur
    • Mettez le menu principal en évidence
    • Guidez l’utilisateur
    • Employez des symboles à la signification claire
    • Exploitez les possibilités tactiles de l’iPad
    • Intégrez une fonction de recherche
    • Restez cohérents
    • Favorisez la personnalisation de la navigation
    • Utilisez l’ensemble de l’écran
    • Proposez une application fluide
    • Pensez à supporter le format portrait et paysage
    Fabien Fericelli – Juin 2010
    20/57
  • Des utilisateurs perdus
    ?
    Dans quelle direction glisser afin de lire la suite de cette page ?
    Trop souvent l’utilisateur procède par essais-erreurs
    «  Si on sait pas ou partir, on clique un peu partout  »
    ?
    Fabien Fericelli – Juin 2010
    21/57
  • Des éléments interactifs qui ne se démarquent pas
    « Ah, on peut cliquer là ? »
    Le format des éléments entourés ne laisse pas penser que ceux-ci sont en réalité des éléments interactifs
    Fabien Fericelli – Juin 2010
    22/57
  • Une possibilité de scroller non perçue par les utilisateurs
    Rien n’indique à l’utilisateur qu’il peut faire défiler les vignettes si celui-ci n’essaie pas
    « Au début je croyais qu’il n’y avait que quatre articles mais en fait on peut glisser les cases sur le côté pour afficher la suite »
    « Il n’y a que 4 articles ? Ça fait pas beaucoup »
    Fabien Fericelli – Juin 2010
    23/57
  • Des indices qui suggèrent le scroll
    Grâce à ces astuces graphiques, l’utilisateur sait immédiatement que le contenu se prolonge et où
    «  La dernière ligne est plus claire en bas, ça m'a permis de savoir qu'il fallait glisser en bas  »
    Fabien Fericelli – Juin 2010
    24/57
  • Des repères qui orientent la navigation (1/2)
    Grâce à ces indices l’utilisateur sait que la suite de l’article se trouve en bas et qu’en allant à droite ou à gauche il trouvera d’autres articles
    « … au moins on sait où on en est »
    Fabien Fericelli – Juin 2010
    25/57
  • Des repères qui orientent la navigation (2/2)
    Une double utilité
    Ces bulles permettent de savoir combien de pages l’article contient mais aussi dans quelle direction glisser afin de lire la suite
    « les petites bulles nous permettent de voir qu'il y a trois pages c'est pratique  »
    Fabien Fericelli – Juin 2010
    26/57
  • 10 recommandations
    Pour une meilleure expérience utilisateur
    • Mettez le menu principal en évidence
    • Guidez l’utilisateur
    • Employez des symboles à la signification claire
    • Exploitez les possibilités tactiles de l’iPad
    • Intégrez une fonction de recherche
    • Restez cohérents
    • Favorisez la personnalisation de la navigation
    • Utilisez l’ensemble de l’écran
    • Proposez une application fluide
    • Pensez à supporter le format portrait et paysage
    Fabien Fericelli – Juin 2010
    27/57
  • Des icônes peu explicites
    Au premier abord les utilisateurs sont incapables de dire quelles peuvent être les fonctions de ces boutons
    « Le truc c’est qu’on est obligé de toucher les boutons pour savoir ce qu’ils font »
    Fabien Fericelli – Juin 2010
    28/57
  • Un symbole ambigu
    Certains utilisateurs attribuaient au bouton « + » la fonction d’agrandir l’article alors que celui-ci sert en réalité à afficher les articles associés
    Fabien Fericelli – Juin 2010
    29/57
  • Des symboles trop ressemblants
    1
    2
    Des symboles trop ressemblants qui font que les utilisateur attribuent la fonction (ou l’absence de fonction) de l’un à l’autre
    1 Toucher ce symbole affichera la site de l’article
    2 Toucher ce symbole n’aura aucune conséquence
    Fabien Fericelli – Juin 2010
    30/57
  • Une position qui améliore la reconnaissance
    Ici l’icône n’est pas forcément reconnu par l’utilisateur mais sa position sous entend sa fonction de « bouton retour »
    Revenir à la section
    Un icône peu reconnu placé là où d’ordinaire l’utilisateur trouve une croix, fait que les utilisateurs lui attribuent la fonction de fermer la fenêtre
    Passer en navigation par volets (exemple ci-dessous)
    Fabien Fericelli – Juin 2010
    31/57
  • Des symboles bien compris
    Des wording et des pictogrammes explicites
    Les symboles ci-dessus sont très bien reconnus par les utilisateurs
    Fabien Fericelli – Juin 2010
    32/57
  • 10 recommandations
    Pour une meilleure expérience utilisateur
    • Mettez le menu principal en évidence
    • Guidez l’utilisateur
    • Employez des symboles à la signification claire
    • Exploitez les possibilités tactiles de l’iPad
    • Intégrez une fonction de recherche
    • Restez cohérents
    • Favorisez la personnalisation de la navigation
    • Utilisez l’ensemble de l’écran
    • Proposez une application fluide
    • Pensez à supporter le format portrait et paysage
    Fabien Fericelli – Juin 2010
    33/57
  • Un geste de zoom peu intuitif
    L’utilisateur reproduit instinctivement les gestes spécifiques à l’iPad ce qui l’induit en erreur car ici l’agrandissement de l’image se fait en la touchant
    « Naturellement on cherche à zoomer en faisant ça ( mime le geste du zoom avec les doigts ) mais en fait il faut cliquer sur l’image »
    Fabien Fericelli – Juin 2010
    34/57
  • Une utilisation de boutons peu appréciée
    Que cela soit à l’intérieur d’un cadre ou au sein d’une page article, le geste de glissement du doigt est abandonné au profit d’un bouton
    Cet abandon d’un geste bien compris des utilisateurs est source de désagrément et d’erreurs
    « J’ai essayé de voir la 2ème page de la vignette et ça m’a tourné la page à la place »
    « Pourquoi utiliser un iPad si c’est pour appuyer sur des boutons ? »
    Fabien Fericelli – Juin 2010
    35/57
  • Un espace publicitaire qui gêne la navigation
    Si l’utilisateur effectue le geste de glissement qui lui permet de changer de page sur l’espace publicitaire, celui-ci ne sera pas pris en compte.
    Très frustrant pour l’utilisateur qui ne comprend pas pourquoi son geste ne fonctionne plus
    «  Pourquoi ça passe pas ? Ils veulent que je regarde la pub ? »
    Fabien Fericelli – Juin 2010
    36/57
  • Un glissement qui remplace avantageusement le bouton
    Sur l’application USA Today, le défilement à l’intérieur d’un cadre se fait en glissant le doigt,
    une action naturelle sur iPad
    Fabien Fericelli – Juin 2010
    37/57
  • 10 recommandations
    Pour une meilleure expérience utilisateur
    • Mettez le menu principal en évidence
    • Guidez l’utilisateur
    • Employez des symboles à la signification claire
    • Exploitez les possibilités tactiles de l’iPad
    • Intégrez une fonction de recherche
    • Restez cohérents
    • Favorisez la personnalisation de la navigation
    • Utilisez l’ensemble de l’écran
    • Proposez une application fluide
    • Pensez à supporter le format portrait et paysage
    Fabien Fericelli – Juin 2010
    38/57
  • Une option de recherche jugée très intéressante par les utilisateurs
    2,8/3
    Un vrai plébiscite
    Les utilisateurs jugent qu’une telle fonction est « très intéressante »
    Seules 3 personnes on jugé cette fonction « assez intéressante »
    Fabien Fericelli – Juin 2010
    39/57
  • 10 recommandations
    Pour une meilleure expérience utilisateur
    • Mettez le menu principal en évidence
    • Guidez l’utilisateur
    • Employez des symboles à la signification claire
    • Exploitez les possibilités tactiles de l’iPad
    • Intégrez une fonction de recherche
    • Restez cohérents
    • Favorisez la personnalisation de la navigation
    • Utilisez l’ensemble de l’écran
    • Proposez une application fluide
    • Pensez à supporter le format portrait et paysage
    Fabien Fericelli – Juin 2010
    40/57
  • Un glisser-déposer bancal
    1 Ajouter une catégorie demande à l’utilisateur un glisser-déposer
    2 Supprimer une catégorie s’effectue en glissant le doigt sur le nom de la catégorie afin de faire apparaître un bouton qu’il faut ensuite toucher
    1
    2
    L’interface utilise deux modes de fonctionnement différents ce qui déroute l’utilisateur
    Fabien Fericelli – Juin 2010
    41/57
  • Un titre interactif…ou non
    1
    2
    1 Dans une rubrique(sport, international, etc.), toucher le tire figaro.fr vous renverra à la page d’accueil
    2 Dans un article, le titre est inactif
    L’utilisateur est dérouté par cette pratique et souvent il ne comprends pas dans quelles conditions le titre est actif .
    Fabien Fericelli – Juin 2010
    42/57
  • 10 recommandations
    Pour une meilleure expérience utilisateur
    • Mettez le menu principal en évidence
    • Guidez l’utilisateur
    • Employez des symboles à la signification claire
    • Exploitez les possibilités tactiles de l’iPad
    • Intégrez une fonction de recherche
    • Restez cohérents
    • Favorisez la personnalisation de la navigation
    • Utilisez l’ensemble de l’écran
    • Proposez une application fluide
    • Pensez à supporter le format portrait et paysage
    Fabien Fericelli – Juin 2010
    43/57
  • Une personnalisation de la navigation par mots-clés
    1
    Sur l’application France 24, l’utilisateur peut sauvegarder des mots-clés qui lui permettent de se créer une navigation personnalisée
    Une bonne idée mais …
    Ici, la distance entre l’action de l’utilisateur (1) et la réaction de l’application (2) est trop élevée. Certains utilisateurs n’ont pas vu l’ajout des mots-clés dans le barre.
    2
    1 L’utilisateur sélectionne un ou plusieurs mots-clés
    2 Les mots clés choisis s’affichent en bas et peuvent être utilisés comme un menu de navigation
    Fabien Fericelli – Juin 2010
    44/57
  • Un menu qui s’adapte aux besoins de l’utilisateur
    1
    1 Le menu personnalisé avant
    2 Ajout de catégories d’information
    2
    3 Le menu personnalisé après
    Sur l’application AssociatedPress l’utilisateur peut ajouter des catégories à un menu personnalisé
    3
    Fabien Fericelli – Juin 2010
    45/57
  • 10 recommandations
    Pour une meilleure expérience utilisateur
    • Mettez le menu principal en évidence
    • Guidez l’utilisateur
    • Employez des symboles à la signification claire
    • Exploitez les possibilités tactiles de l’iPad
    • Intégrez une fonction de recherche
    • Restez cohérents
    • Favorisez la personnalisation de la navigation
    • Utilisez l’ensemble de l’écran
    • Proposez une application fluide
    • Pensez à supporter le format portrait et paysage
    Fabien Fericelli – Juin 2010
    46/57
  • Une zone morte qui aurait pu être exploitée
    Plus de la moitié de l’écran n’est pas utilisée, et le contenu se retrouve isolé dans un coin
    1
    2
    1 Un espace « mort », pas de lecture ni d’interaction possible
    2 Un espace dédié à l’article en cours de lecture
    Fabien Fericelli – Juin 2010
    47/57
  • Une utilisation de l’espace au service de la navigation
    1
    2
    1
    2
    L’utilisateur peut sélectionner un article et rapidement avoir un aperçu de son contenu, ce qui permet une navigation plus rapide et plus agréable
    1 Un volet servant à la navigation
    2 Un espace dédié à l’article en cours de lecture
    Fabien Fericelli – Juin 2010
    48/57
  • 10 recommandations
    Pour une meilleure expérience utilisateur
    • Mettez le menu principal en évidence
    • Guidez l’utilisateur
    • Employez des symboles à la signification claire
    • Exploitez les possibilités tactiles de l’iPad
    • Intégrez une fonction de recherche
    • Restez cohérents
    • Favorisez la personnalisation de la navigation
    • Utilisez l’ensemble de l’écran
    • Proposez une application fluide
    • Pensez à supporter le format portrait et paysage
    Fabien Fericelli – Juin 2010
    49/57
  • Une latence source de désagrément
    Lorsqu’il tourne la page, l’utilisateur ne sait pas immédiatement si la commande à bien été prise en compte.
    Un feedback permettrait d’éviter à l’utilisateur de répéter le geste (ou d’attendre que la page se tourne alors que la commande n’à pas été prise en compte)
    « On est obligé de tourner 10 fois la page c’est énervant »
    « Il y a une grosse latence quand on tourne les pages »
    Fabien Fericelli – Juin 2010
    50/57
  • Une interface fluide qui renforce l’immersion
    Avant glissement
    Pendant glissement
    Après glissement
    La fluidité de l’animation permet à l’utilisateur un parcours plus agréable et une sensation proche de la lecture du magazine papier
    Fabien Fericelli – Juin 2010
    51/57
  • 10 recommandations
    Pour une meilleure expérience utilisateur
    • Mettez le menu principal en évidence
    • Guidez l’utilisateur
    • Employez des symboles à la signification claire
    • Exploitez les possibilités tactiles de l’iPad
    • Intégrez une fonction de recherche
    • Restez cohérents
    • Favorisez la personnalisation de la navigation
    • Utilisez l’ensemble de l’écran
    • Proposez une application fluide
    • Pensez à supporter le format portrait et paysage
    Fabien Fericelli – Juin 2010
    52/57
  • Une perte de contenu en format portrait
    2
    1
    1 Tenu en format paysage, l’application propose un grand choix de catégories d’information
    2 Tenu en format portrait, l’application ne propose plus que les catégories personnalisées
    Fabien Fericelli – Juin 2010
    53/57
  • Des applications qui ne prennent pas en compte l’orientation de l’iPad
    La page d’accueil de l’application Paris Match n’est disponible qu’en format portrait
    L’application France 24 quand à elle n’est disponible qu’en format paysage
    Fabien Fericelli – Juin 2010
    54/57
  • CONCLUSION
    5 points à retenir
    Fabien Fericelli – Juin 2010
    55/57
  • Guidez l’utilisateur
    • Où et comment agir ? Qu’est ce qui va se passer si j’appuie là ? Où je suis ? Les utilisateurs ne devraient pas avoir à se poser ces questions.
    Exploitez les possibilités de l’iPad
    • Les utilisateurs veulent utiliser les geste spécifiques à l’interface tactile de l’iPad
    • Pensez à ce que tous les aspects d’une application soient accessibles en format portrait et paysage
    • Proposez du contenu interactif, un simple reader reste très décevant pour l’utilisateur
    Soyez originaux, mais clair
    • Les utilisateurs peuvent être séduits l’aspect graphique d’une application, mais ils ne l’utiliseront que si elle est pratique et répond à leurs besoins
    Fabien Fericelli – Juin 2010
    56/57
    Les 5 points a retenir
  • Pensez qu’il existe plusieurs façons de parcourir un contenu
    • Parcours libre – l’utilisateur doit avoir un aperçu rapide d’une multitude d’informations afin d’en choisir une
    • Recherche par catégorie – l’utilisateur doit à tout moment pouvoir facilement sélectionner une catégorie d’informations
    • Recherche ciblée – l’utilisateur doit pouvoir sauter directement à l’information qui l’intéresse (moteur de recherche)
    Laissez l’utilisateur personnaliser la navigation de son application
    • Plus votre application propose de contenu plus l’utilisateur risque d’être perdu parmi des informations qu’il ne juge pas pertinente
    Fabien Fericelli – Juin 2010
    57/57
    Les 5 points a retenir