Monthly Archives: avril 2013

Un menu radial inspiré des jeux de tir

Résumé : Plein de mots arides sur les modes en IHM, puis une modeste pro­po­si­tion d’interaction pour écran tac­tile.

Rappels sur les modes

En IHM, un mode est un para­mètre qui per­met de pro­duire dif­fé­rents résul­tats avec le même input, selon que ce mode soit acti­vé ou non. C’est en fait très simple : par exemple enclen­cher la touche Caps Lock fait bas­cu­ler les autres touches en mode « lettre capi­tale ».

On consi­dère clas­si­que­ment que c’est une tech­nique utile mais à manier avec pré­cau­tion. C’est pra­tique pour aug­men­ter l’éventail des pos­si­bi­li­tés. Les touches Shift et Caps Lock per­mettent de dou­bler le nombre de carac­tères que l’on peut entrer, alors que les pre­mières machines à écrire avaient un cla­vier dédou­blé ou devaient se conten­ter d’une seule casse. Le pro­blème est que cela risque d’égarer l’utilisateur. Vous vous sou­ve­nez sans doute de l’inénarrable mode « refrappe » : on pou­vait l’activer avec la touche Insert et ce n’était signa­lé que par un minus­cule RFP en bas de la fenêtre de Microsoft Word. Il était facile d’entrer dans ce mode sans le vou­loir mais net­te­ment plus dif­fi­cile d’en sor­tir, quand on ne connais­sait pas le truc.

Jeux vidéo et quasi-modes

Si on veut avoir le beurre et l’argent du beurre, Jeff Raskin recom­mande l’utilisation de ce qu’il appelle des quasi-modes, c’est-à-dire des modes qui demandent une inter­ven­tion constante de la part de l’utilisateur. Citons le cas du péda­lier d’un pia­no ou la touche Shift d’un cla­vier : elle n’a pas d’effet si elle n’est pas pres­sée. Cela demande plus de coor­di­na­tion motrice, mais en contre­par­tie les deux actions (ici, shift + lettres) sont liées et conco­mi­tantes. L’utilisateur a ain­si plus de contrôle sur le sys­tème et cela dimi­nue les risques de res­ter dans un mode sans s’en rendre compte.

Dishonored
Dishonored (ZeniMax / Arkane Studios, 2012)

Certains jeux vidéo croisent cette idée avec celle des menus radiaux (cf. la cap­ture d’écran supra). Si on veut par exemple chan­ger d’arme, on main­tient une touche (sou­vent la molette de la sou­ris) pour faire appa­raitre un cercle d’items. Diriger la sou­ris dans la direc­tion d’un item per­met de le sélec­tion­ner. C’est une très bonne idée qui fait inter­ve­nir plu­sieurs concepts :

  • La mémoire mus­cu­laire (ou appren­tis­sage moteur). Au début, il faut apprendre à situer et recon­naitre le pic­to­gramme de l’item sou­hai­té, mais avec l’habitude tout ce qu’il y a savoir, c’est un mou­ve­ment de la main selon un cer­tain angle.
  • La loi de Fitts, selon laquelle le temps mis par l’utilisateur pour atteindre une cible dépend de sa taille et de son éloi­gne­ment (je sché­ma­tise). Ici la dis­tance est infime (il faut à peine bou­ger la sou­ris) et la taille angu­laire est grande (plus ou moins, selon le nombre d’items).
  • Le quasi-mode. Ici, le fait de devoir main­te­nir la touche est une force plu­tôt qu’un pis-aller, car ce genre de menu sert d’accès rapide. Il est uti­li­sé sou­vent et briè­ve­ment. Ce ne serait pas adap­té pour l’inventaire d’un jeu de rôle, dans lequel on s’attarde plus.

Le desi­gn d’interfaces pour­rait s’inspirer de cette idée. Cela fait long­temps que les menus radiaux sont uti­li­sés ici et là, mais ce n’est pas tou­jours convain­cant. Dernièrement, on peut citer l’excellente appli­ca­tion OneNote sur la Surface de Microsoft, ou bien les wid­gets s’inspirant de Path – les­quels qui brillent sur­tout par leur ani­ma­tion.

