Un plaidoyer en faveur des carrousels

J’ai déjà eu de nombreuses occasions de vous parler des carrousels, ces éléments d’interface qui permettent de parcourir une liste de façon latérale. Le vidéo-blog Smart Experience nous propose à ce sujet une très bonne vidéo qui résume les avantages de cette technique : Interaction Design Skills: Carousels.

carousels

Les points-clés de cette vidéo :

  • Les carrousels fonctionnent partout (web, desktop, mobile) car ils reposent sur le principe de la manipulation directe (tactile ?) ;
  • Les carrousels sont particulièrement bien adaptés aux images (comme chez Cooliris par exemple) ;
  • Les carrousels sont avant tout destinés à du survol rapide plutôt que de la recherche précise (pour cela les moteurs ou arbres sont bien plus efficaces) ;
  • Les carrousels permettent d’anticiper la navigation en proposant un aperçu de l’item suivant (comme sur le site d’Apple).

Bref, vous n’avez plus aucune raison de vous laissez tenter par les carrousels. (via Konigi)

Une nouvelle interface minimaliste pour le NY Times

Alors que la version française de Slate fait (toujours) débat, le NY Times n’en finit plus d’innover avec cette toute nouvelle interface minimaliste : Article Skimmer.

nytimes_skimmer

L’idée derrière cette interface est de pouvoir « balayer » les news d’un oeil distant comme vous pouvez le faire en buvant votre café du matin, d’où le titre du billet qui explique la genèse de cette interface : Sunday Browsing. La mise en page est réduite à sa plus simple expression, la lisibilité est parfaite et la prise en main immédiate. D’un point de vue ergonomique c’est du grand art, dans la droite ligne de cet article : In Defense of Readers.

Suite à une précédente expérimentation sociale à grande échelle (cf. L’avenir de la presse en ligne est-il dans le social ?), le NY Times confirme sa position de pionnier dans une industrie de la presse qui se cherche un second souffle.

(via SwissMiss)

Toujours plus d’interactivité dans les vidéos

La vidéo est un support clé dans la valorisation des produits et dans l’enrichissement de l’expérience, là je ne vous apprend rien. OK mais pourquoi ne pas mettre la vidéo au coeur du dispositif marchand ? J’ai récemment croisé plusieurs exemples d’usages enrichis de la vidéo qui me font penser que ce support peut aller au-delà que de la simple illustration.

Premier exemple repéré chez Distilled qui met en scène dès sa page d’accueil une large vidéo (la navigation est relayée au bas de l’écran) où un mannequin enchaîne les tenues dans un astucieux montage :

Le montage vidéo de Distilled
Le montage vidéo de Distilled

Il est possible de passer d’une tenue à l’autre en utilisant les vignettes sous la fenêtre principale, l’accès au produit se fait à l’aide des liens sur la gauche. Une expérience hypnotisante et surtout très immersive qui vient remplacer des pages catégories / sous-catégories. Plus d’infos ici : Distilled Clothing Has Innovative Use of Video.

Autre exemple avec Video Infusion qui permet d’insérer des zones réactives dans une vidéo et de gérer les interactions sans recharger la page. Vous pouvez tester cette technologie sur leur page de démo :

La vidéo interactive de Video Infusion
La vidéo interactive de Video Infusion

Dernier exemple avec Innovid qui propose un incroyable système de superposition d’éléments réactifs dans une vidéo. Sur la capture d’écran suivante, le chat se promène entre les lettres du logo pendant que vous jouer à Pong sur le papier peint avec votre souris :

La démo d'Innovid
La démo d'Innovid

Bon OK, dit comme ça c’est pas très vendeur mais je vous engage fortement à tester ce système sur leur galerie d’exemples pour bien appréhender le potentiel de cette technologie (via Get Elastic).

Tout ça me fait dire que nous n’avons pas finit d’entendre parler de la vidéo et de ses déclinaisons en rich commerce : Imaginez de tels systèmes appliqués à l’offre de catch’up TV (M6 Replay) ou aux séries web (comme Dorm Life, Prom Queen ou Clark & Michael).

Google lance sa barre communautaire

