Ergospeed #04 : Fnac.com

Logo_Fnac

La semaine dernière la Fnac a mis en ligne la refonte de son site e-commerce. Une surprise qui introduit des nouvelles fonctionnalités, des nouveaux services, une nouvelle structure accompagnée d’un design sans grande innovation mais qui respect la charte graphique de la marque.

Le moins de clic possible

Fnac_rollover

Parmi les nouveautés de ce site, la Fnac à  semble-t-il essayé de limiter le nombre de clic. Par exemple, lors du chargement de la page d’un des sous-menu de la rubrique « les services », les modules de navigation situés dans la colonne de gauche ont une particularité novatrice : ils s’ouvrent dès le rollover de la souris. Cette fonction permet une navigation plus fluide, rapide, douce et surtout instantanée. La présence de « symbole » ou « picto » similaire à  des boutons de navigation d’une application sont présent pour manifester à  l’utilisateur leurs états actifs ou pas. Ils ne sont pas forcément utiles pour les modules de navigation, mais plus pour le bloc central.

Malheureusement, cette navigation ne se retrouve pas sur tout le site. Ce choix d’utilisation du rollover est principalement utilisé dans la rubrique « les services ». Aussi bien dans les modules que dans le bloc central qui illustre les prestations de la Fnac. Dommage !

Notons que le module « et aussi », qui est de la publicité pour la Fnac, reste toujours ouvert.

Utilisation de Flash

flash_fnac
Certaines rubriques ont comme introduction une animation réalisé sous Flash. Même si ce parti pris est sans doute pour impressionner l’utilisateur afin de lui offrir un site conviviale, attractif et ludique, ces présentations animées sont inutiles et font perdre du temps. Toutefois, les webdesigners ont tout de même pensé aux utilisateurs avertis et pressés : un sous-menu identique aux rubriques contenues dans l’animation est présent juste au-dessus. Ouf !

Résumé

comparaison des sites, avant - après

  • Un menu plus concis et explicite
  • Une meilleur hiérarchisation et organisation du contenu. Une structure identique des pages mais pas dans sa mise en forme : le site est parfois centré ou élastique. Bizarre ?
  • Le moteur de recherche est assez bien mis en avant au centre et juste en-dessous du menu. Toutefois ce dernier n’est pas omniprésent dans toutes les rubriques et cela est un gros problème
  • Remarquons les 2 boutons « enfants » et « voyages » juxtaposés au moteur de recherche dans la rubrique « produits » : leur positionnement n’est peut-être pas un choix judicieux. Impression de flottement dans la colonne de droite et d’incohérence face à  la structure de la page. Même s’ils sont toujours présents, pourquoi ne figurent-ils pas dans le sous-menu ?
  • Une présence importante de vidéos qui servent à  guider l’utilisateur sur certains services.
  • Un design plus en volume : la mode du Glossy est encore passé par là  !

Conclusion

Une refonte bien réussi avec une nouveauté qui n’est pas assez mis en avant : les flux RSS. Des abonnements par rubriques et catégories sont disponibles. Mais à  quand un flux RSS par artiste, par avis des consommateurs sur un produit ou pour la FnacLive tout simplement ?

Ergospeed #04 : Fnac.com

Ergospeed #03 : Box.net

box_logo
Situé en Californie à  Palo Alto, Box.net permet depuis mars 2006 à  plus de 1.000.000 membres de stocker, de partager 1 Go de données en ligne et gratuitement. Ce service est très utile grâce à  sa simplicité d’utilisation et la possibilité de partager ses données avec des tiers.

Box_HomePage

Navigation en Drag & Drop

box_presentation_fichier

  • Lors du rollover un bouton apparaît pour signaler la présence d’un menu contextuel correspondant à  la fonction du clic droit de la souris
  • Choix d’une présentation en ligne ou en icà´nes des fichiers uploadés
  • Interface simple, épurée et claire utilisant la complémentarité de 2 couleurs : orange et bleu.

