Réveillez l'entrepreneur qui sommeille en vous / Startupeers.co

< Retour

M'inscrire /

Me connecter

Fidall, la dématérialisation des cartes de fidélités.

Gros utilisateur d’app mobiles (iPhone & iPad), cela fait quelques temps que je souhaite partager mon expérience d’utilisateur, en particulier sur le volet ergonomie & utilisabilité. Voici donc mon premier décryptage de design mobile :

Fidall – la dématérialisation des cartes de fidélité.

Fidall.SplashScreen

Le service rendu.

Avant d’entrer dans le vif du sujet, prenons le temps de faire un rapide tour du propriétaire. Fidall est une app mobile pour l’instant disponible uniquement sur iPhone. Les plateformes Android, bada, blackberriy et autres étant en cours de développement.

Voyons ce que le pitch nous promet :

Avec Fidall, gagnez du temps en caisse, ne loupez jamais les avantages ou bons plans liés à vos cartes de fidélités et adhérez facilement à de nouvelles cartes

Si je reformule à ma sauce, Fidall va me permettre :

  • d’alléger mon portefeuille des cartes de fidélités (elles seront enregistrées dans l’iPhone)
  • de m’inscrire « in App » à certains programmes de fidélité
  • de trouver les boutiques autour de moi qui acceptent mes cartes de fidélité (et donc d’en profiter)

L’idée est assez simple sur le papier, mais l’ergonomie et l’utilisabilité de Fidall lui permettent-elles de remplir son contrat ?

 

Lancement de l’App – première utilisation.

Fidall.First.Launch

Après un splash-screen de 3-4s, l’écran d’accueil s’affiche. Les couleurs dominantes sont le violet et le jaune, que l’on retrouve également dans le logo, et qui constituent l’univers coloriel de l’app (personnellement et très subjectivement j’ai un peu de mal avec le violet dans les écrans de l’app).

But de l’écran

Engager l’utilisateur à s’inscrire pour bénéficier de la sauvegarde cloud de ses cartes (à noter que tant que l’utilisateur n’est pas inscrit cet écran s’affiche à chaque démarrage).

Remarques

Les moins

  • Le picto central de part sa couleur, le contraste et la mise en valeur graphique via les lignes convergentes suggère fortement une action de « tap » de la part de l’utilisateur. Hors il s’agit d’une contre-affordance car l’action souhaitée est le « tap » sur le bouton « S’inscrire » qui est situé en bas de l’écran et faiblement contrasté.
  • Et si je ne veux pas m’inscrire ? Il n’y a pas d’indications pour me guider..

Mes propositions

  • supprimer ou rendre plus neutre le picto central (changer également l’effet graphique du fond d’écran)
  • augmenter la taille et le contraste du bouton s’inscrire (emploi du jaune par exemple)
  • Ajouter un bouton « Plus tard » à gauche du bouton « s’inscrire », moins gros et moins contrasté. Ajouter un court texte explicatif du style « l’inscription peut se faire à tout moment via l’écran Mon Fidall. »
  • Ne pas afficher cet écran à chaque démarrage si l’utilisateur n’est pas inscrit.

L’inscription.

Fidall.Sign.up

But de l’écran

Créer son compte.

Remarques

Les plus

  • Un bon point pour le processus d’inscription qui est simple et efficace. Seule une adresse e-mail et un mot de passe sont demandés. Après confirmation par mail de la validité de son adresse mail l’utilisateur peut se connecter dans l’application.

Mes propositions

Pour chipoter je propose tout de même une amélioration : supprimer la double saisie du mot de passe. On pourra discuter du bien-fondé de ce point dans les commentaires, mais je trouve que sur les claviers virtuels la saisie de deux mots de passe est incommode.

Comme Fidall utilise déjà la technique « Apple » (les lettre s’affichent puis se transforment en °), je propose la suppression du second champ et l’ajout d’une case à cocher « Afficher le mot de passe » décochée par défaut.

E&U.S01E01.Inscription

L’ajout de carte.

Fidall.adhesion

Pour faire simple, les deux fonctionnalités majeures de Fidall sont l’ajout de carte et la visualisation des cartes enregistrées.

Après être passé par l’écran « Mes Cartes », dont la publicité n’est pas trop intrusive, et  avoir« tapé » sur le bouton « + » en haut à droite, l’utilisateur arrive sur l’écran.

But de l’écran

Enregistrer ma carte de fidélité (qu’elle existe ou non dans les modèles Fidall).

Remarques

Les plus

  • Un grand nombre d’enseignes sont déjà référencées, ce qui simplifie le processus d’inscription.

