Christophe Le Bot

  • Navigation rapide
Pratique de la conception numérique

Derniers commentaires

  • Test d’interface : paiement d’amendes en ligne
    • Herbaux Jean-Marie | J’ai été coupé a 15h56. Je ne parviens pas confirmer mon payement par C B via le payement.en ligne par Internet. J’entre bien les quatre groupes de chiffres et les deux...
    • Rovellotti Olivier | Ce site est un véritable cauchemar UX Excellent article http://www.natural-solutions.e u/
    • Julien | Pour info, mon e-numero etait sur le cote gauche, ecrit verticalement, sans aucun label.
  • Agence web ou SSII : que choisir ?
    • Rovellotti Olivier | La limite n’est plus aussi claire qu’avant effectivement et les différence de prix sont du l’ordre du *10. Généralement les équipes dans les agences sont plus...
  • Une excellente thèse sur Simile Exhibit
    • Olivier Rossel | Bonjour. Malgre les annees, avez vous toujours en memoire vos usages d’Exhibit? Je serais ravi d’en discuter avec vous. Cordialement, Olivier Rossel.
 

Archives de la catégorie
Ergononie

Nouvel iMac, et toujours le même phénomène…

Le nouvel iMac d’Apple vient de sortir. Encore une fois, il suffit de voir ce produit Apple pour qu’immédiatement tout ce qui existait auparavant ait un petit air d’obsolescence…

Je ne vais pas m’étendre sur ses caractéristiques puisque des centaines d’autres sites l’ont déjà fait. J’en garde juste une image redoutable.

Comparaison iMac / Dell XPS 410
Comparaison iMac / Dell XPS 410 (photo Apple).

Ce que j’aime dans cette comparaison, c’est qu’Apple a fait l’effort de choisir une machine concurrente au « design soigné » qu’on pourrait qualifier de « belle » dans le monde PC. Pourtant, le fossé qui sépare Apple des autres constructeurs en matière de design et d’innovation est abyssal…

Le “Mobile web 2.0″, un marché encore immature

La pandémie « web 2.0 » gagne du terrain et touche maintenant le marché de la téléphonie mobile. Ce n’est pas un scoop puisque les projets fleurissent partout, y compris en France… et surtout à Toulouse où j’aide quelques « groupes de travail » à développer des services mobiles qui vont, bien sûr, changer le monde. Mais promis, je ne dirais rien !

Le web 2.0 pour mobiles vous rend euphorique ? Voici l’heure de la douche froide. Dans le rôle du rabat-joie, un petit article de MocoNews a le mérite de décrire objectivement la situation : le Mobile web 2.0 est trop ambitieux, nous devrions l’appeler Mobile 0.5.

Un avis que je partage totalement, car il ne rejette pas la révolution à venir des applications mobiles mais insiste seulement sur l’immaturité du marché, des interfaces et des modèles économiques :

If there is a wireless revolution under way, then it’s certainly a slow one. “We’re really at mobile Web 0.5, to be completely honest,” Sumit Agarwal, a product manager in Google’s mobile division, was quoted as saying.

[…]

Mobile web 2.0 will happen – in good time.

La voie est pourtant tracée :

The real thing about Web 2.0 is people introducing applications to each other. […] True viral applications, something sent from one person to another, will absolutely be a big part of mobile.

J’en connais un qui va être ravi de voir ses décisions stratégiques confirmées de la sorte…

Journée IHM à Toulouse le 18 juin 2007

Midi-Pyrénées Innovation organise, le 18 juin 2007 à la Cité de l’Espace, la Journée Technologique Interface Homme-Machine.

L’objectif est de sensibiliser les décideurs aux atouts de la conception d’interfaces homme-machine dans le développement de projets innovants. Au programme, un état des lieux du métier et de ses enjeux, des témoignages d’industriels et de chercheurs, des démonstrations d’applications interactives, sans oublier l’aspect formation et l’avenir des IHM.

Ce sera surtout l’occasion de découvrir le potentiel de la région Midi-Pyrénées en matière d’ergonomie et de conception d’IHM, avec des intervenants tels que :

Rendez-vous donc à la Cité de l’Espace le 18 juin. J’y serai, bien sûr…

Pour en savoir plus et s’inscrire : site web Midi-Pyrénées Innovation

“Web 2.0″, Ajax, interfaces riches et prospective

J’ai toujours détesté le terme « web 2.0 ». Il ne signifie rien. Il englobe ce que chacun veut y mettre et ne sert qu’à convaincre les clients crédules de la nécessité d’une refonte de leurs services en ligne.

