Connaissez-vous EnglishCentral ? Il s’agit d’un service en ligne d’auto-apprentissage de l’anglais. En gros ils proposent des vidéos d’actualité avec sous-titres, chapitrage et exercices :

Le player vidéo d'EnglishCentral et son chapitrage

Le player vidéo est plutôt bien fait avec une timeline chapitrée, un fonction text-to-speech au survol de la souris sur les sous-titres et la possibilité de s’exercer en enregistrant sa voix à chaque phrase (ce qui permet de gagner des points).

Mais le plus intéressant est cette incroyable fonction de playback audio ralenti de la phrase entière :

Le playback audio en ralenti

En cliquant sur le lien “Hear line slowed down“, vous pouvez réécouter la phrase à une vitesse deux fois moindre sans toutefois altérer la qualité sonore ou le rythme. Je ne sais pas trop comment ils font ça (certainement en échantillonnant et en dupliquant des boucles d’1/10 de seconde) mais le résultat est stupéfiant.

Qui pourrait me dire s’il existe des technologies ou des composants Flash pour faire quelque chose d’équivalent ?

Alors qu’il reste un peu moins d’un mois à attendre pour découvrir Avatar, le dernier film de James Cameron, je vous propose de vous plonger un peu plus en détail dans l’univers très riche du film (lire à ce sujet l’article de Wired) avec leur toute nouvelle bande annonce interactive : Official Avatar Interactive Trailer Powered by Adobe AIR. Il s’agit en fait d’une application propulsée par AIR qui vous permet de lire une bande annonce “augmentée” de nombreux détails sur les personnages ou les équipements du film :

La bande annonce interactive de Avatar

Bon OK ce n’est pas vraiment le premier film interactif, mais je trouve que de repackager la bande annonce avec des “hot spots” et tout un tas de news en provenance de Twitter, YouTube, FlickR… est plutôt une bonne idée. Disons que l’ensemble est très efficace, idéal pour faire patienter les fans. Et pour celles et ceux que ça branche, ne ratez sou aucun prétexte le site dédié aux produits dérivés du film et notamment les cartes en réalité augmentée : Avatar i-Tag.

(via Mashable)

Choisir un vin est un processus compliqué et particulièrement intimidant, surtout pour un étranger. Voilà pourquoi le site Aromicon vous propose un moteur de recherche permettant de choisir par arôme, plats… Mais ils proposent surtout une représentation visuelle des arômes se mélangeant dans le verre (ici un Riesling) :

Les arômes du Riesling

Sur chaque fiche sont ainsi consignés les arômes ainsi que les plats conseillés pour pouvoir naviguer par facettes. Sur l’animation se trouvent également des icônes pour désigner la teneur en sucre (idéale quand vous ne parlez par allemand).

La fiche d'un Muscadet

Voici donc un très beau site avec une recherche et une représentation visuelle tout à fait intéressante.

Un vin italien aux épices

À quand un Wine Configurator en 3D ?

(via Springwise)

Il existait déjà des exemples de navigation dans un site grâce à votre webcam et même à l’aide de l’accéléromètre (La souris est-elle ringarde ?), mais Andreas Lutz va plus loin en proposant les deux : vous naviguez en énonçant à voix haute les intitulés des rubriques et vous parcourez le contenu en faisant des gestes devant votre webcam.

Démonstration vidéo :

Bon dans les faits c’est un peu plus compliqué car même si la détection de mouvement fonctionne bien, la capture audio est beaucoup trop faible pour être exploitable (et il n’existe pas de “solution de secours” comme un menu caché).

La navigation visuelle sur le site d'Andrea Lutz

Quel dommage que cet essai soit à moitié transformé car ceci préfigure une authentique révolution dans la façon d’interagir avec du contenu et surtout dans les capacité immersives d’un site (pouvant ainsi se transformer en une véritable expérience ludique). Connaissez-vous d’autres initiatives de ce type ?

(via Fubiz)

Vous connaissez les documentaires à la télé, vous connaissez les livres dont vous êtes le héros, alors vous allez forcément apprécier ce web-documentaire : L’obésité est-elle une fatalité ?

La page de démarrage du web-documentaire sur l'obésité

Selon les promoteurs (Honkytonk Films et Curiosphere.tv), ce nouveau format place l’internaute au cœur du documentaire et luis permet de choisir son parcours, de conduire ses propres interviews. Autant le dire tout de suite : c’est une véritable réussite car l’immersion est très bien restituée et le minutage est parfait pour maintenir votre attention.

Dans les fait, ce web-documentaire est un mélange de séquences vidéo et d’animations Flash (avec photos en pleine largeur d’écran messages qui défilent et fond sonore). Sur la capture d’écran suivante, il est possible d’avoir plus de détails en cliquant sur le bouton “Plus d’infos” en bas à gauche :

Une séquence du web-documentaire

Des chiffres-clés sont affichés en sur-impression de temps en temps. À la fin de chaque séquence (qui peuvent être esquivées) on vous propose un choix vers la ou le séquence suivantes (ici en bas à droite) :