Je trouve l’idée par­ti­cu­liè­re­ment adap­tée aux écrans tac­tiles, donc j’ai en tête un modèle d’interaction de ce genre : pres­ser deux doigts pour faire appa­raitre un menu, puis les faire glis­ser vers l’item dési­ré. Décoller les doigts de l’écran suf­fit à sélec­tion­ner ce der­nier. L’interaction conjugue la faci­li­té des gestes tac­tiles et l’immédiateté du feed­back visuel. Le résul­tat est fluide puisque les doigts ne quittent pas l’écran. Dans l’animation ci-après (oui c’est juste un Gif pour­ri), le menu appa­rait vers le haut pour ne pas être caché par la main. L’exemple est assez limi­té (par­ta­ger un article vers divers ser­vices), mais au-delà ce genre d’interaction me semble pro­met­teur.

2x\_Press\_Hold
Cliquer sur l’animation pour l’arrêter.

Cela pour­rait être uti­li­sé soit comme menu contex­tuel, soit comme menu glo­bal (ie qui per­met­trait d’accéder aux même actions quelque soit l’endroit où j’appuie). Le pre­mier cas serait utile avec beau­coup de cibles poten­tielles dis­tinctes (par exemple une page pleine de liens), tan­dis que le second serait plus avan­ta­geux avec des actions répé­ti­tives (par exemple accé­der à une palette d’outils dans une appli­ca­tion de des­sin). Je suis pre­neur d’avis et de cri­tiques. L’utilisabilité aus­si bien que l’utilité de cette pro­po­si­tion sont cer­tai­ne­ment cri­ti­quables et j’ai pu pas­ser à coté de tra­vaux sem­blables.

Quand le mépris se déguise en empathie

Il est louable de se mettre à la place des gens et de com­prendre qu’ils uti­lisent leurs outils quo­ti­diens de manière prag­ma­tique. Cela parait évident et c’est le point de départ de la concep­tion cen­trée sur l’utilisateur. C’est grâce à ça qu’on conçoit des inter­faces simples, sans jar­gon ni option inutile. Pourtant cette impor­tance de l’empathie est sou­vent cari­ca­tu­rée et trans­for­mée en dédain.

« Les gens nor­maux se moquent de telle ou telle chose » : cette tour­nure est trop sou­vent uti­li­sée à pro­pos de tout et n’importe quoi. C’est un moyen trop facile pour repro­cher à son inter­lo­cu­teur d’être cou­pé des réa­li­tés et d’accorder de l’importance à ce qui n’en a pas aux yeux de ceux qui comptent, les uti­li­sa­teurs finaux. « Les uti­li­sa­teurs lamb­da se fichent de RSS, de HTTP ou de tel détail tech­nique », « le grand public se moque de la neu­tra­li­té du net ou de la pro­tec­tion de la vie pri­vée », « madame Michu ne veut pas savoir quel OS tourne sur son télé­phone ». En rai­son­nant ain­si, on fabrique de toute pièce la fic­tion pares­seuse d’un uti­li­sa­teur for­cé­ment négligent et inculte. Certes, la plu­part des gens ont une uti­li­sa­tion super­fi­cielle de la plu­part des ser­vices et pro­duits qu’ils uti­lisent. Le plus sou­vent, ils se moquent du sou­bas­se­ment tech­nique et des enjeux socio-politico-économiques qu’il peut y avoir der­rière. Mais voir tout au prisme d’une échelle unique « noob abso­lu — nerd ultime » est extrê­me­ment réduc­teur.

Je peux être très au fait des ordi­na­teurs clas­siques mais lar­gué par les smart­phones, ou l’inverse. Je peux avoir fait des méfaits de la publi­ci­té un che­val de bataille per­son­nel tout en me contre­fi­chant de, met­tons, les condi­tions de tra­vail des ouvriers chi­nois. Je peux avoir quinze ans, n’utiliser mon télé­phone que pour tex­ter et être mal­gré tout assez calé en hard­ware, à force de com­pa­rer avec les copains les specs des modèles à la mode. Il y a plein de rai­sons qui font qu’on s’intéresse à quelque chose. Les gens sont com­pli­qués.

