2. Sommaire Présentation Backelite Contexte Internet mobile : le décollage enfin Contexte Internet mobile : un univers technologique fragmenté L'usabilité : une nécessité dans un univers contraint Etat de l'art Les bonnes pratiques (do's & don'ts) Etude de cas 2 Usabilité & m-commerce
4. Backelite en quelques mots Créée en 2006, Backelite est une société de conseil et de développement de services multimédia mobiles : Conseil en marketing, ergonomie et technologies mobile Intégrateur de solutions mobiles à forte valeur ajoutée Backelite est leader en France dans le développement d’applications iPhone pour les marques (15 réalisations – 4 M de téléchargements) Une équipe de 40 personnes pour accompagner nos clients 4 Usabilité & m-commerce
6. Contexte Internet mobile : enfin le décollage ! 6 Usabilité & m-commerce Un marché en pleine (ré)volution Nouvelles technos …. nouveaux acteurs … nouveaux contenus Quelques chiffres… Audience sur les sites hébergés par Backelite X 3 en 18 mois Téléchargements sur l’AppStore 2mds en 16 mois UtilisateursFacebook mobile 65 millions Ratio visitesmobiles / web Jusque 15% des connexions
8. L’usabilité au service d’un environnement contraint Tailles d'écrans et résolutions très variables (1 à 3) Modèles tactile ou non, avec ou sans clavier Navigation portrait et/ou paysage Débits très variables (entre le métro et chez soi avec son wifi : de 30 kbit/s à plusieurs Mbit/s) Fonctionnalités avancées variables (GPS, TV etc.) Performance des navigateurs variables Technologies embarquées propres à chaque OS 8 Usabilité & m-commerce
10. Parc mobile du minitel à l’ordinateur dernier cri 10 Usabilité & m-commerce
11. Le paradoxe de l’usabilité pour l’Internet mobile 11 Usabilité & m-commerce
12. Le paradoxe de l’usabilité pour l’Internet mobile (suite) 12 Usabilité & m-commerce
13. Usabilité et mobilité : quelques questions clés avant de démarrer un projet Qui cible-t-on ? Le service doit-il marcher sur tous les mobiles ? Quel est le parc mobile de mes clients? Quel intérêt pour l'utilisateur d'accéder en mobilité ? Quels services sont pragmatiques en mobilité? Quel lien entre le site web et la version mobile ? Mes équipes ont-elles une connaissance de l'internet mobile Une approche "image", "efficacité"; premium ou low cost ? Quel est le mobile du patron de la société ? 13 Usabilité & m-commerce
14. Bonnes pratique / application au m-commerce Ne pas negliger l'existant conserver les mêmes codes graphiques, naming… Personnalisation naturelle du service l'application mobile doit coller aux usages de son utilisateur, mise en avant des historiques, propositions de cross selling. Utiliser les outils adequats 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….) Gérer les temps de chargement et les cas d'erreurs Quantifier graphiquement les temps de chargements Indiquer clairement les erreurs et ce qui est attendu Baliser la navigation Afficher clairement l’étape (fil d’ariane, retours) Respecter les bonnes pratiques "classiques" : taille police, transition etc. 14 Usabilité & m-commerce
15. 15 Usabilité & m-commerce Basic Advanced Touch - Utilisation des capacités techniques de chaque mobile, notamment du JS (limitation écrans/ temps chargement) - Poids des pages 10 à 30 ko DO’s
Les effets doivent faciliter la perception dans l’avancée d’un parcours client.Respecter le sens de navigationNe pas utiliser d’effet ostentatoire à mauvais escientUtilisation des effets pour l’ajout au panier
Lors d’un parcours client le mobinaute doit remplir de nombreuses informations.Proposer le meilleur outils pour faciliter la saisie d’infos.Ici les différents claviers de l’iPhoneAutres exemples les différentes roulettes ou la geolocalisation pour une adresse.
Reprise de la charte graphique et des noms utilisés sur le site webPersonnalisation du servicePragmatisme des services proposés (première version avec promo + mis en avant)
AutocomplessionCarte de France cliquable avec les 15 gares les plus demandéesProposition d’un calendrier (zone tactile adaptée)
Les actions pour avancer sont mise en avantPaiement faciliter. Mais on ne conserve pas les données bancairesConfirmation immediate par mail