Box_Etapes Upload
Afin d’uploader un fichier dans le dossier créé, Box.net propose 2 possibilités d’action s’ouvrant dans un pop-up :

    Méthode « traditionnelle »

  • Bouton « Ajouter des fichiers » : Ouverture d’un pop-up permettant de naviguer dans les dossiers de son ordinateur.
    Méthode « Drag & Drop »

  • Ce lien ouvre un pop-up contenant une application en Java. Elle permet de glisser-déposer les fichiers désirés. L’upload de ces fichiers est facile d’utilisation et compréhensible grâce à  cette application offrant une navigation instinctive et pratique.

box_draganddrop
Cette pratique du drag & drop se retrouve pour le rangement et la classification des fichiers dans le compte de l’utilisateur.

Partage des fichiers

box_ partage
Comment partager ses fichiers avec des tiers personnes ? Pas plus simple : Box.net permet de se logger à  ses différents comptes mails o๠tous les contacts de l’utilisateur apparaîssent sous la forme d’une liste. Une case à  cocher, un champ texte à  remplir, un bouton de validation à  cliquer et la demande de partage est envoyée. Attention, pour le compte hotmail, impossible d’avoir une adresse « hotmail.fr » seul le « .com » est possible.

Widget
Possibilité de créer un widget d’un dossier que l’on souhaite partager sur son site web. Exemple ci-dessous :

  • La présence du bouton Menu reste fidèle à  la présentation du site ou du menu contextuel des fichiers uploadés
  • Les pictos illustrant les rubriques sont assez explicites
  • Une preview très utile présentée sous forme de player vidéo
  • Ce widget est le reflet de Box.net par son design épuré et efficace, son homogénéité de navigation qui est similaire à  celle du site web. Toutefois, la notion de drag & drop n’existe pas pour les fichiers téléchargeables du widget

Conclusion

Je conseille vivement ce service pour sa simplicité, ses possibilités de partage de fichiers que ce soit sur le site, à  aide du widget et maintenant grâce au module Firefox Universal Uploader.

Ergospeed #03 : Box.net

Ergospeed #02 : Symbaloo.com

Symbaloo - logo

Apparu au mois de juin dernier, Symbaloo est une page de démarrage personnalisable qui permet de réunir ses flux RSS, ses favoris, ses podcats… Mais aussi différents outils de recherche. Seulement disponible en anglais et en néerlandais (son pays d’origine) Symbaloo est en version Beta pour le moment.

MAJ : A partir du 10 avril 2008, Symbaloo est disponible en français.

Symbaloo - home

Caractéristiques principales

Cette page d’accueil se présente sous forme de grille composée de plusieurs modules de couleur dont un central qui représente le résultat de la requête en cours. Chaque module correspond à  un service ou un outil qui hiérarchise selon sa classification de couleur. Par exemple, les modules de couleur rouge se rapportent aux recherches de type multimédia tel que la vidéo, la musique, la photographie, etc. Les modules blancs sont destinés aux services externes tel que Gmail, Facebook ou à  des flux RSS qui peuvent être lus dans le module central. Attention, seulement les titres des flux sont lisibles ! Pour lire l’ensemble de l’information, il faut cliquer sur le titre et une nouvelle page de votre browser s’ouvre sur le post en question. Idem pour une recherche sur Google, Yahoo!, etc.

Symbaloo - setting

  • Page de démarrage personnalisable
  • Les critères de customisation sont stockés dans les cookies de votre ordinateur
  • Page pétillante grâce aux choix des couleurs qui ressortent sur ce fond noir reposant
  • Icà´nes stylisées et efficaces qui font étrangement penser aux pictos de l’iPhone 😉
  • L’utilisateur a le choix entre 3 résolutions : 800×600 / 1280×1024 / 1280×1024
  • Ajout ou suppression de colonne, de ligne, ou la possibilité de remettre la page à  zéro

