billets

Catégories

Le pouvoir des pictogrammes

J'aime bien les pictogrammes. Partout où j'en vois, j'essaie de les photographier (surtout en voyage).

En voici que j'ai vus sur une affiche près d'un cours d'eau en Europe. Comme quoi pas besoin de parler la langue pour comprendre ce que ça signifie... Respect! ;-)

Respect.jpg

Noël : un super déclencheur

Ceux qui ont assisté à ma formation ou lu mon livre savent que les déclencheurs occupent une place importante dans la conception d'un site.

Bien entendu, pour ceux qui ne l'auraient pas encore remarqué (!), Noël est à nos portes. Impossible d'y échapper. À la radio, à la télé, dans les journaux, sur le Web, c'est « beurré Â» Noël à la grandeur.

Voici quelques pages d'accueil bien faites en ce temps des fêtes :

AppleNoel.jpg

DellNoel.jpg

Orientation urbaine

Lors d'un précédent voyage en Europe, j'ai photographié une solution toute simple de navigation et d'orientation urbaine : un plan « imprimé Â» sur le trottoir, près des intersections principales.

MapTrottoir.jpg

Belle idée !

Erreur de syntaxe?

Je me suis procuré récemment une étude sur le site de UIE. Au moment de compléter le formulaire où je devais inscrire mon code postal, j'ai eu droit à ce drôle de message :

CheckSyntax.jpg

Ce message m'est apparu parce que j'ai mis (ou omis) une espace* dans mon code postal. Or, l'ajout ou l'omission d'une espace dans un champ formaté ne devrait jamais être considéré comme une erreur.

Aussi, m'indiquer que j'ai fait une erreur de syntaxe ne m'aide pas beaucoup. Un message du genre « Please enter your postal code with/without a space. For example: G0A2Y0 Â» m'aurait été plus utile.

Comme quoi, même les meilleurs peuvent en échapper parfois...



* « Espace Â» est féminin lorsqu'employée pour désigner le caractère d'imprimerie et par extension, d'affichage à l'écran.

Pour tout savoir sur Philippe Starck

La revue française IDEAT consacre son édition du mois de mai 2008 (encore en kiosque) au célèbre designer Philippe Starck.

À lire absolument pour en savoir plus sur ce fascinant personnage.

Ideat.jpg

L'art de vendre des rasoirs selon Philips

Le site Shave Everywhere (Second Puberty) de la compagnie Philips est un petit bijou d'imagination, d'humour, de simplicité et de communication directe.

Shave Everywhere de Philips

Prenez bien le temps d'explorer ce site typiquement « hommes Â» et observez comment Philips nous transmet habilement et avec humour son message « Ã€ bas les poils! Â». Tout à fait hilarant =).

Vu à San Francisco ... jamais vu à Québec (2)

gazon.jpg fleurs.jpg

Du gazon (vert!) et des fleurs à la fin du mois de janvier... ça fait du bien =).

Vu à San Francisco ... jamais vu à Québec (1)

Distributrice d'iPods

Oui, oui, vous avez bien vu. Il s'agit d'une machine distributrice d'iPods. Cool ;-)

La vraie nature de l'hyperlien

Je cherchais quoi faire à Montréal ce dimanche dernier. J'ai donc été visiter le site de Tourisme Montréal pour tenter d'y trouver quelque chose.

J'ai été assez surpris de constater qu'en cliquant l'hyperlien d'une date du calendrier, on ne voyait pas s'afficher une liste d'activités.

Calendrier de Tourisme Montréal

Ce n'est qu'après quelques essais que je me suis aperçu que les hyperliens du calendrier souffraient d'un sérieux problème d'identité : ces hyperliens ne permettent pas de naviguer, ils permettent de sélectionner une ou plusieurs dates. Il faut cliquer sur le bouton « Résultats par date Â» pour en afficher les activités (!).

On peut résoudre ce problème de deux façons. 1. En simplifiant le calendrier en lui enlevant les fonctionnaliltés de sélections multiples, ce qui fait qu'en cliquant sur l'hyperlien d'une date, on en voit les activités. 2. En s'inspirant du calendrier de Google Analytics si on veut offrir la totale... mais est-ce vraiment nécessaire?