Les moins

  • les boutons du bandeau bas ne conduisent pas aux mêmes actions, et l’utilisateur ne peux pas le savoir à l’avance. Les deux premiers change la façon de présenter les modèle, le troisième ouvre un écran de création de carte sans modèle et le dernier filtre la liste des modèles pour ne présenter que ceux avec adhésion.
  • Le bouton « x » en haut à droite ne va pas dans le sens des guideline Apple, donc peut perturber cognitivement  l’utilisateur.
  • Le moteur de recherche ne gère pas les caractères accentués

Fidall.recherche.fail

Mes propositions

  • Supprimer le bouton adhésion de cet écran. Il serait plus pertinent de l’ajouter dans le bandeau bas principal tant pour l’utilisateur (plus clair) que pour les partenaires (plus lisible).
  • Supprimer le bandeau bas. Le remplacer par un bandeau sous le champ de recherche permettant d’afficher par catégorie / nom (voir les deux propositions d’interface). Par défaut c’est le classement par nom qui est proposé.
  • Proposer, et afficher en permanence, la création d’une carte sans modèle en bas de l’écran.
  • Proposer dans les résultats de recherche les caractères accentués ou non et éventuellement proposer des termes approchants.
  • Remplacer la « X » par un bouton « Retour » en haut à gauche.

E&U.S01E01.AdhesionE&U.S01E01.Recherche

La création de carte « vierge ».

Fidall.carte.vierge

Lorsque l’utilisateur ne trouve pas l’enseigne correspondant à sa carte de fidélité, il a la possibilité d’en créer une manuellement.

But de l’écran

Enregistrer une carte de fidélité non référencée dans Fidall.

Remarques

Les plus

  • Les champ nom et prénom pré-alimentés si l’utilisateur à complété son profil
  • La présence d’un gabarit sur l’écran de photographie de la carte.
  • La possibilité de scanner le code barre, qui réduit le risque d’erreur lié à la saisie du numéro de carte
  • Peu d’informations sont demandées, le processus est rapide

Fidall.carte.vierge.photo

Les moins

  • Le bouton « Prendre une photo » en haut à droite n’est pas assez visible et placé dans une zone qui ne correspond pas aux habitudes des utilisateurs (guideline Apple)
  • Le bouton « Scanner » accompagné des dessins de CAB et QRcode n’est pas très affordant
  • Le choix du type de code barre est impossible à faire, sauf à être un expert du domaine

Mes propositions

  • Remonter le champ  « Enseigne » en première position
  • Si possible regrouper les champ « Prénom » & « Nom » en un seul et les place en dessous.
  • Supprimer le bouton « Prendre une photo » en haut à droite.
  • Positionner la zone où se situe l’image de la carte de fidélité en haut à droite (si une photo existe déjà, ajouter le texte « changer de photo » en surimpression sur la vignette). Au« tap »  de l’utilisateur, un écran permettant d’ajouter / changer la photo s’affiche.
  • Supprimer les images de CAB & QRcode, le bouton « Scanner » et le champ de saisie manuel et le champ de choix du type de code barre.
  • Ajouter une zone « tapable » menant à un écran de saisie du CAB*.
  • Sous cette zone ajouter un champ non saisissable qui affichera le n° de la carte après qu’il ai été renseigné.
  • Sur l’écran de saisie du n°,  proposer 3 choix. Deux bouton de scan (avec image du code barre sur les bouton pour bien les différencier), un champ de saisie manuel qui sera complété automatiquement si un scan est effectué.

E&U.S01E01.New
* : pour l’action de scan / saisie du n°, plusieurs possibilités existent. Il est possible de simplement agrandir le bouton « Scanner » (j’ai préféré ajouter un écran pour que toutes les informations soient présentées dans un seul écran sans scroll). Il est également possible de proposer comme premier écran pour la création d’une carte le choix du type de carte – avec code barre / avec QR code / juste un numéro. Dans ce cas l’écran de modification de la carte sera différent de l’écran de création, ce qui peut être perturbant pour l’utilisateur. .

Le plan pour localiser les commerces.

Fidall.map

But de l’écran

Localiser les enseignes situées à proximité et correspondants aux cartes enregistrées.

Remarques

Les plus

  • Simple à utiliser, il suffit de taper sur une des cartes pour afficher sur le plan les enseignes à proximité.

Les moins

  • Par défaut rien ne s’affiche sur le plan.
  • Les 4 boutons en bas ne sont pas très clairs.

Mes propositions

  • Il serait bon par exemple que le plan affiche par défaut toutes les enseignes pour lesquelles l’utilisateur à enregistré une carte, en affichant sur le drapeau l’image associée à la carte. Fidall.map.flagL’action de sélectionner une carte permettrait alors de filtrer si besoin. Dans certain cas cela pourrait permettre de gagner un peu de temps.
  • Supprimer les 3 boutons centraux. Les types d’affichage de la carte en vue satellite et mixte n’apportent pas une grande valeur ajoutée.
  • déplacer le bouton de droite. Le lier à la zone supérieure, en ajoutant par exemple une excroissance arrondie au milieu de cette dernière (voir proposition graphique). Il sera cognitivement beaucoup plus clair.

