Ergospeed #21 : Totlol.com, une interface qui évolue avec l’âge

totlol_logoDécouvert il y a quelques semaines, ToTLoL.com est un nouveau service vidéo proposé par YouTube mais cette fois-ci destiné aux enfants. Bien sûr, le contenu est filtré et un verrouillage parentale est possible. De quoi rassurer les adultes et d’avoir une garantie sur ce que visionne les enfants.

La particularité de ce nouveau service est son interface qui s’adapte selon l’âge de l’enfant. Les différentes interfaces permettent d’accompagner et de fidéliser son utilisateur dans sa navigation jusqu’à  la transition vers une plateforme vidéo plus commune à  tous comme YouTube.

A quand un service web qui propose des interfaces modulables du plus jeunes âges jusqu’à  nos vieux jours ?

Mode « Tottler » : Tout petit

L’interface Tottler est extrêmement simple : elle propose seulement 20 vidéos optimisées sur la page d’accueil. Ces vidéos sont rafraîchis et mises à  jours quotidiennement. La navigation est limitée au visionnage de la vidéo sélectionnée et à  la vidéo suivante.

toutPetit

Mode « Preschooler » : Enfant d’âge préscolaire

L’interface Preschooler permet d’accéder à  200 vidéos optimisées. La navigation commence a s’étoffer et n’est plus linéaire : l’enfant a accès à  sa liste de vidéos préférées, à  des centaines d’autres vidéos via à  une présentation « light » en mosaà¯que et une pagination unilatérale. (absence de texte)

preschooler

preschooler_02

Mode « Kindergarten » : Jardins d’enfants / Ecole Marternelle

Dans l’interface Kindergarten les fonctionnalités habituelles présentent sur la plupart des plateformes commence à  apparaitre comme la recherche, les collections (chaines), la possibilité d’ajouter ou de supprimer une vidéo de sa liste des favoris (optionnel par les parents dans les « Settings »), les vidéos similaires sous une vidéo en cours de lecture…

kindergarten

kindergarten02

Mode « Young Kid » : Jeune enfant

Les interfaces Young Kid et Tween introduisent une structure sur deux colonnes commune à  YouTube (ou autres plateformes vidéos). L’apparition des fonctionnalités continuent (différents modes de visualisation, le nuage de tag, les informations relatives…) et permettent une transition vers les plateformes communes à  tous.

youngKid

Mode « Tween » : Transition avant l’accès à  YouTube

tween

Ergospeeds précédents :

Ergospeed #21 : Totlol.com, une interface qui évolue avec l’âge

Etude Eye tracking sur l’E-Pub dans la presse online

Après l’étude Newsletters e-commerce, Altics sort sa nouvelle étude Eye tracking sur l’E-Pub dans la presse online :

A télécherger sur le site d’Altics : www.altics.fr

A lire aussi :

Etude Eye tracking sur l’E-Pub dans la presse online

#01 Deezer V3 : Brainstorming

Après 3 mois de patience, voici enfin les billets relatant la V3 de Deezer 🙂
Au lieu de vous faire partager cette aventure en un seul billet, nous allons vous raconter cette histoire en plusieurs épisodes…

  1. 1/ Brainstorming (Janvier 2009)
  2. 2/ Zoning + Maquettes conceptuelles (Janvier – Février 2009)
  3. 3/ Webdesign + Ateliers avec la Deezer Team (Février 2009)
  4. 4/ Modification suite aux ateliers + Développement / Intégration web (Mars – Avril)
  5. 5 / Lancement de la bêta privée + retours utilisateurs (Juin 2009)
  6. 6/ Migration de la v2 à  la v3 jusqu’à  la fin juillet 2009

Cette liste est un fil conducteur, non exhaustif, il s’étoffera lors de l’écriture. L’élaboration de la v3 ne peut se réduire à  une dizaine de billets mais les grandes lignes y seront abordées. Par élaboration, je sous-entend la méthode de travail et la collaboration de toute la Deezer Team. Ce passage à  la V3 : c’était aussi non seulement un défi mais aussi une création collaborative et interactive pour toute l’équipe.

« Une idée nouvelle peut germer dans un seul cerveau, mais seul un effort collectif permet de donner naissance à  un prototype et au lancement d’un nouveau produit » A.G Lafley, PDG de Procter & Gamble

Attention ! Cette méthode a très bien fonctionné pour la Deezer Team mais elle ne correspondra pas forcément aux besoins pour un autre projet ou pour une autre entreprise.