Calendrier de Google Analytics

100 fois sur le métier...

En fouillant dans des caisses de vieux magazines datant du précédent déménagement (en 2005), j'ai retrouvé cet article que j'avais publié en 1993 dans le défunt Info-Tech Magazine.

Fait amusant, je tiens aujourd'hui essentiellement le même propos qu'à l'époque, avec les nuances et l'expérience en plus (et les cheveux en moins ;-). Certains pourraient se décourager de répéter sans cesse le même propos, ce qui n'est pas mon cas. J'ai d'ailleurs souvent pensé que je devrais rajouter le titre « Ã©vangéliste Â» sur ma carte d'affaires, comme l'avait fait jadis Guy Kawasaki lorsqu'il oeuvrait pour la célèbre compagnie de Cupertino en Californie.

Voici l'article en question (PDF : 2,4 Mo, 1 page).

101 Choses apprises à l'école d'architecture

Matthew Frederick a publié chez MIT Press un petit livre présentant et illustrant 101 choses à connaître en architecture. 101 choses qui s'appliquent aussi, pour la plupart, à la conception d'interfaces utilisateurs.

À 12 $ CDN, 101 Things I Learned in Architecture School est une aubaine!

101_Things.jpg

Pour maximiser l'espace

J'aime bien la façon de faire des concepteurs du site d'Apple sur cette page. Grâce à des « tiroirs Â», Apple peut présenter plusieurs sujets et même les illustrer tout en occupant peu d'espace écran. C'est simple et élégant! Je crois que je vais proposer ce concept à un de mes clients.

Tiroirs

En effet !

« If Ernest Hemingway, James Mitchener, Neil Simon, Frank Lloyd Wright, and Pablo Picasso could not get it right the first time, what makes you think that you will? Â»
- Paul Heckel

Sketching User Experiences : à lire absolument !

Page couverture de Sketching User Experiences de Bill Buxton

Il y a des livres qu'on achète, qu'on commence à lire puis qu'on ne termine pas. Et il y a ceux qu'on dévore littéralement (p. ex. le Da Vinci Code de Dan Brown). L'ouvrage que vient de publier Bill Buxton est dans cette deuxième catégorie. Wow ! Quel livre !

Je ne suis rendu qu'à la moitié et je peux d'ores et déjà affirmer qu'il s'agit du meilleur livre de réflexion sur le design que j'ai lu.. et c'est loin d'être mon premier.

Buxton a réfléchi, a du vécu, a beaucoup lu (quelle extraordinaire bilbliographie) et a échangé avec plusieurs designers influents. Ce qui fait de ce livre une référence unique et un point de départ pour une vraie réflexion sur ce qu'est le design.

Voici trois extraits clés :

  • « ... in order to design a tool, we must make our best efforts to understand the larger social and physical context within which it is intended to function. Â»

  • « Sucessful execution of a design depends on communication, and capturing the design rationale is an important component of this. Â»

  • « The design that I want to talk about goes beyond the object and cannot be thought of independent of the larger physical, emotional, social, and experimental ecology within which it exists. Â»

À lire absolument !

It's not what the software does...

J'aime bien les illustrations de Hugh MacLeod qui sont publiées sur son site gapingvoid. Adoptant parfois, voire souvent, un ton plutôt caustique, MacLeod sait communiquer clairement son message comme l'illustre le dessin suivant :

Gapingvoid_1.jpg

Celui-ci est aussi fort à propos :

Gapingvoid_2.jpg

Sociable Media Group

Encore sous l'effet du dernier CHI, je visite ces jours-ci les sites Web des présentateurs que j'ai eu le plaisir d'entendre à San Jose.

Je tenais à vous signaler le site du Sociable Media Group du MIT. Regardez la liste de leurs projets... wow ! Ce sont des projets comme ça qui me donnent parfois l'envie de faire de la recherche... appliquée, bien entendu =).

Google Analytics v2 : Wow !

Je viens d'utiliser la dernière version de Google Analytics ... Wow !!!
Quelle interface élégante, auto-explicative et simplifiée. Tufte devrait aimer... moi, j'adore =).

