#FailUX: Quand un virement devient un enfer… à La Banque Postale

Soyons honnêtes. La Banque Postale a été l’une des premières banques françaises à proposer à ses clients un site web en avance sur son temps, et ce, gratuitement! Contrairement notamment à la Banque Populaire ou la BNP, pour ne pas les citer, qui eux vous facturaient ou facturent encore le service!
Malheureusement depuis un certain nombre d’années, l’avance prise par la LBP semble stagner et quelques failles d’ergonomie commencent à apparaître.

Problème
La Banque Postale Virement
Ainsi on découvre au hasard d’un virement que le système affiche une erreur totalement farfelue en cas de dépassement du plafond. 999 999, 99 euros le plafond maximum possible. Incroyable, non?
Cerise sur le gâteau, nous avons droit à un joli code technique que tout utilisateur aurait aimé ne pas voir. L'impact déceptif est majeur et la crédibilité de l'interface en souffre grandement.

Solution
Lorsque vous avez un virement à effectuer et que le montant total du livret se rapproche du maximum, les chances de dépasser ce plafond augmente. Dans la version actuelle, pour éviter tout refus de virement, l'utilisateur se voit contraint de sortir sa calculette (physique ou celle de son OS préféré) et de tenter de calculer la somme possible à virer. Pas facile car en plus, l'interface n'affiche pas la part d'intérêts du compte cible.
On aimerait ainsi avoir directement la somme possible à transférer dès l'écran ci-dessous:
La Banque Postale Ergonomique
Cela ne serait pourtant pas difficile question codage de faire des soustractions et d'afficher directement le montant maximum transférable! Histoire d'éviter à l'utilisateur, toute erreur, et de perdre ainsi son temps.

Autre écran, autre problème.
Problème
Nous avons tout un laïus pour expliquer les plafonds des sommes à virer par jour. Sauf que ce laïus n'est pas lu du fait de sa longueur. Et s'il n'est pas lu, l'utilisateur lambda a de grandes chances de commettre l'erreur.
La Banque Postale Ergonomique 2

Solution
Optimiser le texte en le raccourcissant et en choisissant plus finement les termes utilisés.
Attention! Virement externe (vers des banques concurrentes): le plafond passe de 4000 à 3000 euros. Virement interne: aucun plafond.
Court, efficace, tout en explicitant le côté externe d'un virement qui n'est pas évident au premier abord.

Principes de Base:
L'interface doit prévenir l'utilisateur assez tôt, de manière compréhensible et efficace
L'interface doit aider l'utilisateur dans sa tâche
L'interface doit afficher des erreurs de manière compréhensible
L'interface doit éviter à l'utilisateur de faire des erreurs

Un petit effort encore, La Banque Postale et ça sera (presque) parfait!

#FailUX: Quand le Service-Public.fr déraille dans la création de compte

Un bel exemple de #FailUX avec ce mail reçu par un de nos collègues, heureux possesseur d’un compte sur Service-Public.fr

Jugez plutôt:
service public : création de compte

Analyse
Dans un premier temps, on annonce que c’est pour « l’ouverture d’un compte » mais que « vous disposez actuellement d’un compte ». Créer un compte alors que nous en avons déjà un? Joli…

Deuxième effet du bonbon fraicheur, « l’accès au service-public sera définitivement fermé ».
Comprendre: nos 2 comptes ne vont plus servir à grand chose…

Cerise sur le gâteau de la bêtise administrative, dans le joli panel grisé, le génial imbécile concepteur de l’écran (ou toute une équipe?), propose de créer son compte personnel.
Quoi de plus logique puisque:
– nous avons déjà 2 comptes
– dans 3 mois le service sera fermé
– on nous confirme que dans 3 mois toutes les données seront perdues!

Au delà d’une expérience utilisateur catastrophique, à la fois anxiogène et ridicule, cela donne une nouvelle fois une bien mauvaise image de l’administration, la fameuse e-reputation.
Et tout cela avec un argent bien public… pas sûr que ce genre de mail puisse rendre finalement service.

REX
Bien analyser la logique d’un écran et des différentes étapes proposées.
Bien choisir les mots (stratégie de contenu).
Faire un travail itératif, idéalement en groupe, afin d’éliminer au fur et à mesure des erreurs de base.

Merci à Thierry pour cette pépite / @UXRepublic

Brave : le navigateur qui améliore l’ergonomie

Qui n’a jamais ainsi pesté devant une page qui refusait de se charger, partiellement ou complètement? Qui n’a jamais maudit cette satanée pop-up qui apparait sauvagemment, cette vidéo publicitaire qui s’incruste, les pénibles messages ‘votre contenu dans 15 secondes,14,13… » … alors que la page reste désespérément vide? La rapidité d’affichage d’une page fait partie intégrante de l’ergonomie et par extension d’une bonne « User Experience ».

Hier, on apprenait que l’ancien patron de la fondation Mozilla avait lancé la beta de son nouveau navigateur Brave. Un principe aussi simple que pragmatique. Limiter l’affichage des pubs, couper les funestes scripts de traçage, ceci afin d’accélérer le chargement. Malin!