Deezer v2 : points positifs & négatifs

Deezer v2

5 janvier 2009. L’année vient tout juste de démarrer au sein de la Deezer Team avec une grande nouvelle : « Dès aujourd’hui, on commence la version 3 de Deezer !!! »

Dans un premier temps, nous avons passé en revue toutes les fonctionnalités de la V2 afin de noter ses avantages et inconvénients :

Points positifs : Un player omniprésent avec un double usage audio et vidéo. Un point d’entrée éditorial pour la mise en avant des artistes (la visionneuse). Un design graphique sombre et apaisant, fonctionnalité première efficace « écouter facilement de la musique sans interruption lors de la navigation sur le site »,…

Points négatifs : Une structure sur 3 colonnes qui restreint l’utilisation du site. Une publicité omniprésente et mal intégrée. Une interface surchargée d’informations. Un manque important de mise en avant d’artistes en dehors de la page d’accueil. Trop de fonctionnalités portant à  confusion…

Lors de cette réunion, nous avons écrit sur une feuille A4 notre cÅ“ur de métier et la devise de Deezer. Le fait d’avoir ce A4 omniprésent sous nos yeux nous a permis de nous concentrer sur l’essentiel. Il ne faut jamais oublier l’usage premier du service : Musique gratuite, illimitée et légale.

Une interface doit être au service du contenu et se doit d’évoluer dans le sens de l’utilisation des usagers. Cette notion évolue bien entendu dans le temps, car les besoins et les exigences des internautes évoluent. Il faut alléger les actions, avoir une interface simple et rapide d’usage et construire un modèle d’interaction qui ne déroutera pas nos utilisateurs.

Analyse de l’existant.

L’analyse de l’existant consiste à  regarder à  la fois nos concurrents mais aussi les sites communautaires, les sites que nous utilisons au quotidien et ceux avec lesquels nous avons une affinité (joli design, utilisation simple…). Nous avons donc listé chaque atout. Vous trouverez la liste ci-dessous :

dailymotionfacebookflickrgoomgroovesharkhuluidioilikeimeeminrocksiTunesjiwajusthearlalalastfmmusicmemyspacesongbirdspotifyvimeovirbwormeeyoutube

La suite au prochain épisode…

Billets déjà  parus et à  venir :

  1. 1/ Brainstorming (Janvier 2009)
  2. 2/ Zoning + Maquettes conceptuelles (Janvier – Février 2009)
  3. 3/ Webdesign + Ateliers avec la Deezer Team (Février 2009)
  4. 4/ Modifications suite aux ateliers + Développement / Intégration web (Mars – Avril)
  5. 5 / Lancement de la bêta privée + retours utilisateurs (Juin 2009)
  6. 6/ Migration de la v2 à  la v3 jusqu’à  la fin juillet 2009
#01 Deezer V3 : Brainstorming

Ergophile sur WebDesign Mag (interview)

webdesign-magStéphanie Guillaume, la rédactrice en chef du magazine WebDesign m’a gentillement proposé une interview pour son blog. Voici quelques réponses à  ses questions. Vous pouvez retrouver l’intégrale de l’interview : « Jacinthe busson / ergophile »

Eh bien tout d’abord pouvez vous me parler un peu de votre parcours personnel ?
Mon cursus scolaire est assez traditionnel : j’ai obtenue un Bac Arts Appliqués o๠durant 3 ans j’ai étudié plusieurs domaines tels que le design objet, l’architecture, le stylisme, le graphisme, l’histoire de l’art… Ensuite, j’ai enchainé avec un BTS Communication Visuelle option graphisme. Tout naturellement à  l’âge de 19/20ans, j’ai préféré rentrer dans la vie active en faisant un contrat d’alternance d’un an en tant que « Concepteur Multimédia ».

Depuis 2003, je suis intervenue dans différentes agences parisiennes en tant que graphiste ou webdesigner. Aujourd’hui, je suis Directrice Artistique chez Deezer. Je continue des prestations Freelance ou de consulting dans le webdesign et je commence une nouvelle aventure d’entrepreneuriat avec un nouveau service web dédié aux défis, tKaap.com, réalisé en collaboration avec Sylvain Weber, ancien développeur web de Dailymotion.

A mon avis, l’expérience professionnelle est plus importante pour un wedesigner que l’accumulation de diplà´me. Durant mes années d’études, j’ai toujours été attiré par l’informatique et surtout le web mais je préférais avoir les bases en graphisme pour ensuite me diriger professionnellement dans le webdesign. Parallèlement à  mes différents emplois, j’ai toujours eu beaucoup de projets personnels ce qui me donne une certaine liberté de création et d’expérimentation.