Les acteurs du web n’ont pas attendu la vague du « web 2.0 » (à quand le ressac ?) pour créer des communautés ou des applications en ligne (on remarquera au passage que les web applications sont devenues des SaaS, softwares as a service, c’est plus « tendance »).

Et que dire du contenu généré par les utilisateurs (le fameux User Generated Content si cher au « web 2.0 ») ? N’est-ce pas la fonction première du web que de permettre la diffusion rapide, massive et économique de contenu ? Depuis 1990 (et la première page web), les utilisateurs mettent en ligne du contenu.

J’ai eu la chance de concevoir des services « à la sauce web 2.0 » dès 1998 : sites communautaires, applications en ligne, outils de travail collaboratif… Et je n’étais pas le seul ! Mais il faut bien avouer que deux choses ont freiné leur expansion : les connexions bas débit et l’inviolabilité de la sphère privée.

Tout le monde peut comprendre qu’avec un modem RTC qui charge une page web en 55 secondes, il est impossible d’avoir des services tels que YouTube. Quant à la sphère privée, il a fallu une bonne dizaine d’années pour que l’internaute s’habitue à publier (donc rendre public) quelques bribes de sa vie personnelle (avec les excès que l’on connait aujourd’hui…).

Finalement, pour moi, le « web 2.0 », c’est :

  • un coup marketing de maître !
  • la généralisation du haut débit
  • l’ouverture de la sphère privée

C’est tout. Enfin presque… J’ai oublié le seul point réellement nouveau dans le « web 2.0 » : Ajax (Asynchronous JavaScript and XML), rendu possible grâce à l’implémentation de XMLHttpRequest dans Internet Explorer (merci Microsoft !).

Ajax change tout, à commencer par la notion de page web. Comme le fait très souvent remarquer Frédéric Cavazza, peut-on encore utiliser le terme de page web, alors que le contenu et la forme évoluent par petites touches au sein d’une seule page ? Netvibes en est un bon exemple.

Nous en sommes à l’ère des single page applications (SPA). Ses effets révolutionnent notre manière de voir et de concevoir le web. Les ergonomes sont obligés de revoir toutes leurs préconisations. Ajax change nos méthodes de production, les éditeurs de code HTML (comme Dreamweaver) ont disparu et font place à des environnements de développement lourd. Ajax bouscule les habitudes chèrement acquises des internautes (on ne touche plus au bouton « Page précédente » du navigateur pourtant si pratique !). Ajax perturbe l’économie du web en faussant la mesure d’audience.

Ajax finira peut-être par tuer le web, en imitant toujours mieux le comportement des applications classiques. Il rendra inutile le navigateur web et favorisera l’émergence des RIA (Rich Internet Applications), puis des RDA (Rich Desktop Applications). Finalement, Ajax entraînera un retour aux sources de l’informatique grand public : un système d’exploitation, des applications locales, des interfaces riches.

A la différence que tous leurs éléments intrinsèques seront connectés à internet et dépendront de lui : WebOS, RDA, Widgets, SaaS. Le web sera, quelques temps encore, un protocole d’échanges de données entre machines, avant de disparaître…

Une bien belle histoire de la Grande-Bretagne

British History Timeline - BBC

La BBC propose une animation Flash très bien faite sur l’histoire de la Grande-Bretagne : British History Timeline.

Ce projet est intéressant car il représente, à mes yeux, un parfait compromis entre le contenu (complet mais synthétique), la forme (interface « léchée », dans l’air du temps mais relativement conventionnelle pour plaire à tous les publics) et l’interaction (outils de navigation simples mais pertinents, fluidité des comportements).

Un excellent travail !

Source : Christian Fauré

Les AudioCubes surfent sur la vague des objets communicants

Les AudioCubes

Après le JazzMutant Dexter que j’ai déjà présenté, voici encore un bon exemple d’interface innovante dans le domaine de la musique assistée par ordinateur (MAO) : les AudioCubes de la société belge Percussa.

Vendus par quatre, ces petits cubes permettent de contrôler des applications musicales (via le protocole d’échange MIDI, pour les connaisseurs). Même si la démonstration ne me semble pas à la hauteur du concept, elle est suffisamment limpide pour m’éviter d’écrire 50 lignes sur leur fonctionnement :


Les AudioCubes de la société Percussa.

Outre leur position respective, les AudioCubes gèrent leur rotation et la distance de la main par rapport à leurs faces. Autre détail ergonomique intéressant, la configuration des AudioCubes passe par une extension de l’application musicale habituellement utilisée. L’apprentissage se limite à la manipulation des AudioCubes !

