Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

WUD 2009 Paris : Utilisabilité et m-commerce

Intervention de Vincent Frattaroli et Romain Landsberg lors de la Journée Mondiale de l'Utilisabilité 2009 à Paris.

  • Be the first to comment

WUD 2009 Paris : Utilisabilité et m-commerce

  1. 1. Usabilité m-commerce<br />Journée internationale de l’usabilité<br />12/11/2009<br />
  2. 2. Sommaire<br />Présentation Backelite<br />Contexte Internet mobile : le décollage enfin<br />Contexte Internet mobile : un univers technologique fragmenté<br />L&apos;usabilité : une nécessité dans un univers contraint<br />Etat de l&apos;art<br />Les bonnes pratiques (do&apos;s & don&apos;ts)<br />Etude de cas<br />2<br />Usabilité & m-commerce<br />
  3. 3. Présentation Backelite<br />
  4. 4. Backelite en quelques mots<br />Créée en 2006, Backelite est une société de conseil et de développement de services multimédia mobiles :<br />Conseil en marketing, ergonomie et technologies mobile<br />Intégrateur de solutions mobiles à forte valeur ajoutée <br />Backelite est leader en France dans le développement d’applications iPhone pour les marques (15 réalisations – 4 M de téléchargements)<br />Une équipe de 40 personnes pour accompagner nos clients<br />4<br />Usabilité & m-commerce<br />
  5. 5. Le contexte Internet mobile<br />
  6. 6. Contexte Internet mobile : enfin le décollage !<br />6<br />Usabilité & m-commerce<br />Un marché en pleine (ré)volution<br />Nouvelles technos …. nouveaux acteurs … nouveaux contenus<br />Quelques chiffres…<br />Audience sur les sites hébergés par Backelite<br />X 3 en 18 mois<br />Téléchargements sur l’AppStore<br />2mds en 16 mois<br />UtilisateursFacebook mobile<br />65 millions<br />Ratio visitesmobiles / web <br />Jusque 15%<br />des connexions<br />
  7. 7. Contexte Internet mobile : un univers hyper fragmenté <br />7<br />Usabilité & m-commerce<br />
  8. 8. L’usabilité au service d’un environnement contraint<br />Tailles d&apos;écrans et résolutions très variables (1 à 3)<br />Modèles tactile ou non, avec ou sans clavier<br />Navigation portrait et/ou paysage<br />Débits très variables (entre le métro et chez soi avec son wifi : de 30 kbit/s à plusieurs Mbit/s)<br />Fonctionnalités avancées variables (GPS, TV etc.)<br />Performance des navigateurs variables<br />Technologies embarquées propres à chaque OS<br />8<br />Usabilité & m-commerce<br />
  9. 9. Ergonomie mobile: la quadrature du cercle ?<br />9<br />Usabilité & m-commerce<br />
  10. 10. Parc mobile du minitel à l’ordinateur dernier cri<br />10<br />Usabilité & m-commerce<br />
  11. 11. Le paradoxe de l’usabilité pour l’Internet mobile<br />11<br />Usabilité & m-commerce<br />
  12. 12. Le paradoxe de l’usabilité pour l’Internet mobile (suite)<br />12<br />Usabilité & m-commerce<br />
  13. 13. Usabilité et mobilité : quelques questions clés avant de démarrer un projet<br />Qui cible-t-on ? Le service doit-il marcher sur tous les mobiles ? Quel est le parc mobile de mes clients?<br />Quel intérêt pour l&apos;utilisateur d&apos;accéder en mobilité ? Quels services sont pragmatiques en mobilité?<br />Quel lien entre le site web et la version mobile ?<br />Mes équipes ont-elles une connaissance de l&apos;internet mobile<br />Une approche &quot;image&quot;, &quot;efficacité&quot;; premium ou low cost ?<br />Quel est le mobile du patron de la société ?<br />13<br />Usabilité & m-commerce<br />
  14. 14. Bonnes pratique / application au m-commerce <br />Ne pas negliger l&apos;existant <br />conserver les mêmes codes graphiques, naming…<br />Personnalisation naturelle du service<br />l&apos;application mobile doit coller aux usages de son utilisateur, mise en avant des historiques, propositions de cross selling.<br />Utiliser les outils adequats <br />Les demandes dans un parcours de m-commerce sont variées (adresse, numéro de téléphone, mail, taille……) pour une meilleure usabilité utiliser les outils adéquat ( geoloc, différents claviers….)<br />Gérer les temps de chargement et les cas d&apos;erreurs<br />Quantifier graphiquement les temps de chargements<br />Indiquer clairement les erreurs et ce qui est attendu<br />Baliser la navigation<br />Afficher clairement l’étape (fil d’ariane, retours)<br />Respecter les bonnes pratiques &quot;classiques&quot; : taille police, transition etc.<br />14<br />Usabilité & m-commerce<br />
  15. 15. 15<br />Usabilité & m-commerce<br />Basic<br />Advanced<br />Touch<br />- Utilisation des capacités techniques de chaque mobile, notamment du JS (limitation écrans/ temps chargement)<br />- Poids des pages 10 à 30 ko<br />DO’s<br />
  16. 16. TEXTE<br />DON&apos;t<br />16<br />Usabilité & m-commerce<br />DO&apos;s<br />Texte 13 pxinterligne 18px<br />Texte 10 pxinterligne 12px<br />
  17. 17. TEXTE<br />17<br />Usabilité & m-commerce<br />Gestion de la taille du texte<br />
  18. 18. Gestion des effets<br />18<br />Usabilité & m-commerce<br />Gestion des effets<br />
  19. 19. UN BESOIN = UN CLAVIER<br />Les différents claviers de l&apos;iPhone<br />19<br />Usabilité & m-commerce<br />
  20. 20. 20<br />Usabilité & m-commerce<br />Accompagnement de l’utilisateur<br />
  21. 21. Etude de cas<br />
  22. 22. Use case 1 : vsc mobile<br />L&apos;existant<br />22<br />Usabilité & m-commerce<br />
  23. 23. Reprise des codes, personnalisation et services pragmatiques<br />23<br />Usabilité & m-commerce<br />
  24. 24. Navigation simplifiée<br />24<br />Usabilité & m-commerce<br />
  25. 25. 25<br />Usabilité & m-commerce<br />
  26. 26. Merci<br />26<br />Usabilité & m-commerce<br />

×