Ensuite, depuis quand existe le blog Ergophile et pourquoi ? Est-ce un blog personnel ou professionnel ?
ergo
Ergophile est apparu en 2007. Ce blog est un support o๠je peux m’exprimer librement sur mon approche de l’ergonomie web et de mon expérience en tant qu’utilisatrice. Je ne me prétend pas Ergonome et mes billets sont des constats personnels et non une vérité. Chacun est libre de les approuver ou non 🙂

Un webdesigner doit avoir les bases de l’ergonomie pour concevoir un design d’interface efficace et cela n’est pas forcément évident. Cet apprentissage s’obtient en pratiquant et en observant les sites au quotidien.

Un blog personnel, bien sûr, ce sont mes interprétations que j’aborde lorsque je découvre ou teste un nouveau service, logiciel ou application. Cela me permet d’accroitre mes compétences en faisant fonctionner mes neurones sur différents usages. La veille est très importante : elle permet d’approfondir ses connaissances mais aussi sa créativité.

Un blog professionnel, bien entendu, je réagis par rapport à  l’actualité et n’hésites pas à  donner mes impressions. J’y partage aussi mon expérience d’entrepreneuriat avec tKaap.com mais aussi le poste que j’occupe aujourd’hui chez Deezer. Ah au faite, c’est grâce à  mon blog que j’ai pu me faire recruter chez Deezer : lors de la sortie de la v1.0 j’avais écris un billet sur le sujet et cela m’a permis de me faire remarquer. Comme quoi cela peut être bénéfique de tenir un blog pro 😉

Pensez-vous que chaque créateur de site devrait faire appel à  un ergonome ou bien c’est quelque chose qui peut s’acquérir facilement ?
Bonne question. Avec toute franchise, je ne saurais répondre. Toutes les PME ne peuvent s’offrir les services d’un ergonome et un webdesigner n’a pas forcément toutes les clés en main. La théorie ne remplacera jamais la pratique mais les deux font une bonne équipe. Toutefois, pour qu’une équipe technique soit au complet, il ne faut pas oublier l’avis du développeur qui lui peut apporter des solutions ou des innovations ^^

Leur donner 4 ou 5 astuces rapides ?
Demander l’avis à  vos internautes en réalisant régulièrement des tests utilisateurs : s’ils ont beaucoup de difficultés à  utiliser votre site, c’est qu’il y a un problème, donc défaire pour refaire n’est pas un mal.

Ne pas oublier l’utilisabilité au quotidien. L’utilisabilité a pour but de répondre à  trois critères qui détermineront la facilité avec laquelle vos internautes naviguent sur un site : efficacité, efficience et satisfaction.

  • Efficacité, pour le résultat final. Si l’utilisateur est arrivé à  ses fins.
  • Efficience, pour le temps écoulé par l’utilisateur pour arriver à  son objectif.
  • Satisfaction, pour le confort et l’impression finale de l’utilisateur face à  la navigation sur le site.
  • Une identité forte n’est pas un mal si l’ergonomie du site concilie utilisabilité, utilité et attrait visuel. Il est important pour un site web d’avoir une identité impactant grâce à  sa charte graphique qui sert aussi d’indice à  l’utilisateur et lui permet de savoir s’il va trouver ce qu’il cherche sur ce site.

    Vous pouvez retrouver l’intégrale de l’interview : « Jacinthe busson / ergophile »

Ergophile sur WebDesign Mag (interview)

La méthode Google : Que ferait Google à  votre place ?

methode_google

Jeff Jarvis, auteur du livre « La méthode Google : Que ferait Google à  votre place ? » (que je suis en train de dévorer) affirme que « Google n’est pas l’ennemi. Google est la clé de la compréhension de la nouvelle économie et du nouveau monde qui s’ouvre. » Intrigant et étonnant comme propos ?!

Dans ce livre, Jeff Jarvis ne fait pas l’éloge de Google mais interroge le lecteur sur des dilemmes que tout travailleur du web est confronté au quotidien. Il explore les fondamentaux de Google dans le but de les confronter sur différents secteurs d’activités : média, automobile, téléphonie, immobilier…

De nombreux exemples sont racontés à  travers des services tels que Dell, Craiglist, IBM, Digg… Jeff Jarvis développe s’est propos avec une approche judicieuse en décortiquant les règles et méthodes unique de Google.