Fidall.map

En pratique – faire scanner mon iPhone à la caisse.

Fidall.caisse

Cette revue ergonomique ne serait pas complète sans un test in vivo, car l’utilisabilité d’une app s’évalue de bout en bout. Pour Fidall il s’agit donc de vérifier l’acte de présentation de la carte dématérialisée en caisse.

But de l’écran

Présenter rapidement sa carte fidélité à la caisse.

Remarques

Les moins

  • Par défaut c’est le visuel de la carte qui s’affiche, pas son code barre.

Recommandations

  • Afficher la face « code barre » par défaut.
  • Une autre solution serait de faire un mix en affichant le code barre sur la face  « visuel », même si dans ce cas la carte perd un peu de sa ressemblance avec l’original (dématérialiser ne veut pas toujours dire reproduire à l’identique).

Fidall.caisse.CAB

Compléments

Le peu de tests que j’ai effectué ne permet pas de généraliser ma conclusion mais dans l’ensemble, passé la réaction de surprise des caissiers & caissières, ça fonctionne !

Attention néanmoins, la limite actuelle de ce genre d’app est malheureusement la compatibilité entre les systèmes de scan et les écrans de smartphone (reflets ?). Sur les enseignes que j’ai testé, dans un cas sur deux le scan n’était pas possible et le caissier / caissière a été obligé de saisir le n° manuellement.

Ayant la chance de travailler pour une enseigne utilisant beaucoup le flashage de codes barres 1D, j’ai également fait le test avec tous les types de matériel que nous avons à disposition en salle de test. Verdict : sur 7 modèles différents, 4 essais couronnés de succès..

J’imagine que la situation s’améliorera petit à petit avec l’évolution des systèmes de flashage, mais il est vrai que c’est un point gênant.

 

En résumé

Dans l’ensemble, l’application est plaisante et rempli bien son rôle de centralisateur de cartes de fidélités. Sa limite à mon sens est celle précédemment citée : la compatibilité entre les systèmes de scan et les écrans de smartphone. Pour autant je pense que les gros consommateurs de programmes de fidélité s’y retrouveront.

Un excellent point à mettre en avant et sur lequel je pense que Fidall peut faire la différence par rapport à ses concurrents : l’inscription in-app aux programmes de fidélité de grandes enseignes.

En effet il n’y a rien de plus rébarbatif qu’un formulaire d’inscription à un programme de fidélité. S’il est possible de le faire en quelques tap, alors la valeur ajoutée pour l’utilisateur est vraiment importante et différenciante. Le nombre d’enseigne concernées est pour l’instant assez faible, mais comme son augmentation représente à mon sens la meilleure option qu’aie Fidall pour faire la différence sur ce marché, ça devrait bouger un peu !

 

Disclaimer : Passionné par les questions d’utilisabilité et d’expérience utilisateur que soulève le tactile (smartphone, tablettes, …), je ne me prétend pas pour autant ergonome. Les remarques et recommandations qui figurent dans cette série de billet sont issues de mon expérience en tant qu’utilisateur et de mes appétences dans ce domaine (alimentée par de nombreuses lectures). Le but des mes propositions est d’engager une réflexion constructive et ouverte, par exemple dans les commentaires, de manière à nous enrichir mutuellement !

Auteur : Fabien Grenet Fabien a effectué 450 contributions sur Startupeers.

Cofondateur de There is no spoon, Fabien est tout autant passionné par l'innovation et le numérique que par le jardinage. Il partage sa vision et son expérience sur Take the Red Pill, ainsi que ses expérimentations agricoles sur Le Potager Perché. There is no spoon est une agence écosystème fédérant un collectif de freelances partageant un même objectif : permettre d'accélérer les projets en exploitant les leviers du numérique (état d'esprit, méthodes, outils).

3 Commentaires

  1. Bonjour,

    Merci beaucoup pour cette impressionnante analyse et vos commentaires très pertinents.

    Nous allons décortiquer tout cela et voir dans quelle mesure nous pouvons apporter les améliorations que vous suggérez.

    L’équipe Fidall

    Répondre
  2. Bonjour, j’ai crée un compte fidall, et j’ai enregistré mes cartes mais j’ai changer de téléphone et je n’arrive pas a rentrée sur mon compte il me dit que je n’ai pas validé mon mail, mais je ne le retrouve pas comment faire pour ou recevoir a nouveau le mail et rentrer dans mon compte

    Répondre
    • Bonjour, je vous conseille de vous tourner vers le support Fidall…

C'est à vous !