> Complément de lecture (en anglais)

Conception et crédibilité

Tout (ou presque) sur le site de Nadeau Air Service, une entreprise de transport et de formation en aviation, contribue à diminuer sa crédibilité. Et s'il y a un domaine où on doit inspirer la confiance, c'est bien dans celui de l'aviation !

La mise en page (!), le choix des couleurs (!), le choix des polices de caractères (!), la qualité des images (!), les faux hyperliens et les multiples fautes de français sont autant d'éléments qui ébranlent la confiance d'un éventuel client ou élève.

C'est simple. Vous voulez savoir tout ce qu'il ne faut pas faire ?
Étudiez attentivement ce site et vous saurez !

Des icônes de tailles différentes dans une même fenêtre

Lu ce matin sur AppleInsider : « Apple's Mac OS X may gain multi-sized icon interface Â».

Dans une prochaine version du Finder du Mac OS X, on pourrait avoir des icônes de tailles différentes dans une même fenêtre afin de représenter leur importance relative. Comme quoi les bonnes idées peuvent être fort simples !

Mes livres préférés en utilisabilité

On me demande régulièrement quels sont les ouvrages à lire pour se familiariser avec le domaine de l'utilisabilité (ou de l'ergonomie des interfaces utilisateurs si vous préférez). Les voici :

1. About Face 2 : The Essentials of Interaction Design d'Alan Cooper. C'est en quelque sorte la bible en matière de conception d'interfaces utilisateurs.

2. Don’t Make Me Think! de Steve Krug. Un ouvrage court, clair, facile et agréable à lire. Un must!

3. Design Research : Methods and Perspectives de Brenda Laurel. Une excellente référence pour apprendre à connaître l'utilisateur.

4. Things That Make Us Smart — Defending Human Attributes in the Age of the Machine de Don Noman. C'est sans aucun doute son ouvrage le plus intéressant (il ne vous est pas interdit d'acheter ses autres livres).

5. Usability Engineering de Jakob Nielsen. C'est son meilleur livre. Vous pouvez aussi lire Designing Web Usability que tout le monde ou presque a lu. Ce dernier n'est pas mauvais, mais il faut parfois prendre certaines recommandations drastiques avec un grain de sel.

Bien entendu, il y a d'autres auteurs importants. On n'a qu'à penser à Edward Tufte, Ben Shneiderman, Jesse James Garrett, Bruce Tognazzini, Carolyn Snider, JoAnn Hackos, Janice Redish, et j'en passe.

Ah oui, j'allais oublier (!). Il y a aussi mon livre, Le design Web raisonné : 3 étapes pour concevoir l'expérience client, qui n'est pas mal non plus =).

Sur ce, bonne lecture !

Le site du lapin

Je vous ai déjà parlé du lapin interactif Nabaztag dans mon billet du 8 novembre 2005. Je suis retourné visiter le site dudit lapin et je dois avouer que ce que j'y ai vu m'a plu.

Page d'accueil de Nabaztag

La mise en page est sobre et enjouée... comme le lapin. Le vocabulaire utilisé est on ne peut plus clair afin de répondre aux questions des éventuels acheteurs. Par exemple, on y retrouve « Comment ça marche ? Â», « Que sait-il faire ? Â», etc. Le ton est dynamique et drôlement efficace.

En règle générale, je ne suis pas fou de la musique et des animations sur une page d'accueil. Cela dit, dans le contexte de ce produit, c'est tout à fait acceptable voire recommandable.

Photos de Suède

J'ai téléchargé quelques photos prises la semaine dernière à Stockholm et Göteborg sur Flickr.

Bon visionnement !

Un « teaser » amusant

ComeClean.jpg

La compagnie de produits de nettoyage Method a trouvé un moyen amusant d'attirer notre attention par l'entremise d'une petite application (en Flash) qui permet de « laver Â» nos péchés. Amusant !

PS : Remarquez la simplicité et l'efficacité de la mission de cette compagnie qui tient en trois mots : « people against dirty Â». C'est Guy Kawasaki qui serait content !