Petite Démo:

Deuxième effet du navigateur double fraicheur: le système est débrayable. Vous souhaitez continuer à rétribuer les auteurs des sites web de qualité? Avec Brave, vous le pouvez, Brave remplaçant les publicités par une sélection de son propre catalogue. Vous voulez censurer le vomi marketing et le flicage des autres plateformes de contenus? Avec Brave, vous pouvez vous protéger de tous les trackers intrusifs.

Un concept prometteur déjà mis en place via des plugins et autres modules dans Firefox notamment. Pour ne pas le citer, l’add-on Add On Ghostery permettait déjà de paramétrer tous les mouchards qui plombent votre connexion.

Comme si cela ne suffisait pas, le navigateur va vous faire rugir de plaisir avec notamment l’intégration de HTTPS Everywhere, qui bascule automatiquement les transferts de données en HTTPS si le site web le permet.

Ce nouveau navigateur multiplateforme sera disponible sur toutes les principales plateformes mobiles iOS, Android ainsi que OSX, Windows et Linux sur desktop.

Hâte d’essayer la version stable pour allier respect de la vie privée et rapidité d’affichage. Seules les équipes e-Marketing vont pleurer…

Et pour les féru(e)s d’UX, rappel du slide « Pensez l’expérience Mobile » d’Amélie Boucher:

Plus d’infos sur Brave.com

Coup de Gueule: Quand Orange possède le Super-Pouvoir de faire plus qu’installer Internet Explorer Optimisé pour Orange

Un FAI ou hébergeur, ça aime toujours en faire « plus » pour ses clients. Et surtout, ça aime imposer son logo, sa marque (et plus) sur le PC de ses clients et abonnés. Encore les marketeux au pouvoir…
Et quand Orange vous propose, si gentiment, de mettre à jour votre Internet Explorer (que vous n’utilisez pas de toute manière), suivez ce conseil: ne le faites jamais! Sinon vous allez perdre du temps. Enfin un peu moins grâce à cet article.
Car si vous étiez tentés de cliquer sur « mettre à jour », voici ce qui se passe « réellement ».

Après avoir cliqué sur « mettre à jour », une boite de dialogue vous prévient que l’installation est terminée, tout se fait de manière invisible. Joli.
Et là, juste après cette mise à jour, vous souhaitez faire une recherche sur internet. Vous ouvrez votre navigateur par défaut – qui n’est pas Internet Explorer (pas folle la guêpe!) – votre Firefox.

Oh joie, Oh grand bonheur! Votre Firefox lui, toujours à jour, n’affiche plus la page par défaut (ici Google) mais bien, un moteur par Orange, intitulé, « Le Moteur ».
On peut également admirer, tout en haut, sous forme d’onglets, une horrible barre d’outils, par Orange encore, au style digne de la fin des années 90.

Firefox modifé par Orange

Firefox modifé par Orange au lieu de Internet Explorer


Faisant le malin ou la maline, vous vous dites qu’il suffit de changer la page de démarrage de votre Panda Rouge du Net? Et bien que nenni! Après deux essais infructueux, il faut se rendre à l’évidence.
La perversité des codeurs d’Orange (ou des maitrises d’ouvrage, allez savoir ;-)) n’a pas de limite.

Page de Démarrage Optimisée par Orange

Page de Démarrage de Firefox Optimisée par Orange

C’est bien une extension de Firefox qu’il faut désactiver ou supprimer pour se débarrasser de tout cela.

Extension Firefox Optimisée par Orange

Extension Firefox Optimisée par Orange

Jusqu’où vont les super-pouvoirs?
Incroyable mais vrai! Quand Orange propose à ses clients de mettre à jour son « Internet Explorer Optimisé pour Orange »… ses autres navigateurs (ici Firefox) sont modifiés aussi: ajout d’une extension, activation de celle-ci puis ajout d’une nouvelle page d’accueil.
Le client est pris au dépourvu et accessoirement… pour un imbécile. Aucune page d’avertissement. Aucune demande d’autorisation. Rien. Il faut s’y connaitre a minima en bureautique (difficile de parler d’informatique ici) pour se dépatouiller!
Imaginez maintenant si votre grand-mère fait l’opération. Que se passerait-il?

Devant une telle expérience utilisateur pathétique – y’a t il des ergonomes chez Orange? des testeurs? – on ne peut que se demander si le tripatouillage d’autres logiciels que celui installé (à savoir Internet Explorer) est tout simplement… légal?
Et lors de la même opération, Orange manipule-t-il d’autres logiciels à l’insu de son bien aimé utilisateur et client?

Inutile de vous dire qu’une crise de confiance vient de se déclarer. Finalement on se demande s’il ne vaudrait mieux pas qu’Orange n’ait pas trop de super-pouvoirs!

Un Comble: Une erreur d’Ergonomie sur le Portail des Ergonomes !