Navigation instinctive

Ce service fonctionne principalement par une navigation du type « drag and drop » (glisser-déposer). L’utilisateur agence les modules à  sa guise. Pour en ajouter, rien de plus simple que de cliquer sur un module gris et une fenètre de type « lightbox » s’ouvre. Il a la possibilité de choisir parmi une liste ou de compléter ses propositions en ajoutant son propre flux. Pour supprimer un module, un glissement suffit du bloc de couleur vers le module principale ou un picto « corbeille » apparaît.
Symbaloo- ajout_suprr

    Symbaloo - google01

  • Navigation naturelle par son “drag and drop”
  • Aspect simple permettant à  l’utilisateur d’avoir une page la plus complète possible
  • 1 click : apparition de la requête dans le module central
  • 2 click : ouverture d’une nouvelle page web vers le site sélectionné
  • Chaque recherche dans le module principal laisse à  l’utilisateur le choix du service parmi une liste mise à  disposition

Conclusion

Ce service est intéressant par sa navigation très instinctive, sa classification de couleur permettant une organisation des outils, et bien sûr, pour sa simplicité qui est accessible même à  un utilisateur lambda. Ma foi, je reste fidèle à  mon Netvibes, même si parfois ce dernier ne recharge pas tout le temps mes flux RSS. Symbaloo peut être pratique pour une recherche mais pas pour être un agrégateur. Symbaloo reste un service utile mais destiné à  un public non-technophile.

Ergospeed #02 : Symbaloo.com

Ergospeed #01 : Adaptation de Spotlight sur Apple.com

Spotlight

En attendant le prochain Ergotest, voici mon premier Ergospeed dont le sujet est l’adaptation de l’application Spotlight sur le site d’Apple.

Apple - mac

Qu’est-ce que Spotlight ?

  • Apparu sur la plateforme Mac OS X Tiger, c’est un moteur de recherche qui présente instantanément les résultats qui s’affichent pendant que vous tapez votre requête
  • Vos résultats se présentent sous forme de liste dans 2 colonnes : l’une pour l’emplacement du fichier, l’autre pour sa description avec son icone permettant une meilleure lisibilité et une connaissance de son format.
  • Indexation automatique de vos faits et gestes sur votre Mac
  • A savoir qu’une des particularités de Spotlight est sa recherche dans les métadonnées des fichiers images (jpeg, gif, tiff et png) à  l’aide des EXIF et IPTC contenues dans ces dernières.
  • Il reconnaît aussi les formats : txt, rtf, pdf, documents Word, Excel, PowerPoint, images photoshop, mail, les contacts du carnet d’adresses, calendriers iCal, présentations Keynote, applications, préférences système, journaux iChat, dossiers/répertoires, les polices, les MP3, AAC, MOV

Intégration de l’application sur un site web

La brillante idée et stratégie d’Apple est de réinvestir cette application sur leur propre site web en tant que moteur de recherche. La présentation reste la même à  la différence que la colonne correspondant à  l’emplacement disparaît, quant aux icones, ils se substituent aux pack-shots des produits bien intégrés : un détourage propre des photographies, un fond de couleur gris pour sa neutralité permettant de faire ressortir les couleurs des produits, qu’ils soient blanc ou noir. Le nom des produits est en gras avec un saut de ligne pour une courte description en caractère normal. Une présentation simple et efficace qui propose aussi des résultats sur iTunes. Pas fou la pomme !

Conclusion

Avec toutes ces caractéristiques, dont je ne vous fais l’éloge ici car Apple le fait très bien, Spotlight habitue les utilisateurs Mac a une nouvelle méthode de recherche, de hiérarchisation des informations enregistrées sur leur ordinateur. Une fois de plus, Apple ne laisse rien au hasard en injectant dans leur site certaines capacités d’OS X afin de séduire l’utilisateur potentiel.

A lire aussi :

Ergospeed #01 : Adaptation de Spotlight sur Apple.com