Je vous le recommande vivement !

Quelques extraits

« Pour réinventer le livre, il va nous falloir brûler notre idole »
Les livres sont loin d’être parfaits. Ce sont des machines à  arrêter le temps : on ne peut pas les mettre à  jour ou les modifier, sauf à  faire une nouvelle édition. Ils n’ont pas de moteur de recherche. […] Quand ils deviennent électroniques, les livres offrent de nombreux avantages. Ils peuvent être multimédia, intégrer des animations, des sons et de l’interactivité. Ils possèdent un moteur de recherche, des liens, et peuvent être mis à  jour. Leur durée de vie est infinie. Ils rencontrent partout de nouveaux publics.

Gagner de l’argent par des voies dérivées.
« Google et Apple gagnent de l’argent en donnant gratuitement accès à  des pans entiers de leurs activités, et en se rémunérant ailleurs. » Les entreprises ont trop souvent tendance à  vouloir monétiser, protéger ou capturer la moindre parcelle de valeur qu’elles mettent à  disposition de leurs clients, alors que la vraie valeur est susceptible de provenir d’une voie dérivée.

La Méthode Google : que ferait Google à  votre place : 20,90 € chez Amazon.fr

A lire aussi :

La méthode Google : Que ferait Google à  votre place ?

Paris-Web 2009, j’y serai et vous ?

paris_web_2009
Comme chaque année, Paris-Web est le rendez-vous à  ne pas manquer. En 2009, cela se passe le 8, 9 et 10 octobre. Je serais seulement présente aux ateliers du samedi 10 qui ont lieu à  l’Ecole Française d’Electronique et d’Informatique (EFREI).
Plus d’infos : www.paris-web.fr/2009

Programme du samedi 10 octobre

Ci-dessous vous trouverez le programme de la journée du 10 oct. Je suis assez « verte » car il y a des conférences qui m’ont l’air très intéressantes mais aux même horaires ! Ahhhh ! Le choix va être difficile !

Le programme en détail est disponible ici

  • Wikipédia accessible ? C’est possible !
  • Gérer la sécurité de vos applications web
  • Faut-il maîtriser son code HTML ?
  • Eye Tracking ou comment mon client regarde mon site Internet et les nouvelles interactions Homme-Machine de demain
  • Webdesign et dyslexie
  • Technologies riches sur mobile : tour d’horizon et perspectives
  • Le Web en Offline avec Gears et HTML 5
  • Accessibilité, on rase gratis
  • Bien tester ses sites web
  • Portabilité des données : danger ou opportunité ?
  • ReNo sur la vague des WCAG 2.0 : « Maman au secours, dois-je réapprendre à  nager ?
  • La trousse de survie en milieu web hostile
  • Test automatisé d’applications JavaScript avec Qunit et Selenium

A lire aussi :

Paris-Web 2009, j’y serai et vous ?

Ergospeed #20 : Converbot (application iPhone)

converbot_iphone
Grande découverte du weekend : L’application iPhone Converbot !
Ce convertisseur est à  la fois efficace, personnalisable et beau, que demander de plus ?

Il permet de convertir la monnaie, les unités de mesure, le temps… grâce à  une interface graphique de qualité et des effets sonores qui accentuent son interactivité.

Orienter l’utilisateur

La première fois que vous ouvrez Converbot, un tips vous invite à  visionner la démonstration qui permet de comprendre en un coup d’Å“il l’usage quotidien de ce convertisseur. Cette démo est vraiment bien réussie et tellement simple qu’elle ne peut être qu’efficace.

converbot

Navigation circulaire ou radiale

converbot ipod

En un coup de pouce vous sélectionnez votre unité grâce à  une navigation radiale. Cette approche assez attractive entre l’utilisateur et l’interaction qui en résulte peut rappeler la navigation de l’iPod. Grâce à  sa rapidité, l’utilisateur comprend directement le sens de lecture circulaire et son fonctionnement avec les différents paliers de sélection.

Sur cette vidéo ci-dessous, vous constaterez la fluidité de cette application dans son utilisation. La proximité et l’interactivité de chaque élément permet une meilleure utilisabilité et un confort d’utilisation provenant aussi de son graphisme et de ses retours sonores.

A tester et vite 🙂

Billets similaires à  une navigation circulaire ou radiale :
converbot_telecharger

Ergospeed #20 : Converbot (application iPhone)