Et les gens changent. Si une fonc­tion­na­li­té dont dépend madame Michu existe sur iOS et pas sur Android, elle aura plus faci­le­ment ten­dance à se rap­pe­ler de la dif­fé­rence. La plu­part des gens font peu atten­tion au par­tage des infor­ma­tions per­son­nelles, jusqu’au jour où, sur Facebook, une pho­to devien­dra visible par la mau­vaise per­sonne. Des pro­blèmes abs­traits peuvent vite deve­nir moins loin­tains si on montre aux gens l’influence que cela peut avoir sur leur vie.

Observatoire des utilisabilités : le texte tronqué

C’est aga­çant quand une inter­face à base de tableaux ou de grille tronque les libel­lés, les ren­dant incom­pré­hen­sibles. Dans les exemples sui­vants (res­pec­ti­ve­ment Vimeo et l’iTunes Store), beau­coup d’importance est accor­dée aux images alors qu’elles ne sont guère infor­ma­tives. La grille est tel­le­ment contrai­gnante que les liens sont faci­le­ment trop longs et se retrouvent lar­ge­ment tron­qués. Il faut donc pas­ser la sou­ris sur cha­cun d’entre eux pour avoir une info­bulle et com­prendre de quoi parlent les confé­rences. Non mais fran­che­ment.

Usability fail : Vimeo
Usability fail : Vimeo

Usability fail : iTunes
Usability fail : iTunes

Pour moi tous mes amis sont beaux – À propos de Facebook Home

Facebook a dévoi­lé Home, une sur­couche pour télé­phones Android. Fast Company a un bon résu­mé des concepts à l’œuvre der­rière le desi­gn.

Une des fonc­tion­na­li­tés majeures est « Cover Feed », à savoir la trans­for­ma­tion de l’écran de ver­rouillage en dia­po­ra­ma mon­trant les nou­veaux sta­tuts de ses contacts. J’ai lu beau­coup de réac­tions du genre « ces pho­to­gra­phies en plein écran, c’est joli en pub, mais qu’est-ce qu’on fait si on a des amis moches ou mau­vais pho­to­graphes ? » (ici par exemple). Cette pro­po­si­tion de rede­si­gn pour Facebook avait essuyé les même cri­tiques : c’est joli en théo­rie, avec des man­ne­quins et des pay­sages gran­dioses, mais ce serait moins rose dans la vraie vie.

Il y a der­rière cette cri­tique une incom­pré­hen­sion de ce qui fait l’attrait des réseaux sociaux. On ne peut pas juger « la vraie vie » selon les cri­tères esthé­tiques d’une publi­ci­té, parce que cette vie, c’est la mienne. Les pho­tos que je vois pas­ser dans mon fil Facebook sont toutes liées à mes contacts : ils appa­raissent des­sus ou ils étaient der­rière la camé­ra. Au mini­mum ils les ont assez aimés pour les par­ta­ger. Si je vois pas­ser des dizaines de pho­tos stu­pides de semi-inconnus, c’est un autre pro­blème et c’est moi que ça regarde.

Je ne dis pas que ce nou­veau ser­vice de Facebook est une idée géniale, ni que j’ai envie de voir l’écran de ver­rouillage de mon télé­phone se rem­plir d’images de 9Gag ou de pho­tos de soi­rée sans filtre anti-yeux rouges (argh !). La chose impor­tante, c’est que ces images sont signi­fiantes pour moi. Le reste est une ques­tion de para­mé­trage : j’imagine qu’il y aura un mini­mum d’options de fil­trage, comme actuel­le­ment sur Facebook.com.

Il y a évi­dem­ment une ques­tion de degré : on peut accep­ter un flot de conte­nu de qua­li­té variable, tant que ça reste sur Facebook et pour­tant refu­ser l’idée que ça enva­hisse tout votre télé­phone. Mais cha­cun son truc. Il y a bien des manières d’être social et de le mon­trer. Si vous n’êtes pas du genre à chat­ter toute la jour­née ou à mettre des pho­to­gra­phies de votre entou­rage en éco­no­mi­seur d’écran, vous n’êtes sans doute pas la cible de Home.


Message d’intérêt géné­ral

Je suis pas­sé de Tumblr à WordPress. Je vous prie de m’excuser pour tout désa­gré­ment, bom­bar­de­ment dans vos RSS et manque de fini­tion du site.