Un embranchement dans la narration

Les interviews sont en fait des extraits sonores avec des sous-titres si elles sont en langues étrangères :

Le déroulement d'une interview

Rien à redire, cette nouvelle forme de narration vous plonge de façon spectaculaire au cœur du récit, vous pouvez même décidez de l’ordre des séquences en accédant au menu.

Après “Voyage au bout du charbon“, le réalisateur (Samuel Bollendorff) nous prouve qu’il est tout à fait possible de mélanger ces deux supports (le reportage TV et les contenus interactifs) dans un tout cohérent. Pour le moment ces réalisations sont engagées mais j’attends de voir à quoi pourrait ressembler une fiction interactive à regarder sur son touchbook au coin du feu.

Bien évidement vous pourriez me dire que depuis les CD-Rom il n’y a rien de neuf, et je vous répondrait que si justement il y a du neuf : le problème de la distribution est résolu. De même que celui de l’évolution, il serait ainsi tout à fait possible d’enrichir un documentaire au fur et à mesure : un budget limité pour tester l’appétence de l’audience et des compléments produits au fur et à mesure.

Par contre la question qui reste en suspend est la suivante : Comment insérer dans ce tableau les annonceurs ? Peut-être sous forme d’encarts ou d’interstitiels…

Connaissez-vous le Pixel Art ? Mais si enfin, ces fameuses compositions numériques réalisées pixel par pixel. Mélangez cela à de la 3D et vous obtenez de la 3D Pixel Art. Comme son nom l’indique, la 3D Pixel Art est un art. Et comme dans toute création artistique, il faut les outils adaptés.

Il existe déjà des éditeurs en ligne comme Cubescape mais ces derniers ne vous facilitent pas la tâche car le vue est figée :

Une composition 3D en Pixel Art réalisée avec CubeScape

Heureusement les équipes de l’agence japonaise Kyucon nous propose Q-Block, un éditeur 3D Pixel Art qui utilise PaperVision3D :

L'édition de 3D Pixel Art dans Q-Block

L’intérêt de cet outil est de pouvoir éditer un objet 3D en le faisant tourner dans tous les sens. Bon OK mes réalisations peuvent difficilement être qualifiées d’artistiques mais il y a de belles choses dans la galerie :

Exemple de réalisation avec Q-Block

Par contre les objets 3D ne sont pas animés. Mais avec un peu de travail c’est tout à fiat faisable comme le propose les équipe de Neuro et leur 3D Pixel Fun :

Animation en 3D Pixel Art

Et puisque l’on parle de 3D et de PaperVision, avez-vous visitez le site de la nouvelle agence de Carlos Ulloa (Hello Enjoy) ? Il ne s’y passe pas grand chose mais vous pouvez jouer avec les lettres pendant des heures :

Jouez à casser les lettres du logo du site Hello Enjoy

Bref, tout ça pour dire que je suis plus qu’impatient de découvrir les nouveautés 3D dans Flash qui vont certainement nous être présentées au MAX de la semaine prochaine…

En ce moment c’est la rentrée pour les séries US, de ce fait c’est également la rentrée pour les régies publicitaires des chaines qui diffusent les séries. Il est donc important pour elles de communiquer sur les nouvelles créations ou les nouvelles saisons. En plus des différents dispositifs de teasing habituels, HBO propose un dispositif tout à fait original : HBO Imagine.

Le concept de ce site est de développer votre imaginaire et de faire travailler vos neurones. Pour cela ce mini-site vous propose de visionner une série de courts-métrages à plusieurs niveaux de lecture (il faut le voir plusieurs fois et sous différents angles pour connaitre le fin mot de l’histoire). Les différents angles des caméras de ces courts-métrages sont ainsi “projetés” sur des cubes qu’il est possible de faire pivoter pour voir deux angles en même temps :

Le cube en vidéos de HBO Imagine

En plus de ces courts-métrages, il est également possible d’explorer des contenus additionnels (articles, photos, vidéos…) qui viennent enrichir l’histoire et vous permettent de comprendre encore mieux la scène. La navigation au sein de ces suppléments se fait à l’aide d’une représentation spatialisée façon mind map :

Le mind mapping de HBO Imagine

Et pour vous aider dans la compréhension ils fournissent même une carte pour relier les contenus entre eux :

La carte de correspondance des contenus de HBO Imagine

J’adorerais que les films en DVD fournissent des bonus de ce type ainsi qu’un grand schéma pour tout comprendre l’histoire (par exemple pour un film comme Memento).

Même si le mini-site est long à charger et lourd à manipuler, je ne peux que reconnaître la richesse et l’ingéniosité des courts-métrages ainsi que la qualité de la réalisation. Plus d’infos ici : HBO Teases New Season With Teddy Bears.

J’ai déjà eu l’occasion de vous parler du savoir-faire de l’armée US en ce qui concerne de beaux sites qui donnent envie de s’enrôler (idem pour l’armée anglaise), mais je ne me lasse pas des productions qu’ils sortent régulièrement. Petit tour d’horizon de sites de l’Air Force qui semblent plus proches d’une bande annonce de film d’action que de sites de recrutement.