Des compétences et des barres

Sur son site (en Flash), Tom Nulens a eu la brillante idée de présenter son degré de connaissance des logiciels et des langues en utilisant des barres horizontales.

cv_barres.jpg

C'est simple. C'est efficace. C'est compréhensible. Bravo !

La simplicité selon Maeda

LawsOfSimplicity.jpg

Pendant mes quelques jours passés à Boston (pendant les vacances), je suis bien entendu passé par le Harvard COOP Bookstore où j'y ai acheté entre autres, « The Laws of Simplicity Â» de John Maeda.

En 100 pages, Maeda nous présente ses réflexions, parfois philosophiques, sur la simplicité par l'entremise de 10 lois et de trois « clés Â». À première lecture, je dois avouer que je suis quelque peu resté sur ma faim. Peut-être parce que j'avais lu d'autres ouvrages sur le sujet dont le particulièrement intéressant « Simplicity Â» d'Edward de Bono.

Cependant, après relecture, il y a dans ce petit livre quelques réflexions fort intéressantes qui valent les 20 $ CDN qu'il m'en a coûtés. Par exemple :

« ... nothing is an important something. The opportunity lost by increasing the amount of blank space is gained back with enhanced attention on what remains. Â»

« When any interaction with products or service providers happens quickly, we attribute this efficiency to the perceived simplicity of experience. Â»

Intéressé ? Achetez son livre et visitez le blogue.

Une image forte vaut parfois mille mots

VisuelMontreal.jpg

L'image principale de la page d'accueil du site de la ville de Montréal de cet été est un exemple de bonne communication visuelle. En un coup d'oeil, on comprend qu'en été, Montréal est la ville des festivals. Cette image varie selon les saisons et les événements ... bravo !

De retour !

Après 3 semaines de repos, me voici de retour !

Question de recommencer en douceur ... et avec le sourire, je vous invite à visiter le site de la municipalité de Saint-Cyprien.

St-Cyprien.jpg

J'ai lu sur le site de la conceptrice que « Ce site a été primé pour son originalité en recevant le prix "Coup de coeur" de la Toile du Québec Â».

Certes, les règles de l'art ne sont pas toutes rencontrées, l'esthétique est discutable et la trame sonore est... difficile à qualifier. Bref, je n'aurais jamais fait un pareil site.

Ceci dit, l'aspect artisanal de ce site lui confère un petit côté sympathique qui illustre sans doute le milieu de vie sans prétention de cette municipalité.

Esthétique VS utilisabilité

Une collègue m'a transféré une réponse à une question posée sur un babillard concernant la beauté des sites. Voici un extrait de cette réponse : « Il est important que vous sachiez qu'un site beau n'est pas nécessairement un site qui vend. C'est même dans la plupart du temps l'inverse... Un site qui vend est un site au design soigné, adapté à votre clientèle, et surtout ergonomique. Â»

Je dois vous avouer que je suis plus ou moins d'accord avec cette réflexion simpliste. Certes, pour qu'un site de commerce électronique « vende Â», il faut que ce dernier ait un design soigné, qu'il soit adapté à la clientèle et soit ergonomique. Je suis tout à fait d'accord avec cette partie de la réponse. Cependant, plusieurs études récentes ont démontré une dépendance très forte entre l'ergonomie et l'esthétique. Qui plus est, l'utilisabilité anticipée ainsi que l'utilisabilité réelle sont directement influencées par le visuel (couleurs, typographie, mise en page, images).

En résumé, on ne doit pas favoriser l'esthétique au détriment de l'utilisabilité mais l'inverse est aussi vrai. On doit viser un savant mélange des deux.

Vous n'avez pas besoin de la fonction "bacon" sur votre four micro-ondes

Lu dans le cahier Actuel de la Presse du samedi 29 avril 2006 :

