FredCavazza.net

Souvenez-vous, il y a quelques temps je vous parlais de Songza, un moteur de recherche musicale avec un concept très intéressant d’interface transparente.

Et bien figurez-vous que la fondation Mozilla vient d’annoncer qu’elle avait recruté une grosse partie de l’équipe de Humanized, la société à l’origine de Songza : Mozilla Hires Humanized Founders. Parmi les personnes recrutées, il y a (entre autres) Aza Raskin le fils de Jef Raskin, une pointure de la conception d’interfaces.

C’est une très bonne nouvelle dans la mesure où les équipes de Humanized sont également à l’origine d’un produit remarquable : Enso Launcher qui permet de lancer tout un tas de commandes à partir de commandes au clavier. Je vous recommande à ce sujet la démonstration vidéo ainsi que cet article : Enso est une merveille.

Il y a fort à parier que les personnes recrutées chez Humanized vont travailler sur des améliorations portées à l’interface de Firefox (peut-être pour la version 4 ?).

Je vous propose de découvrir un concept qui me tient à cœur : la simplexité (contraction de simplicité et complexité). Pour faire simple, la simplexité est un art qui consiste non pas à simplifier un produit complexe, mais plutôt à rendre à priori simple un produit qui ne peut pas être simplifié sous peine de ne pas remplir sa fonction.

La première fois que j’ai entendu parler de ce terme c’était chez Renault où un réel effort est déployé pour améliorer le confort d’utilisation et la lisibilité des tableaux de bord (SVP pas de troll dans les commentaires). Mais cette notion s’applique à de multiples domaines comme le design (exemple ici : Quand les constructeurs de l’EGP misent sur le design), l’art (notamment avec des artistes comme Constantin Brâncuşi) ou encore le managment (Manager soyez dans l’art de la simplexité).

C’est d’ailleurs de ce dernier article que je tire une première définition : “Art qui consiste à rendre simple les choses compliquées et à vulgariser le monde dans le but de le mettre à la portée de tous“.

Appliquée à la conception d’interfaces web, qu’est-ce que ça pourrait bien donner ? Voilà ce que je vous propose : “Une interface à la simplicité apparente pour un service à la complexité induite“.

Illustration avec Gmail et son interface de rédaction d’un email : les options sont nombreuses (car c’est comme ça que les systèmes de messagerie fonctionnent) mais les équipes de Google ont trouvé l’astuce en masquant un maximum de choses.

Regardez bien cette copie d’écran, à gauche la version initiale (à l’ouverture de la page) et à droite la version complète (avec toutes les options déployées) :

L’impression de simplicité à l’ouverture de la page est réelle, par contre en cliquant sur différents liens on s’aperçoit que toutes les options sont bien là. Et voilà : simplicité apparent pour un service à la complexité induite.

Et vous, ça vous inspire quoi ?

Après quelques années de tyrannie artistique imposée par les poids lourds de l’audience que sont devenus les MySpace, Skyblogs et autres monstruosités ergonomiques, je constate un retour au minimalisme dans la mise en page des blogs.

Petite sélection avec Scripting News :

AntiBlog :

Design a Day :

Design for Service :

Garrett Dimon :

Certains pourraient dire que c’est la faute de Twitter et que bientôt nous adopterons un format bien plus minimaliste à l’image du mini-blog :

Je suis personnellement grandement admiratif de la mise en page de Scripting News (surtout le traitement des archives et de la pagination), même si ce blog est truffé de code javascript qui n’apporte pas grand chose. Et vous ?

Connaissez-vous les schémas de conception ? Mais si enfin, les design patterns : ce sont des principes de conception qui servent à résoudre des problèmes récurrents (affichage et manipulation d’une liste, sélection multiple… cf. la définition de Wikipedia : Patron de conception).

Quand on parle de schémas de conception dans le cadre d’une interface, ils prennent la forme de petits éléments d’interface qui servent à composer un écran. Pour faire simple, les schémas de conception sont les mots du concepteur qui servent à rédiger les phrases (les écrans) d’un livre (un site).