Il s’appelle le Portail des Ergonomes et concentre tout ce qu’il faut pour les ergonomes : Annuaire, Agenda, Ressources, Forum.
Et patatra… au détour d’un parcours d’offres d’emploi, on se retrouve avec une erreur d’ergonomie classique: une pagination sur 3 pages du résultat et la dernière page est désespérément vide.
Voyez plutôt:
Pagination vide

C’est bien connu: les cordonniers sont toujours les plus mal chaussés 😉

Des Affichages Centrés Utilisateur à la SNCF

Depuis quelques jours, sur le site web transilien.com la SNCF se vante d’avoir changé son affichage sur les quais. Le véritable changement : le temps d’attente du prochain train.
Terminée donc l’heure officielle du train, de toute manière il y a trop souvent des retards, et cela vous obligeait de regarder l’heure. Vous savez maintenant en temps réel la durée de votre supplice à greloter sur le quai.

Nouvel Affichage SNCF quai

Nouvel Affichage SNCF quai

Autre nouveauté, le sens de lecture et la disposition des informations pour plus de clarté:

Avant:
Affiche_train_se_modernise_3

et maintenant la nouveauté:
Affiche_train_se_modernise_4

Les usagers, pardon les clients, de la SNCF peuvent lire par ordre:
– le type de véhicule (train, tramway…)
– la ligne (A,B,C,D,E des RER mais aussi les autres lignes de banlieue)
– la destination du train
– le nom du train
– le temps d’attente

Sur le côté droit
– le nom du quai
– la longueur du train (souvent court en période de grève sinon ce n’est pas drôle)

En dessous:
– le détail des gares desservies (plus de place pour ce détail par rapport à l’ancienne version)
– un bandeau informatif des messages. Prévoir un « Bon voyage sur la ligne » en temps normal et un affichage défilant en cas d’incidents d’exploitation et autres joyeusetés.
– l’horaire (qui reste à la même place)

L’avantage, c’est d’avoir en seul coup d’oeil, l’essentiel des informations de votre train. Votre œil justement devra descendre s’il veut des détails. Avant, il était focalisé sur l’horaire puis devait faire un petit saut pour voir la destination et le type de train, la ligne.
Un peu d’ergonomie dans ce monde de brutes, ne fait pas de mal. Merci la SNCF.
Prochain travail: l’ergonomie du site transilien.com devenu illisible depuis le dernier changement de design. 😉

Google rend hommage à Grace Hopper, pionnière de l’Informatique et de l’Ergonomie

9 décembre 2013: Google fait son doodle hommage à Grace Hopper, « la mère du COBOL ».
Docteur en mathématiques en 1934, elle s’engagera dans la marine américaine en 1943 et sera, à cette occasion, la première personne à programmer le premier calculateur universel, le Harvard Mark I.
Pour l’anecdote, c’est d’ailleurs sur un Harvard Mark II, qu’un petit insecte sera retrouvé entre deux relais, provoquant le premier « bug » de l’histoire de l’informatique.

Doodle Grace Hopper

Après la guerre, elle travaillera chez Eckert-Mauchly Computer Corporation dans l’équipe développant l’UNIVAC I puis concevra en 1951 le premier compilateur de ce supercalculateur, l’A-0 System.

Admirez l’ergonomie de l’interface de l’UNIVAC I: que de boutons!

UNIVAC I Grace Hopper

Pionnière de l’informatique des supercalculateurs mais surtout pionnière de l’ergonomie informatique, puisqu’elle invente le premier compilateur développé pour un ordinateur, compilateur permettant de faciliter la vie à l’opérateur humain en charge de la machine.
En effet, l’innovation du système réside dans son pouvoir de compiler un programme désormais constitué de plusieurs sous-programmes (identifiés par un code numérique) ayant des paramètres: une révolution, comme dirait un certain Steve!

Dans le même esprit de simplification, dès son entrée chez IBM en 1957, elle prône l’idée que le langage de programmation doit de se rapprocher du langage naturel: non au code assembleur!
Au service du département de la Défense américaine, elle travaillera ensuite aux normes permettant le développement des langages COBOL (encore utilisé dans les grands groupes financiers de nos jours!) puis FORTRAN.

Toute sa vie, cette femme a voulu rendre plus facile d’utilisation l’informatique, améliorant en cela l’interaction homme-machine. Si les langages modernes de programmation s’avèrent aussi proche de l’anglais, on pense à Java et à C#, cette pionnière n’y est certainement pas étrangère.
Certains verront dans sa soif d’innovation et d’ergonomie, à contre-courant des idées de l’époque, sa touche féminine dans ces « deux mondes d’hommes », le monde de l’informatique et celui de l’Armée.

Terminant contre-amiral dans la marine américaine, en 1986, la Defense Distinguished Service Medal couronnera une carrière militaire aux états de service exceptionnels pour son pays… et pour la Science.

Expressions célèbres:
« Humans are allergic to change. They love to say, « We’ve always done it this way. » I try to fight that. That’s why I have a clock on my wall that runs counter-clockwise. »
« Life was simple before World War II. After that, we had systems. »


Grace Hopper expliquant les nanosecondes

Source Wikipedia & Wikiquote