Vous n'avez pas besoin de la fonction "bacon" sur votre four micro-ondes. Et vous n'avez pas non plus besoin de neuf possibilités de température, sur votre réfrigérateur. Pas plus que cinq sur votre séchoir à cheveux. Inutile aussi, le réglage "lin" sur votre fer à repasser, ou le bouton "heure d'été" sur votre réveille-matin. Votre appareil photo numérique comprend une multitude de fonctions que vous n'utiliserez jamais, pour la simple raison que vous n'essaierez jamais de photographier une coccinelle, la nuit, sur une mer déchaînée. Et on ne parlera pas de votre téléphone cellulaire, ni du tableau de bord de votre voiture, ni même de votre montre. Le monde moderne est une orgie d'options que nous n'utiliserez jamais, parce que vous n'en avez tout simplement pas besoin, et que de toute façon, vous n'avez pas le temps d'apprendre comment elles fonctionnent, au juste.

Merci à la Presse d'aussi bien résumer ma pensée en matière de design =).

Pour les nostalgiques

Le site du groupe The Raconteurs fondé par le guitariste Jack White des Whites Stripes me rappelle ce bon vieux Apple IIe que j'ai utilisé lors de mon premier emploi d'été lorsque j'étais étudiant en informatique.

The Raconteurs

Force est d'admettre que cette interface avait un certain « charme Â» ... une forme d'interaction à redécouvrir !

Un nouveau livre à vous procurer

DesigningInterfaces.jpg

Jenifer Tidwell vient tout juste de publier un excellent livre sur la conception d'interfaces utilisateurs : Designing Interfaces.

Cet ouvrage de plus de 300 pages documente 94 patterns (recettes) de conception de façon simple, illustrée et pratique. Voici la table des matières :

  • 01. What users do
  • 02. Organizing the content: information architecture and application structure
  • 03. Getting around: navigation, signposts and wayfinding
  • 04. Organizing the page: layout of page elements
  • 05. Doing things: actions and commands
  • 06. Showing complex data: trees, tables, and other information graphics
  • 07. Getting input from users: forms and controls
  • 08. Builders and editors
  • 09. Making it look good: visual style and aesthetics

À mettre sur votre liste d'achats !

N'inventez pas l'autre, découvrez-le !

J'ai entendu cette magnifique phrase pendant l'exposé du professeur Yves Negro à un séminaire traitant du développement commercial multicanal présenté à l'ENAP cette semaine.

Cette maxime s'applique autant au monde réel (p. ex. une institution financière) qu'au Web. N'inventez pas les utilisateurs, découvrez-les en prenant le temps de les observer, de les rencontrer et d'échanger avec eux. Comme l'a déjà dit David Kelley, fondateur de la célèbre firme de design industriel IDEO : « Le design, ça commence sur le terrain et non dans un bureau ! Â».

Pour consulter les oeuvres de Léonard, Wolfgang et cie

Dans Turning the pages, la Bristh Library offre la possibilité de consulter quelques pages de livres et de manuscrits de Léonard de Vinci, Mozart, et autres personnalités historiques.

L'interface conçue à l'aide de Macromedia Director (accessible via le plugiciel Shockwave) est d'une belle élégance :

Manuscrit Léonard de Vinci

On y trouve une loupe, pour pouvoir mieux apprécier l'oeuvre. Un texte nous donne des détails sur les pages en question en plus d'en offrir une version audio. Aussi, selon la nature du document, on a accès à un outil spécialisé.

Par exemple, dans le cas des notes de Léonard de Vinci (Shockwave, volumineux), on peut afficher le texte en mode "miroir", ce qui est utile quand on sait que de Vinci avait l'habitude d'écrire de cette façon.

Outils de Vinci

Dans le cas des partitions de Mozart (Shockwave, volumineux), on peut y entendre la musique.

Outils Mozart

Je dois cependant signaler deux éléments négatifs :

1. Ce n'est pas toujours facile de tourner la première page puisqu'on nous indique de le faire avec la souris. Je dois avouer avoir éprouvé une certaine frustration pour accéder au cahier de Léonard de Vinci.

2. On ne sait pas combien il y a de pages au total avant d'être rendu à la dernière.

Ceci dit, bravo pour cette belle application Web !

Interface de la Xbox 360

Dans un article (PDF : 2,7 Mo, 1 page) paru dans Create Magazine, on y lit que la firme qui a élaboré l'interface utilisateur de la Xbox 360 a utilisé les personnages* dans son approche de conception.