Et où trouve-t-on une description du vocabulaire du concepteur ? Mais dans un dictionnaire bien sûr !J’en arrive donc au sujet de mon billet, le très bon livre Designing Interfaces.

Ce livre, ainsi que le site qui l’accompagne est une véritable mine d’or : sont présentés un ensemble de schémas de conception très bien décris et détaillés.

Un livre que je recommande à tout concepteur d’applications ou d’interfaces riches, en complément du toujours très bon Pattern Library for Interaction Design (avec une nouvelle version du site) et de l’indispensable Yahoo! Design Pattern Library.

Et tant que j’y suis, pour parfaire votre culture des interfaces et savoir d’où l’on vient, je ne saurais que trop vous recommander l’incroyable, le formidable, le stupéfiant Designing Interactions (sans doute le meilleur livre sur l’interactivité jamais écrit).

Incroyable, alors que l’on croyait qu’Adobe avait réduit au silence les équipes de Macromedia, nous assistons à une véritable avalanche de nouveautés et d’annonces fracassantes de la part d’Adobe (plus d’infos ici : Adobe MAX : une chaude actualité autour des technologies riches).

Dernière annonce en date : le lancement prochain de Thermo, un outil de création d’interfaces riches.

Il s’agit en fait d’un atelier de conception qui permet de créer des applications riches en Flex (donc en Flash). Là où ça devient intéressant c’est que cet outil permet de récupérer et de manipuler de façon native des fichiers sources provenant de Photoshop, Illustrator… (et notamment les layers) :

Encore plus intéressant, les objets dessinés à la main peuvent être convertis en objets dynamiques (par exemple une simple boîte peut devenir un champ texte) :

Pour celles et ceux qui savent lire entre les lignes, ce Thermo pourrait potentiellement devenir l’arme ultime pour faire du prototypage rapide d’interfaces riches.

Plus d’infos ici :

• Adobe Demos “Thermo” RIA Design Tool to Delighted Crowd
• Adobe Thermo: Building Flex’s RIAs Gets Easy

Autant vous dire que je suis surexcité à l’idée de récupérer une version d’évaluation !

Les architectes de l’information et autres concepteurs qui ont déjà essayé de normaliser leur travail (arborescence, cas d’utilisation, diagrammes fonctionnels…) savent à quel point il est délicat de vouloir adopter un minimum de formalisme.

Pour faire simple : les concepteurs d’applications ont UML (entre autre), les concepteurs d’interfaces eux n’ont pas grand chose ! Il y a bien le Visual Vocabulary, mais il date de 2002 !

Heureusement qu’Alex Jongman est là pour nous pondre le Universal Information Architecture Modeling Language : UiaML.

Ce projet (qui a été présenté lors de l’EuroIA 2007) n’en est qu’à ses premiers pas mais on devine déjà une forte ambition pour pouvoir faire émerger quelque chose de constructif. Il existe déjà un certain nombre de low fidelty patterns comme cette représentation d’un champ texte :

Dans le même ordre d’idée il existe également le Graphical User Interface Modeling Language (qui visiblement n’a pas beaucoup évolué ces dernières années).

Difficile pour l’instant de se prononcer sur l’intérêt d’un tel formalisme dans notre profession. Le plus sage est encore de voir comment va s’enrichir ce langage et surtout de le tester sur des projets pour éprouver son utilité réelle.

L’ergonomie artistique est un terme barbare qui désigne les expérimentations d’interfaces alliant des critères d’utilité (accès à l’information) et d’esthétisme (de l’art numérique). Donc pour faire simple, ce sont des sites qui explorent d’autres modes de représentations et de manipulation des données.

Illustration avec trois exemples de réalisations de Jonathan Harris.

Phylotaxis, une interface de découverte de news par nuages de vignettes :

We Feel Fine, un aggrégateur / navigateur d’états émotionnels :

Universe Daylife, un agrégateur de news permettant de filtrer l’actualité selon des stages :

Pour ceux que ça intéresse, je tiens à préciser que l’auteur de ces applications (Jonathan Harris) est un surdoué, un visionnaire, un demi-dieu des IHM. Pour en savoir plus sur son travail, je vous recommande cette stupéfiante vidéo : The Web’s secret stories.