Grosse offensive sur le front social de la part de Google qui vient tout juste de lancer sa barre communautaire (« social bar » en anglais) : A social bar for your site. Faisant suite au lancement (timide) de son programme Google Friend Connect, il semblerait que le géant de la Silicon Valley soit bien décider à ne pas se laisser distancer sur le terrain des applications sociale (cf. Google Raises The Social Bar With New Friend Connect Feature).

Sur le même principe que Google Friend Connect (cf. Ouverture des réseaux sociaux, la route sera longue…), la social bar s’installe sur n’importe quel site / blog et permet d’injecter dedans une couche de sociabilisation. Vous pouvez tester ça dans cet exemple :

googlesocialbar

Vous noterez donc que cette barre est constituée de trois parties :

  • La liste des internautes actuellement connectés (les « members« ) ;
  • Les derniers commentaires publiés ;
  • L’activité des membres (derniers isncrits / commentaires…).

Cette social bar ressemble donc fortement à ce que propose LiveBar et dont j’avais déjà parlé ici : Ajouter une couche sociale à votre site, une vraie fausse bonne idée. Ce flux d’activité (Site Stream) me fait également penser à MyBlogLog (propriété de Yahoo!) qui propose une liste des derniers visiteurs.

Précisons que les commentaires ne sont pas déposés sur le site directement mais qu’ils y sont associés. Ces commentaires (et leurs réponses) ne sont donc pas mélangés avec les autres commentaires (les vrais) mais cohabitent. L’idéal serait de pouvoir se servir de cette social bar pour ne pas avoir à s’identifier sur les différents blogs et sites sociaux où vous laissez des commentaires. Ça en ferait donc une sorte d’agrégateur de commentaires sur le même modèle que BackType (lire à ce sujet : Les commentaires au centre de votre graph social ?).

Malgré sa sobriété, je déplore l’impossibilité de la « fondre » dans la mise en page du site en héritant des couleurs et typos de la feuille de style (par exemple). Mais je pense que ça ne serait tarder…

Toujours est-il que ce lancement, qui fait suite à de nombreux autres ces dernières semaines, nous prouve (ou veut nous faire croire) que Google n’a rien perdu de sa capacité d’innovation et de sa faculté d’enchaîner les nouveautés. Peut-être une façon pour eux de rassurer le marché suite à la fermeture d’un certain nombre de projets ?

A quand l’intégration par défaut de cette social bar dans Chrome ou la Toolbar ?

Une charte ergonomique des sites internet publics

Vous connaissiez déjà les référentiels d’accessibilité, qui donne les lignes de conduite à suivre en matière d’accessibilité, mais connaissiez-vous les référentiels d’utilisabilité ? Ces documents très utiles regroupent ainsi un ensemble de règles / directives / recommandations / bonnes pratiques pour faire de la bonne conception web.

Le service public avait déjà publié un référentiel d’accessibilité (dérivé des WCAG) et a prolongé ce travail avec ce très bon document : Une charte ergonomique unique pour les sites Internet publics. En lisant ce document vous allez très rapidement vous rendre compte qu’il s’agit plus d’un référentiel que d’une charte ergonomique à laquelle les sites publics doivent se plier. Cette charte peut être téléchargée ici : charte_ergonomique_servicepublic_fr.pdf (fichier PDF – 2,6 Mo).

charte_ergonomique

Ce référentiel est organisé en différentes parties :

  • Les règles d’ordre général (architecture de l’information, lisibilité, systèmes de navigation…) ;
  • Les règles sur les objets (liens, formulaires, tableaux, images…) ;
  • Les règles sur les contenus (page d’accueil, page spécifique…).

Nous avons donc au final un très bon document qui pourrait vous aider dans votre travail quotidien de conception. Bien évidement ce document ne remplace pas un livre entièrement dédié au sujet (comme par exemple Ergonomie Web) mais par ces temps de crise, c’est mieux que rien !

Notons au passage qu’il existe un équivalent publié par l’administration US il y a plus de 5 ans : Research-Based Web Design & Usability GuidelinesResearch-Based Web Design & Usability Guidelines.

Connaissez des équivalents en Belgique ou au Canada ?

(via Ergophile)