Interface de la Xbox 360

Bravo !

* personnage : modèle de l'utilisateur orientant la conception de l'interface utilisateur

Histoire de moutons

Ceux qui ont suivi ma formation sont au fait de mon aversion face aux focus-groupes qui n'apportent pas grand chose à la conception d'une interface utilisateur puisqu'ils produisent essentiellement des opinions...

Ceci dit, dans son texte paru en pages A2 et A3 de la Presse de ce dimanche 20 novembre 2005, le chroniqueur Pierre Foglia a écrit un paragraphe qui m'a fait sourire. Pour vous mettre en contexte, M. Foglia a rencontré un québécois, ancien cadre d'une agence de communication devenu berger à le Touyet, en France. Voici donc ce qu'il écrit :

"Parlant de troupeau pas très allumé, et ceci n'est pas une question mais un petit commentaire, je m'en excuse d'avance, vous m'avez bien dit que vous étiez spécialiste en focus-groupe ? Me semble que, finalement, vous n'avez pas changé de job tant que cela ?"

Ouch !

Persona Non Grata (!)

Dan Saffer de l'équipe de Adaptive Path a publié un essai intéressant sur les personnages intitulé "Persona Non Grata".

En résumé, il dit que pour être efficaces, les personnages doivent être le fruit d'enquêtes utilisateurs et non pas celui de l'imagination des concepteurs d'interfaces.

Tout à fait d'accord ! (voir mon billet du 18 novembre 2004)

Pour tout savoir sur l'histoire des interfaces utilisateurs graphiques

Vous vous intéressez à l'histoire des interfaces utilisateurs graphiques de Windows, MacOS, Newton, BeOS et les autres ? Je vous invite à visiter le site de GUIdebook Gallery.

Vraiment fascinant !

Pour les jeunes et les moins jeunes, voici de quoi avait l'air l'interface du Mac OS 7. Que de souvenirs !

Desktop du MacOS 7

Utilisabilité amazonienne

Dans sa dernière chronique, Jakob Nielsen dit ce qu'il pense de l'utilisabilité de la librairie en ligne Amazon.

Je suis plutôt d'accord avec lui.

Définition du design

Il n'y a rien de tel, entre deux révisions d'un livre qui va finir par être publié (en août de cette année), de lire un autre livre qui attendait patiemment sur une des tablettes de ma bibliothèque.

C'est ainsi en lisant "Histoire du design, 1940-2000" de Raymond Guidot que je suis tombé sur une définition du design de Roger Tallon qui, ma foi, est fort éloquente :

"Ce n'est ni un art, ni un mode d'expression, mais une démarche créative méthodique qui peut être généralisée à tous les problèmes de conception."

Bien dit !

Design narcissique 2

Voici un autre bel exemple de design narcissique en Flash qui a tendance à provoquer la nausée. Pour voir le détail d'une image en particulier sur le site Vivre à Paris, il faut cliquer sur cette dernière. Or, chaque image ne cesse de bouger.

Ç'a peut-être l'air "cool" mais ce n'est vraiment pas facile à utiliser. Ça m'a pris 3 fois avant de pouvoir cliquer sur la salle de bain... elle passait son temps à se cacher derrière la chambre à coucher (!). Dommage d'avoir gâché ce site qui, à la base, est correct.

Vivre à Paris.jpg

Design narcissique

Lu dans le cahier Actuel de la Presse du samedi 14 mai 2005 :

Presse du 14 mai 2005

En effet !

Les gourous et leurs sites : ça fait dur !

Je viens de lire une étude comparant les sites Web des gourous (Nielsen, Norman, Wurman et cie) avec ceux d’autres concepteurs Web.

Ça confirme ce que plusieurs pensent (y compris moi).

IDEO : de designer d'objets à designer d'expériences

Le BusinessWeek du 17 mai 2004 a publié un excellent article (PDF : 850 Ko, 10 pages) sur la légendaire firme de design IDEO.

On y lit notamment que celle-ci applique son processus de design pour concevoir des expériences clients uniques.

À lire !