Ce Jonathan Harris en question est également à l’origine du projet Yahoo Time Capsule :

Et puisque l’on parle de Yahoo!, je vous recommande également de visiter le site de la Yahoo! Design Innovation Team qui elle aussi réalisée un certain nombre d’expérimentations visuelles très intéressantes.

Yahoo! Traffic Map, une représentation en temps réel du l’état du trafic :

Flickr Lens, une visualisation géospatiale des contributions à Flickr :

Yahoo! Answers Clouds, une autre représentation spatiale des contributions à Yahoo! Answers :

Dans la même série, je peux enfin (ouf !) vous recommander de jeter un oeil aux expérimentations du Digg Labs.

Face à autant de talent, je ne peux que m’incliner devant ces superbes réalisations qui nous font découvrir de nouvelles possibilités de représentation et de manipulation.

Tout ça me rappelle Digiquaria dont j’avais déjà parlé il y a trois ans : ça sert à rien, mais qu’est-ce que c’est beau !

Connaissez-vous oSkope ? Il s’agit d’un moteur de visualisation des résultats de recherche en provenance de sites marchands (Amazon, eBay) ou de sites de partage (FlickR, YouTube).

Les résultats de recherche peuvent ainsi être présentés sous forme de grille, pile, bazar, liste ou encore graphique.

Ici le mode stack :

Et ici le mode graph :

Voici donc une expérience intéressante à mi-chemin entre Kartoo et les expérimentations visuelles de Jonathan Harris (We Feel Fine, Universe…).

(merci à François pour le lien)

Aviez-vous remarqué l’apparition de menus contextuels (clic droit avec votre souris) dans Google Docs :

Une implémentation intéressante dans la mesure où :

•  cet usage est très intuitif car lié à la façon dont nous manipulons les applications hors-ligne ;
• les fonctions proposées sont répliquées en haut d’écran (pour que l’application reste opérationnelle avec ceux qui ont des problèmes de compatibilité) ;
• le traitement graphique est d’une sobriété exemplaire (des icônes pour faciliter le repérage, des séparateurs pour un regroupement logique).

Bref, ce n’est pas neuf mais encore une fois très bien exécuté par les équipes de Google. Espérons que ces menus contextuels seront bientôt présents dans une prochaine version du Google Web Toolkit. (via Google Operating System)

Voilà une semaine que l’iPhone a été lancé aux États-Unis, les rumeurs parlent de près de 700.000 unités écoulées (gloups !). Ce lancement sur-médiatiséé a généré beaucoup de bruit (on parlait plus de buzz autour de l’iPhone que de l’iPhone !). Je ne retiendrais de cette cacophonie que ce dessin humoristique trouvé sur Marketing Hipster :

Je vous propose de prendre un peu de recul et d’essayer d’élargir le champ de vision avec ces quelques liens :

• Apple évangélise sur les principes de design d’interface pour l’iPhone, où il est question de la communauté qu’Apple est en train de créer autour de la conception d’applications mobiles (RMA ? Mobile widget ?) : Apple Developper Connection ;
• What Will iPhoneDevCamp Accomplish?, qui parle de la convention des développeurs iPhone qui va se tenir la semaine prochaine ;
• Apple dépose un brevet pour une souris Multitouch, où il est question de la future souris Apple qui intègrera probablement une zone tactile ;
• Hackers Dissect The iPhone où des hackeurs s’amusent à autopsier un iPhone ;
• Flash Player on the iPhone où il est question d’une première mise à jour de Safari Mobile ;
• OpenLaszlo and the iPhone (comme quoi ça urge d’implémenter Flash !) ;
• Apple Applies for Patent for Simplified Cellphone with Click Wheel (à peine sorti, on prépare déjà son remplaçant) ;
• The iPhone Returns, or The Return of the iPhone (à peine acheté, certains le rende déjà) ;
• Nokia N800 does what iPhone doesn’t (juste histoire de créer la polémique) ;
• iPhone launched in Second Life (le canular du jour).