Configuration des AudioCubes sous Ableton Live
Configuration des AudioCubes dans le séquenceur Ableton Live.

Ceux qui ont vu la Reactable de l’Université Pompeu Fabra de Barcelone me diront qu’il n’y a rien de nouveau, sauf que (comme pour le Dexter) les AudioCubes sont en vente. A 600€ les quatre, c’est même très tentant…


La Reactable, projet du MTG de l’Université Pompeu Fabra de Barcelone.

Ces interfaces montrent la tendance actuelle des objets communicants : des objets qui, isolés, répondent à des fonctions très basiques, mais qui, une fois reliés (virtuellement ou physiquement), révolutionnent les usages et rendent notre univers numérique plus tangible.

La musique n’est bien sûr pas le seul secteur à s’intéresser aux objets communicants et à leurs interactions. Les produits de Violet (créateur du fameux Nabaztag) ou de Ambient en sont de bons exemples actuellement. Les technologies Machine to Machine (M2M) ont de l’avenir !

Les enfants réservent toujours des surprises…

Comme beaucoup de parents, je suis employeur d’une assistante maternelle. L’Urssaf propose un service en ligne pour déclarer les salaires versés, sans avoir les compétences d’un expert comptable ou d’un directeur des ressources humaines.

L’idée est louable, encore faut-il bien connaître vos enfants. Ce qui n’est visiblement pas mon cas puisque je viens de découvrir que mon deuxième enfant est plus âgé que le premier. Sans doute l’effet d’un élixir de jouvence garanti pur OGM…

Bogue Pajemploi

Un petit bogue technique, soit. Mais totalement bloquant pour l’utilisateur ! Quelle case choisir ? Un joli exemple d’erreur technique basique qui conduit l’utilisateur dans une impasse.

Sacrés farceurs, à l’Urssaf !

Mise à jour :
J’ai obtenu une réponse de Pajemploi : il faut choisir la case qui affiche la date de naissance correcte.

Test d’interface : paiement d’amendes en ligne

La semaine dernière, j’ai reçu un joli papier (vert amende, bien sûr) me rappelant que la vitesse maximale autorisée sur autoroute est de 130 km/h. C’est agaçant (surtout pour un dépassement de 5 km/h sur une voie déserte) mais loin de moi l’idée de critiquer cette règle élémentaire de sécurité.

Vient l’heure de payer l’amende. Je ne suis pas un habitué du fait (c’est même une première), je fais donc l’effort de lire toutes les instructions. Ah tiens, on peut payer par internet ! Voilà l’occasion de tester une interface ! Ou comment prendre du plaisir à réaliser une tâche désagréable !

Un site dédié au paiement des amendes

Accueil amendes.gouv.fr
Page d’accueil du Service de télépaiement des amendes.

Le Ministère des Finances a mis en place un site dédié au paiement des amendes par carte bancaire. Pour protéger la transaction, la connexion entre le serveur et le navigateur web est cryptée (via SSL) et l’identité du service garantie par un certificat numérique.

Certificat SSL amendes.gouv.fr
Informations sur le certificat SSL.

Premier bémol : le certificat est émis par Verisign, entreprise privée américaine. Le Référentiel Général de Sécurité n’est donc pas encore en place.

L’accueil du service

La page d’accueil est des plus simples : un résumé pour expliquer le but du service, un lien pour y entrer et un autre pour quelques explications sur la sécurisation du site. Simple, clair (c’est vrai aussi qu’on n’arrive jamais sur ce site par hasard…), malgré un texte plutôt confus pour expliquer la transaction HTTPS.

Le code source est typique du web première génération : des textes en bitmap, des tableaux pour la mise en page, le tout généré par Dreamweaver (ses fonctions Javascript sont détectables entre mille) et FrontPage 6.0 (voir la balise META GENERATOR). Drôle de mélange, mais l’avantage est de rendre l’interface utilisable sous tous les navigateurs, même les plus anciens. On est loin du web 2.0, d’Ajax, du XHTML compliant, des CSS 2… mais aussi d’une interface accessible (au sens ergonomique).

Un petit tour du côté des requêtes m’indique que le service tourne sous Apache et que mes actions et leur traitement seront gérées par des scripts Java (le cookie de session trahit sa présence).

Saisie des informations

Saisie du numéro de l'amende
Saisie du numéro de l’amende.

Je passe à l’action. On me demande le numéro de l’avis d’amende et sa clé. Euh… il doit être tard, je ne vois rien de semblable sur le papier. J’ai bien un numéro d’avis de contravention mais pas d’avis d’amende. De plus, le formulaire web me propose 5 groupes de chiffres + la clé, la version papier n’a que 4 groupes de chiffres + la clé.