Dernières réalisation en date : Air Force Racing. Le concept du site est de raconter l’histoire d’un pilote de Nascar et d’un pilote de chasse qui échangent leur place et partage leur expérience (Switching Seats) :

La page d'accueil de Air Force Racing

La débauche de moyens est impressionnante : larges visuels, mise en page à 360° avec des éléments spacialisés via PaperVision3D, musique techno… tout est mis en œuvre pour donner une image jeune et fun. L’essentiel du site tourne autour de différentes vidéos parfaitement mises en scène :

Le lecteur vidéo de Air Force Racing

Vous apprécierez les contrôles présents dans le coin inférieur droit (volume et défilement en arc de cercle).

Deuxième réalisation avec un site plus proche du “terrain” : See What’s it Like.

La mosaïque de vidéos de Air Force See

Là encore nous avons droit à du PaperVision3D avec une belle mosaïque de vidéos présentant les différentes activités et métiers. Au programme : quelques belles vidéos et même une visite guidée d’un F-22 Raptor :

La visite guidée du F-22 Raptor

Dernier exemple avec le site Air Force Echo Zulu, Real Stories of American Airmen. Un concept intéressant car le site mélange storytelling avec un manga animé et séquences de jeux.

La narration du site Air Force Echo Zulu

Les jeux proposés sont basiques mais rapides à prendre en main, ils mettent en scène les A-10 Thunderbolt :

Le mini-jeu de Air Force Echo Zulu

Dernier exemple avec le tout récent Air Force SuperCar. Les ingrédients sont toujours les mêmes : une belle histoire (des ingénieurs de l’Air Force qui construisent un muscle car), de la vidéo et de la 3D dans Flash en page d’accueil avec ce cube :

Le cube 3D de Air Force SuperCar

L’intérieur du site est plus classique avec un player vidéo tout en sobriété :

Le lecteur video de Air Force SuperCar

Voilà, de bine belles réalisations qui doivent faire pâlir notre armée de l’air nationale, même si ces deux armées n’ont pas du tout le même budget ni les même impératifs de recrutement.

MàJ (15/09/2009) : Grâce aux contributions des lecteurs j’ai enfin retrouvé l’URL du site de recrutement de l’armée Suédoise, une expérience incroyablement immerssive. Et j’en profite aussi pour citer le trè bon site de la Marine française : Être marin.

Le mini-site de la Marine française

Vivement qu’ils mettent à niveau les sites en .gouv !

C’est connu, les interfaces riches permettent entre autres d’apprécier plus les produits d’une entreprise. Je vous partage deux nouveaux exemples que j’ai découverts durant la période estivale 2009.

Pâtisserie allemande

L’agence allemande Zum Kuckuck a relevé le défi de mettre en valeur les produits d’un commerce de pâtisserie : la maison Patisserie Walter.

Bien que les effets utilisés (flash) soient du “déjà vu” ( pour les photos, par exemple ), je les ai trouvé pertinents pour ce type de présentation. L’expérience utilisateur est très réussie, à mon avis.

Source : Ipub

Space Maker, de IKEA

Dans la semaine du 21 août, je crois,  IKEA a lancé un mini-site qui permet aux utilisateurs d’imaginer et de créer leurs espaces avec les produits de la compagnie.

Le concept est simple. IKEA présente deux options à l’utilisateur. La première permet de créer un espace de façon libre. La deuxième option, quant à elle, présente des thèmes où les meubles et les éléments de décorations sont déjà en place.

Je trouve l’interface agréable dans son ensemble, mais, à mon avis, il y aurait place à amélioration dans le menu de navigation. Je dois vous avouer, par contre, que je n’arrive pas à relever ce qui me dérange exactement dans le menu. Il y a quelque chose qui cloche… Est-ce le style des icônes ? Est-ce l’agencement des couleurs ? Notez qu’ il est possible de changer la couleur de l’arrière-plan dans le bas de l’écran )… Votre avis ?

Source : Users-experiential

Qu’en pensez-vous ?

En mars dernier, Dans son article “Plus de maturité dans les éditeurs en ligne”, Fredéric Cavazza parlait d’une grande progression dans la qualité et des interfaces proposés.

Toujours est-il qu’aujourd’hui je suis moi aussi très impressionnée par cette progression. Les interfaces sont de plus en plus riches. Voici d’ailleurs 4 outils en lignes que j’ai découvert cette semaine.

Sumo Paint, une alternative à Photoshop

Vidéo sur Youtube :

Hobnox Audiotool, un studio virtuel en ligne

Vidéo sur Youtube :

Produle, un éditeur d’animation

Vidéo sur Youtube :

LovelyCharts, une application qui permet de créer tout genre de diagrammes. Il permet aussi la création de Wireframes.

Vidéo sur Youtube :

Qu’en pensez-vous ?