Heureusement, il y a une aide. Je fais abstraction du dictionnaire qui propose toutes les lettres de l’alphabet, alors que seules 8 lettres sont utiles… Les « pro » de la molette seront ravis ! Je clique donc sur « Où trouver mon numéro d’avis – Cliquez sur ce lien » (j’adore) et là, surprise ! Je vois bien les 4 cases de chiffres, comme sur mon papier. Je vois aussi à côté une version à 5 cases… Je sens que ça va être chaud.

Aide pour la saisie du numéro d'amende
Aide pour la saisie du numéro d’amende.

Survient le doute : vais-je pouvoir payer cette amende (pardon, contravention) en ligne ? Je tente le coup. Et j’ai bien fait : le premier groupe de chiffres détermine le type de contravention (forfaitaire, dans mon cas). Un petit Javascript élimine donc la cinquième case. Un autre se charge de déplacer le curseur de case en case. On tient le bon bout !

Informations liées à la contravention

Informations sur la contravention
Informations sur la contravention.

Le serveur fait son office et m’informe de mon avis de contravention. Cette page remplit son rôle, avec des textes concis et une fenêtre Questions / Réponses très utile.

Paiement de l’amende

Je passe au paiement. Une page me demande si je veux payer définitivement ou si je veux déposer une consigne (eh oui, si vous contestez la contravention, vous devez la payer avant de vous faire rembourser… éventuellement).

Paiement de l'amende (1)

Vient le formulaire tant attendu du paiement par carte bancaire. Là, on retrouve ses habitudes d’achat sur les sites e-commerce (adresse de livraison en moins…). Rien à dire, c’est bien fait.

Paiement de l'amende (2)

Je valide et j’obtiens un justificatif que je peux imprimer, sauvegarder, envoyer à une adresse e-mail ou recevoir par courrier. Dommage que ces options ne soient pas regroupées.

Paiement de l'amende (3)

La sauvegarde du justificatif sur ordinateur vaut vraiment le détour (un simple fichier texte contenant du code HTML illisible et sans aucun retour chariot). J’opte plutôt pour l’envoi par e-mail que j’obtiens aussitôt.

Conclusion

Ce petit jeu de cache-cache valait bien les 45 € que j’y ai laissés. Mais promis, je ne recommencerai pas.

Entrez en symbiose musicale avec le Dexter

S’il y a un secteur à la pointe de la conception d’interfaces, c’est bien celui de la musique assistée par ordinateur (MAO). Elle reste pour moi une source d’inspiration inépuisable qui garde, depuis 20 ans, une longueur d’avance sur les autres technologies informatiques.

Les produits de la société bordelaise JazzMutant en sont un exemple particulièrement démonstratif. Il s’agit de surfaces de contrôle qui pilotent des applications musicales, telles que des séquenceurs, des synthétiseurs ou des instruments virtuels.

Je vous propose une petite comparaison :


Démonstration du projet FTIR par Jeff Han.

Tous les ergonomes et concepteurs d’interfaces ont en tête cette démonstration époustouflante de Jeff Han avec son écran tactile multi-touch. Le problème, c’est que nous n’avons pas encore cette merveille sur nos bureaux…

Le Dexter, dernier produit de JazzMutant, fait moins de bruit (sur le web, pas sur scène), mais il est en vente ! Son écran tactile (lui aussi multi-touch) permet de contrôler la musique en temps réel, avec une grande liberté d’expression et d’interprétation.


Démonstration du Dexter au salon Musik Messe 2007.

Le moindre détail de l’interface est travaillé. Chaque élément est à sa place, le tout est optimisé pour une utilisation en milieu sombre (sauf peut-être la réflectivité de l’écran), tout semble si naturel… C’est devant ce genre de produit que je dis : « Wouah ! »

Bad Usability Calendar, 12 erreurs ergonomiques sous nos yeux

Bad Usability Calendar 2007 (capture)

Ce n’est pas vraiment une nouvelle fraîche, mais je voulais garder une trace de cette bonne idée dans mon blog (la version papier que j’ai sur mon mur n’étant pas assurée de passer l’année !).

Bad Usability Calendar 2007 est un excellent concentré des erreurs ergonomiques que l’on trouve dans les interfaces web. Tout le monde en prend pour son grade, aussi bien les développeurs que les webdesigners.

J’espère que les prochaines éditions suivront l’évolution des outils et des interfaces pour voir en un clin d’oeil le chemin parcouru d’année en année.

» Bad Usability Calendar 2007 au format PDF (format A4 – 1,2Mo)