Cooliris lance les publicités 3D pour iPad

J’ai déjà eu l’occasion de vous parler de Cooliris (anciennement Piclens, cf. Le web dans un écrin avec Cooliris). Pour faire simple, il s’agit d’un plugin de visualisation immersive. Une fois installée, cette technologie permet de sublimer les listes de photos et vidéos avec un affichage en 3D baptisé « Wall » :

L'affichage 3D des listes d'images avec Cooliris

Cette fonctionnalité est disponible pour un certain nombre de sites (Youtube, FlickR, Picasa, Getty, Facebook, Myspace…). J’ai toujours trouvé cette technologie très sympa… sans trop savoir comment ils allaient rentabiliser ce truc.

Dernièrement ils ont lancé la Cooliris Platform, un environnement plus complet intégrant des fonctions de recherche et découverte et plus de contenus. Cette plateforme a de plus été déployée sur iOS pour en faire profiter les terminaux mobiles. Non seulement cette platform se substitue à votre page de démarrage (en intégrant des news) mais elle est également ouverte aux annonceurs qui peuvent y insérer des messages promotionnels et même des objets 3D :

Des contenus sponsorisés en 3D avec Cooliris

Les objets 3D sont parfaitement intégrés au sein du wall qui conserve toute sa fluidité :

Les annonceurs peuvent donc exploiter la 3D sur le wall des utilisateurs ou directement sur une page web. Encore plus fort, ils viennent d’annoncer la disponibilité de la technologie 3D sur l’iPad en s’associant avec le réseau InMobi : InMobi Introduces The First Ever 3D Mobile Ads, With Cooliris.

Les publicités en 3D de Cooliris sur votre iPad

Les Immersive Ads permettent d’attirer l’attention des utilisateurs en exploitant l’accéléromètre de l’iPad et de manipuler un objet 3D en le faisant tourner dans tous les sens (l’appareil photo) :

Le résultat est saisissant et surtout très valorisant pour les produits. À tel point que je me demande dans quelle mesure ces bannières enrichies ne rentrent pas en concurrence avec les iAd d’Apple. Pour le moment les 3D Ads de Cooliris ne se limitent qu’à la fonction 3D, mais qui sait jusqu’où ils peuvent aller ? J’imagine que le coût de production n’est pas le même (Apple propose ainsi un très séduisant iAd Producer), mais le ticket d’entrée annoncé par Apple est tout de même prohibitif !

En tout cas je suis réellement bluffé par le caractère hypnotique des ces bannières couplées à l’accéléromètre de l’iPad. Flash n’est pas disponible pour iOS (et ne le sera sans doute jamais), mais cette solution devrait inspirer bon nombre de développeurs qui vont, je l’espère, s’empresser de reproduire ça sur les touchbooks supportant Flash.

(via TheNextWeb)

Tour d’horizon des outils de visualisation de tweets

Tout comme FlickR à son époque, le succès de Twitter repose (en partie) sur son ouverture et la possibilité d’exploiter sa base de données au travers d’APIs. Cette ouverture permet donc à la communauté de mener diverses expérimentations et manipulation sur les tweets. Il existe un grand nombre de mashups, aussi je me contenterais de vous parler de celles qui concernent les représentations visuelles des vos tweets, followers ou graphe social. L’objectif de ce petit tour d’horizon est de vous faire découvrir les approches et technologies utilisées par la communauté.

Commençons avec la MentionMap d’Asterisq (en Flash) qui analyse votre graphe social en fonction des mentions et RT :

Votre tweetosphère avec MentionMap

Il y a ensuite TweetPivot (réalisé en Silverlight) qui permet une analyse très fine de vos followers en fonction de différents critères cumulables sur la droite de l’interface :

Votre tweetosphère avec TweetPivot

Dans un style beaucoup plus sobre, nous avons Revisit qui s’intéresse plus à la visualisation en temps réel des tweets sur un sujet donné (en Flash) :

Votre tweetosphère avec Revisit

Il y a également TwitterVeen qui propose une représentation en diagramme de Veen réalisée en Java :

Votre tweetosphère avec TwitterVenn

Il y a aussi le très impressionnant (mais très lourd) Twitt3D qui propose une représentation abstraite en 3D (avec Flash) :

Votre tweetosphère én 3D avec Twitt3D

Intéressons-nous maintenant à des réalisations beaucoup plus artistiques avec le très original IS Parade des Japonais de AndroidAU (très long à charger, mais très rigolo, en Flash) :

Vos followers avec IS Parade

Signalons également le très poétique TorisEye qui exploite le moteur de recherche de Twitter (réalisé en CSS et javascript) :

Vos tweets avec TorisEye

Et nous finirons avec l’incroyable SuperTwario, une application disponible pour iPhone :

Vos tweets façon Mario ave SuperTwario

Flash, Silverlight, javascript, Java… les technologies utilisées sont nombreuses et remplissent toutes l’objectif fixé : proposer une représentation visuelle originale (certaines le sont plus que d’autres). Vous connaissiez certainement quelque-uns de ces exemples, mais je trouve intéressant de les confronter et de voir dans quelle mesure la technologie n’est pas réellement différenciante. Ce qui conditionne le succès de telle ou telle représentation est plutôt la façon dont l’information est mise en scène.

En tout cas de très beaux exemples dont vous pouvez vous inspirer (même Mario !).

Préservez les océans en achetant des vagues

Oyé oyé braves gens, les océans vont mal car la pollution guette. Je réponds à l’appel de la Surfrider Fondation pour vous parler du projet My Drop of the Ocean. Ce site s’insère dans le cadre d’une campagne de sensibilisation (pour les internautes soucieux de l’environnement et de la protection des plages) et de mobilisation (récolte de dons et de candidatures au volontariat).

Le principe est simple : récolter des dons en proposant aux internautes de sponsoriser des bouts de plage ou des vagues. Ils appellent ça des drops (1 drop = 1 euro). Le site vous accueille donc par une page d’introduction avec un très beau visuel plein écran, une musique subaquatique ainsi que des petites animations pour simuler le fond des océans. Une première impression très apaisante qui vous attire rapidement vers le coeur de l’application et la carte des drops :

La carte des bouts de plages déjà sponsorisés

En zoomant sur la carte, vous accédez au détail de chacune des plages et à la grille définissant les fameuses drops. Le petit curseur accessible en bas de l’écran vous permet alors de sélectionner une ou plusieurs cases et de faire votre don :

Sponsorisez une vague en achetant des drops

Le site n’a rien de révolutionnaire, mais la réalisation est de qualité et la cause est noble. Tout ceci n’est pas sans nous rappeler l’ambiance très réussie de WaterLife. En tout cas un bel exemple de réalisation sobre, mais efficace.

PS : Ne passez on plus pas trop de temps à choisir vos cases car vous consommerez alors pas mal d’électricité (donc du rejet de CO2).

Les commentaires sont fermés

Vidéo à 360° et réalité augmentée pour Will.I.Am

Même si vous habitez depuis 10 ans dans une grotte, vous devez forcément connaître les Black Eye Peas (ou au moins leurs chansons). Même si leur site web est loin d’être à la hauteur, ils viennent de sortir une application iPhone qui risque de faire grand bruit : Will.I.Apps. Le principe est de vous faire pleinement profiter de leur nouveau titre (« The Time: The Dirty Bit« ) au travers d’une interface vidéo à 360° qui exploite l’accéléromètre de l’iPhone.

La vidéo à 360° des Black Eyed Peas sur votre iPhone

Donc pour vous la faire simple : la vidéo a été filmée avec une caméra à 360° et vous devez tourner sur vous-même pour voir la scène en entier. Cette technologie a été développée par la société 3D360 et fonctionne parfaitement bien.

L’application permet aussi de jouer avec une fonction de réalité augmentée :

Vous ne trouvez pas qu'il est bien installé sur mon canapé ?

Rien de ce qui est disponible dans cette application n’est neuf (vidéo à 360°, réalité augmentée, utilisation de l’accéléromètre…) mais le fait de tout combiner autour du tube d’un des groupes les plus en vogue du moment est un coup de maitre. Pour vous rendre compte du fonctionnement, regardez donc cette vidéo :

L’expérience de visionnage de la vidéo et donc l’appréciation de la chanson est sublimée par les technologies mises en oeuvre. Même si l’application est payante, cette expérimentation va très certainement faire des émules et démocratiser la scénarisation des chansons et contenus (l’important n’est pas tant la création mais plutôt l’expérience proposée). Ça n’a rien à voir, mais figurez-vous que Will.I.Am vient d’être nommé au poste de « Directeur de l’innovation créative » chez Intel : Intel hires Will.I.Am as its ‘Director of Creative Innovation’.

(via Techcrunch)

Les commentaires sont fermés

Vidéo HTML5, la guerre des codecs est déclarée

Très récemment Google annonçait le succès de son navigateur Chrome (Google’s Chrome browser hits 10 percent market share). Ils s’étaient illustrés ces derniers temps par un certain nombre d’actions d’évangélisation d’HTML 5 (Google à l’assaut d’iTunes et d’iOS avec Chrome et HTML5 ? et Google expérimente les ebooks en HTML5). La semaine dernière nous avons pu observer un changement de ton avec l’annonce de l’arrêt du support natif de H.264 dans la prochaine version de Chrome (au profit de WebM) : The Gloves Are Off, Google Chrome Browser Will Drop Support For H.264 Video Codec. Cette annonce n’a pas forcément eu le retentissement qu’elle aurait dû avoir, car elle préfigure une bataille rangée qui s’annonce des plus sanglante !

Pour encoder, il faut passer à la caisse

Avant toute chose, il est important de rappeler certaines notions pour ne pas rajouter à la confusion ambiante :

  • H.264 est un codec promulgué par le consortium MPEG LA (dans lequel on retrouve Microsoft, Apple, Sony, HP, Toshiba, LG…) ;
  • H.264 s’est imposé en peu de temps comme le codec de référence des vidéos HD, c’est également le codec utilisé (entre autres) dans les lecteurs Blue-Ray ;
  • H.264 est un codec gratuit pour un usage non-marchand, cela veut dire que vous ne pouvez pas bénéficier de la gratuité si vous faites payer vos utilisateurs ;
  • WebM n’est pas un codec, c’est un format multimédia qui repose sur 3 technologies : le codec vidéo VP8 (développé par la société On2 Technologies qui a été rachetée par Google en 2010), le codec audio OGG Vorbis et le format de fichier Matroska (qui utilise l’extensino .mkv) ;
  • WebM exploite le codes VP8 qui lui est en open source avec une licence BSD (donc qui est et restera gratuit) ;
  • Même si Chrome ne supporte plus H.264 de façon native, vous pourrez toujours regarder des vidéos encodés avec ce codec au travers de lecteurs vidéo Flash ou Silverlight ;
  • Firefox et Opera supportent nativement le format WebM dans la balise

H.264 est donc un codec largement utilisé pour faire de la vidéo HD sur le web (notamment par YouTube, Netflix, Hulu…) mais qui engendre des coûts de licence. Pour être plus précis : il existe une version gratuite de H.264 (x.264) qui permet de faire de l’encodage avec des solutions software (donc pas très puissante). Mais si vous voulez encoder des vidéos à l’échelle industrielle, il va falloir utiliser des solutions hardware qui sont elles payantes (par nombre de CPU).

Donc si l’on résume : le codec H.264 est gratuit pour les amateurs mais payant pour les gros acteurs (ceux qui vivent de la VOD ou d’autres activités relatives à la vidéo en ligne). Le group MPEG LA a annoncé une totale gratuité de son codec pour un usage non-commercial mais le doute persiste (MPEG-LA Makes Free Internet Video Royalty Free Perpetually). Google a pris la décision de ne plus encourager l’utilisation de ce codec pour une exploitation dans un lecteur video HTML5, mais son usage perdurera au travers des plugins Flash et Silverlight.

(Merci à Mathias Blandin, consultant web & VOD, pour toutes ces précisions)

Flash vs. HTML5 = Apple vs. Google vs. Microsoft

Jusqu’à récemment, Flash était la technologie de référence pour faire de la vidéo sur le web, mais avec l’avènement d’HTML5 (et de sa balise et surtout sans les solutions coûteuses de streaming (exploitant Flash ou Silverlight). Netflix travail ainsi activement à l’éllaboration d’un nouveau standard : Netflix Working on HTML5 Standard for Streaming Video.

Interrogé à ce sujet, Samuel Rohault (le directeur technique de MySkreen) analyse cette situation comme un retour en arrière pour les éditeurs et diffuseurs qui doivent à nouveau se casser la tête sur le choix d’un codec et des technologies qui vont avec. Selon lui, H.264 apparait néanmoins comme la solution la largement répandue au travers de Flash.

Nous nous retrouvons donc avec deux clans :

  • Google, Mozilla, Opera et tous ceux qui veulent pouvoir faire de la vidéo HD avec un lecteur HTML ;
  • Apple, Microsoft et tous ceux qui veulent toucher des royalties en prélevant des revenus à la source (lors de l’étape d’encodage).

Le fait que Google annonce le non-support de H.264 et soit obligé d’expliquer son choix illustre les enjeux du marché de la vidéo HD sur le web (cf. More about the Chrome HTML Video Codec Change). Aujourd’hui nous savons qu’Apple ne peut pas se rallier au premier camp : d’une part car l’ouverture n’est pas son truc, et d’autre part car iOS ne supportant pas Flash, il faut bien que Safari puisse faire tourner les vidéos encodées en H.264 sur iPhone et iPad. La grande question est donc de savoir si Microsoft va basculer dans un camp et assurer le support effectif de WebM dans IE9 (pour le moment la dernière version permet de jouer des vidéos WebM uniquement si le codec VP8 est déjà installé sur la machine).

Peu importe le fait que tel ou tel navigateur supporte le codec H.264 (de toute façon Flash est déployé sur plus de 97% des postes), l’important pour Google est que le plus grand nombre de navigateurs supportent nativement son alternative : le format WebM et son codec VP8. Ils ont donc annoncé dans la foulée la disponibilité prochaine de plugins WebM pour IE et Safari. Un passage en force qui provoque des remous (euphémisme).

iOS vs. YouTube

Nous avons donc un duel avec Google contre Apple et Microsoft (qui lui même est en compétition directe avec Apple). Donc au final c’est plus une guerre à trois entre les ennemis historiques Google vs. Apple vs. Microsoft. Qui va gagner cette guerre ? Il est encore trop tôt pour le dire, mais un atout dans le jeu de Google pourrait bien lui permettre de rafler la mise : YouTube.

Autant Apple a vendu une petite centaine de millions de machines tournant sous iOS, autant les utilisateurs de YouTube se comptent en milliards. Si Google décide d’intensifier le conflit, il lui suffit d’imposer le codec VP8 sur les vidéos HD pour déstabiliser l’ensemble du marché. C’est donc un moyen de pression de formidable. Cela fait déjà un petit moment que Google propose de tester un player HTML5 sur son site mais je ne sais pas quelle est la proportion de vidéos encodées en VP8 par rapport à H.264.

Autre levier de pression de Google : Android. Son système d’exploitation pour smartphone supporte nativement H.264 pour la vidéo HD et le streaming. L’abandon de H.264 serait une nouvelle étape dans cette guerre des codecs, bien que Flash soit également disponible sur Android (donc une situation identique à celle des desktops).

Dernier élément à prendre en compte : la technologie de streaming. Le Progressive Download (la méthode actuellement la plus répandu) consomme en effet beaucoup plus de bande passante que l’Adaptive Streaming (qui ne télécharge que des petits tronçons de vidéo et adapte la résolution et le nombre d’image par seconde). Apple, Microsoft et Adobe proposent chacun leur solution (respectivement HTTP Live Streaming, Smooth Streaming et HTTP Dynamic Streaming) mais exploitent tous le codec H.264. Voici donc un argument décisif en faveur de ce dernier car non seulement il permet d’économiser de la bande passante (et nous allons très rapidement en manquer avec l’explosion des usages de la vidéo HD) mais également d’incruster des messages publicitaires beaucoup plus facilement. En d’autres termes : H.264 permet de faire de l’Adaptive Streaming qui génère des économies de bande passante d’un côté et des revenus publicitaires de l’autre. Deux arguments de poids auquel Google devra trouver une alternative (plus d’infos ici : Adaptive Bit Rate Video Streaming: Why Delivery Will Matter More Than Codec).

Je ne suis pas un spécialiste du secteur, mais mon petit doigt me dit que cette guerre ne concerne pas réellement le marché de la vidéo sur le web, ni sur les terminaux mobiles. Avec WebM, Google est en train de peaufiner son plan d’invasion (de domination ?) de la télévision. 2011 va en effet être une année décisive pour le marché des smart TVs et plus généralement pour le marché des contenus numériques sur les TV connectées (VOD, abonnement…).

L’avenir nous dira comment cette guerre va évoluer, mais je suis prêt parier ma Freebox V.6 que la bataille va se déporter sur la TV.

Une seconde vie pour les contenus digitaux grâce à l’iPad ?

J’ai déjà eu de nombreuses occasions de m’exprimer au sujet de l’iPad et sur les contenus les mieux adaptés aux touchbooks (À la recherche de nouveaux formats hybrides pour les touchbooks et À quand des ebooks enrichis ?). En un peu plus de 6 mois, Apple a écoulé 16 millions d’iPad en 2010 et compte en vendre 30 M en 2011. Une authentique prouesse pour la firme de Cupertino dont l’avidité n’est un secret pour personne : avec l’iPad ils ambitionnent de révolutionner les contenus numériques tout comme ils l’ont fait avec la musique et les jeux pour l’iPhone et l’iPod. Ont-ils les moyens leurs ambitions ? Oui très certainement car ils disposent d’une bonne longueur d’avance sur la concurrence et parce que l’écosystème qui gravite autour d’iOS est suffisamment dynamique pour amorcer cette révolution.

Révolution ou évolution ? C’est en effet la question que l’on peut se poser au vue des premières « transpositions » de contenus numériques en applications tactiles. Le magazine Wired a ainsi été pionnier dans sa démarche de transformation de ses contenus : le magazine papier, qui existait auparavant en format numérique, a ainsi été remanié (pour en faciliter la lecture sur un écran tactile) et enrichi (avec des animations et des vidéos). Le résultat est plutôt réussi et fait maintenant référence :

Sur ce modèle, d’autres éditeurs ont décidés de sauter dans le train en marche en capitalisant sur les contenus existants. Adobe a ainsi eu la très bonne idée de compléter son offre avec la Digital Publishing Suite pour transformer une maquette « papier » en une application iPad (Adobe lance une offensive sur les magazines numériques et les jeux mobiles). Martha Stewart et Bonnier sont ainsi les premiers à expérimenter ce dispositif :

Le plus grand quotidien suédois sur iPad

Dans ces exemples nous parlons bien de transformer un existant en une application tactile. Mais d’autres éditeurs vont plus loin en produisant un contenu exclusif comme Richard Bronson et son magazine Project :

News Corp devraient également proposer dans les prochains mois son propre iMagazine : First image of Rupert Murdoch’s iPad newspaper emerges. Espérons que les prochaines réalisations iront un peu plus loin que ce que propose déjà les autres : une expérience encore très proche du papier.

D’autres acteurs comme Graphic.ly ou Panelfly proposent une approche similaire avec des comics et BD retravaillées pour en rendre la lecture plus immersive :

Des comics revisités sur votre iPad avec Panelfly

Cette conversion nécessite un peu plus de travail mais propose une expérience plus intense pour les lecteurs. Idéalement il faudrait associer les cases avec des bruitages, des voix et des animations, mais le coût de production serait alors beaucoup plus important.

Dernièrement nous avons également commencé à voir apparaitre des expérimentations encore plus intéressantes avec des films réalisés spécifiquement pour les touchbooks : The New Touching Stories App Brings Four Interactive Films to the iPad. Touching Stories est ainsi une application iPad avec 4 histoires à vivre, à mi-chemin entre courts-métrages et jeu vidéo. Le principe est de faire interagir l’utilisateur en lui proposant une histoire à embranchements ainsi que la possibilité d’agir directement sur l’histoire en exploitant des zones réactives ou même l’accéléromètre :

Dans cet exemple nous sommes donc en présence d’un produit hybride qui n’est pas sans rappeler des jeux narratifs comme Dragon’s Lair ou le plus récent Heavy Rain (dont le gameplay repose sur les quick time évents).

Dans un registre identique, le réalisateur israélien Nitzan Ben-Shaul a tourné en 2008 un long métrage à embranchements multiples. Son idée était de faire interagir les spectateurs directement dans la salle de cinéma avec un principe de décision collective (à main levée) : Turbulence, an Interactive Movie, Coming Soon to an iPad Near You. Dans la mesure où il disposait déjà de la matière première, convertir son film en application pour iPad n’a pas représenté une grosse difficulté. Le spectateur peut ainsi agir directement sur l’histoire en influant les actions ou les réactions des personnages :

Le résultat semble pleinement satisfaisant et inaugure peut-être une nouvelle génération de contenus numériques adaptés aux terminaux tactiles. Pas si sûr, car les coûts de production restent élevés et qu’il faut un circuit de distribution suffisamment large pour pouvoir les amortir. Quand Apple aura écoulé 200 millions d’iPads, le contexte de marché sera nettement plus favorable (d’autant plus si les films interactifs peuvent également être lus sur AppleTV). Mais pour le moment il va falloir faire avec la concurrence pour pouvoir atteindre la masse critique de clients potentiels. Ors, les terminaux concurrents en question sont propulsés par un système d’exploitation beaucoup moins fermé (Android) et permettent surtout de consommer des contenus Flash.

Flash ? Oui tout à fait, Flash pourrait être la solution pour sortir de l’enclave d’iTunes et permettre aux producteurs de diffuser (commercialiser) leurs contenus auprès du plus grand nombre. Nous pourrions ainsi tout à fait imaginer un player universel disponible sur un grand nombre de touchbook permettant de consommer ces contenus avec une gestion fine des DRM, une marketplace et même une communauté.

Vous pourriez me dire que cela ne sert à rien de remplacer un système verrouillé (iTunes / iPad) par un autre système verrouillé (DRM, player semi-propiétaire) mais je vous répondrais que les producteurs y trouveraient sûrement leur compte. L’objectif étant de monétiser des contenus de qualité auprès du plus grand nombre.

Bref, tout ça pour dire que le format touchbook évolue réellement dans le bon sens en s’éloignant des usages propres aux smartphones et en proposant des expériences nouvelles (mais à partir de contenus existants). Offriront-ils une seconde vie aux contenus numériques existants ? Oui certainement, en tout cas les producteurs auraient bien tort de se priver.

Stage Video améliore la performance des vidéos HD dans Flash

J’ai déjà eu l’occasion de vous parler des différentes annonces d’Adobe (Récapitulatif des annonces pour Adobe MAX 2010) mais je n’ai pas mentionné Stage Video. Il s’agit d’une nouvelle API permettant de faire de l’accélération matérielle pour les vidéos H.264. Traduction : avec le Flash player 10.2, c’est le puce graphique et non le processeur qui va décoder les vidéos HD. C’est donc une très bonne nouvelle car :

  • un processeur qui est moins sollicité pour décoder de la vidéo (Adobe parle d’une réduction de charge de 85%) est plus disponible pour exécuter d’autres tâches (manipulation ou effet visuels) ;
  • les machines moins puissantes (netbooks, tablettes…) vont enfin pouvoir exploiter correctement les vidéos Flash. Rappelons pour mémoire que des sites comme YouTube ou Dailymotion sont actuellement inutilisables sur un netbook (dommage !).

Sans trop rentrer dans les détails techniques, Stage Video permet d’envoyer le flux vidéo directement vers la puce graphique sans transiter par le processeur. Vous pouvez tester cette nouveauté en installant la version beta du Flash player 10.2 mais elle n’est pas encore stabilisée (Flash 10.2 disponible en beta avec Stage Video). Sinon vous pouvez regarder cette démonstration publique :

Pour celles et ceux qui veulent aller plus loin, je vous propose de lire attentivement le très bon article de notre Thibault national qui nous explique comment activer et exploiter le Stage Video : Getting started with stage video.

Décidément l’année 2011 pour les équipes d’Adobe va être consacrée à une meilleure exploitation de la puce graphique. L’explication de ce vaste chantier est à mon avis l’arrivée à maturité des terminaux alternatifs : de nombreux nouveaux modèles de touchbooks vont ainsi être dévoilés lors du CES de Las Vegas, mais c’est surtout pour le marché des TV connectées que le Stage Video va être intéressant. Nos ordinateurs sont ainsi largement capables de décoder de la vidéo HD (avec une limitation pour les netbooks) mais les processeurs des TV connectées sont sous-dimensionnés pour ce genre d’opération. D’où la nécessité d’avoir recours à la puce graphique. Les télévisions et boitiers Google TV seront ainsi les premiers équipés de cette nouvelle version. CQFD.

2011 sera-t-elle l’année de la 3D grâce à Chrome et Firefox (et Flash) ?

J’ai déjà eu l’occasion de vous parler de 3D dans le navigateur ainsi que de WebGL. Mais à l’époque, j’en parlais au futur. Il semblerait pourtant que cette spécification d’affichage 3D dans le navigateur soit sur le point d’être généralisée grâce aux toutes dernières versions des navigateurs Chrome (Chrome 9 Sandboxes Flash and Adds WebGL Support) et Firefox (WebGL introduced in Gecko 2).

Pour mémoire, WebGL est une spécification développée par le Khronos Group qui permet d’animer des objets 3D dans votre navigateur en utilisant directement la puce graphique et non le processeur. Ça, c’est la théorie, car dans la pratique une animation conséquente monopolise toujours une bonne partie des ressources du processeur. Ceci étant dit, rappelons que cette spécification est encore en développement et qu’elle va encore subir de nombreuses améliorations afin d’optimiser son mode de fonctionnement (qui sollicite à la fois le DOM via javascript, l’API WebGL et le pilote OpenGL).

Jusqu’à présent, les rares expérimentations présentées me faisaient penser aux megademo de mon fidèle Amiga 500, mais commencent à sortir des choses tout à fait aptes à convaincre le grand public et les annonceurs. À commencer par le tout récent Google Body Browser. Cette application permet ainsi d’explorer les différentes couches du corps humain :

Explorer un corps humain avec Google Body Browser

L’animation est incroyablement fluide et il est possible d’observer l’anatomie du sujet sous tous les angles en jouant même sur la transparence des différentes couches. Cerise sur le gâteau, il y a même un moteur de recherche :

Détail des os du pied dans Google Body Browser

Voici donc une première démonstration de force de Google qui entend bien coiffer Firefox au poteau sur le domaine de la 3D avec une section entièrement dédiée à WebGL sur le site Chrome Experiments. Il est ainsi possible d’admirer un certain nombre de démos techniques comme cet aquarium que l’on peut observer sous différents angles en choisissant le nombre de poissons :

Un aquarium et des poissons, mais pas de Flash

Il y a aussi des choses plus abstraites et artistiques comme ce champ où le vent anime de façon aléatoire plus d’un millier de hautes herbes :

Plus de 500 herbes hautes animées de façon aléatoire

Mais on y trouve aussi des applications plus concrètes comme ce configurateur qui permet de personnaliser une figurine en 3D :

Customisez votre personnage avec WebGL

En cherchant dans Google, il est également possible de trouver tout un tas d’expérimentations récentes avec WebGL comme celle proposée par les équipes de KataLab qui ont créé un univers virtuel reposant sur cette technologie : WebGL powers 3D virtual world on the Web. Ce KataSpace n’a ainsi rien à envier à ce que l’on peut voir sur Second Life :

KataSpace, l'univers virtuel exploitant WebGL

Alors ça y est ? Les technologies standards ont donc remporté la bataille de la 3D en temps réel dans le navigateur ? Non pas tout à fait dans la mesure où Flash n’a pas dit son dernier mot, loin de là. Même si les dernières générations de navigateur sortiront en début d’année, il faudra tout de même quelques années avant de renouveler de façon significative le parc. Par contre, il faut 3 mois à Adobe pour déployer une nouvelle version de Flash, et la prochaine itération (nom de code Molehill) sera un authentique bon en avant : Introducing the Molehill 3D APIs.

Au final ce n’est ni Adobe, ni Google, ni Firefox, ni aucun acteur qui va remporter la bataille, car tout le monde va en profiter quelle que soit la technologie utilisée : les producteurs de contenus, les éditeurs de jeux en ligne, les internautes… Attendez-vous donc à une année 2011 particulièrement riche en contenus 3D.

Vers une scénarisation des contenus textuels

Il y a quelque temps j’avais parlé d’un site institutionnel édité par Linksys (Where Life Connects qui n’est plus en ligne) qui faisait une utilisation particulièrement intéressante des transitions : Vive les transitions. Oui mais voilà, à l’époque pour réaliser ces effets de transition il fallait utiliser du Flash. Oui je sais, utiliser du Flash pour animer des blocs de texte est une drôle d’idée…

Nous sommes maintenant presque en 2011 et les choses ont beaucoup changé, notamment avec l’évolution des technologies web (HTML5, cSS3 et javascript). Il est maintenant possible de réaliser un grand nombre de raffinements graphiques et de petites animations tout en respectant les standards web (cf. CSS3 et javascript seront-elles les technologies RIA du future ?) et l’exemple que je vous propose ne fait que confirmer une tendance grandissante.

Ainsi, la brasserie Cascade propose un site à l’interface très avant-gardiste, mais n’utilisant que du javascript et des CSS3 :

La page d'accueil de Cascade Brewery

Cette page d’accueil se présente en fait comme un plan du site où chaque page est représentée par une boite. Si vous modifiez les manettes du menu, les boites se réorganisent pour faire remonter le contenu qui correspond le mieux à vos réglages :

Une page d'accueil différente pour Cascade Brewery

Dans l’absolu, je suis bien d’accord avec vous : cette mise en page ne sert strictement à rien, un plan du site plus traditionnel serait bien plus efficace. Il n’empêche, ce site peut être considéré comme un message adressé au marché. Un message qui dit : « Nous n’avons pas peur d’innover pour nous différencier, et nous pouvons le faire sans dépendre d’une solution propriétaire« .

Bon OK, je ne pense pas que leurs revendications vont jusque-là, mais ce site nous prouve que les mentalités sont petit à petit en train d’évoluer et que la déferlante HTML5 est en marche (lire à ce sujet Why We Should Start Using CSS3 and HTML5 Today et HTML5, Mozilla and the Future of the Web).

Tout ceci nous amène donc au sujet réel de cet article : la mise en scène des contenus textuels. Jusqu’à présent, les technologies standards ne remplissaient qu’une seule fonction : l’affichage. Avec l’avènement des navigateurs de nouvelle génération (dont IE9 fait partie), de nouvelles possibilités vont voir le jour en ce qui concerne l’animation et surtout les transitions. Les CSS3 et Javascript (jQuery pour l’exemple cité plus haut) permettent ainsi de réaliser des petites animations à l’ouverture des pages pour guider l’oeil et scénariser l’affichage de l’information. Ce qui nécessitait le recours à des technologies riches (en l’occurrence, Flash pour l’exemple cité en début d’article) est maintenant possible avec les standards web.

J’ai déjà eu l’occasion de m’exprimer sur ce sujet, mais je réitère mon enthousiasme et mes prédictions : 2011 va être l’année du renouveau pour les interfaces web avec la possibilité de choisir n’importe quelle typographie et de l’animer à loisir (ou du moins de faire des animations et transitions de premier niveau). Il existe quantité d’autres exemples (comme ce très beau carrousel : CSS3 Transition Demo) qui illustrent cette transition de Flash vers HTML.

Un dernier exemple pour la route ? Ben The Bodyguard.

(via Choblab)

Microsoft affine sa stratégie RIA avec Silverlight 5

La semaine dernière, Scott Guthrie a présenté à la communauté de développeurs la future version de Silverlight : Announcing Silverlight 5. En résumé : Silverlight 5 marquera un changement de cap pour Microsoft qui a visiblement pris la décision d’en faire un produit de niche et d’abandonner sa volonté d’en faire le fossoyeur de Flash (même si je reste persuadé qu’il est délicat de comparer ces deux technologies).

Changement d’approche pour les RIAs chez Microsoft

Revenons un peu en arrière pour bien comprendre le contexte : En début de mois Microsoft annonçait à la surprise générale qu’ils abandonnaient la technologie Silverlight pour l’interface de Bing Maps au profit d’HTML5 : Bing Maps dropping Silverlight for HTML5.

Bing Maps et son interface en Silvelright (enfin je crois)

Un gros doute c’est alors emparé de la communauté qui a pensé que Microsoft était en train de doucement enterrer Silverlight comme il l’a fait avec d’autres produits. L’annonce de la semaine dernière a ainsi été l’occasion de préciser la vision de Microsoft (cf. The Future of Microsoft Silverlight) :

  • Silverlight sera la technologie de référence pour les contenus rich media et les applications métier ;
  • Silverlight sera également la technologie RIA exploitée sur les terminaux alternatifs (Windows Phone et Xbox) ;
  • Les applications et services en ligne « universels » seront proposés en HTML5 pour assurer une compatibilité totale.

Voilà qui est maintenant beaucoup plus clair et surtout cohérent avec la nouvelle version de Bing ainsi que la sortie prochaine d’IE9. Une posture qui est également cohérente avec les points forts de la technologie (Canal+ et France24 choisissent Silverlight pour faire du streaming HD) ainsi que la réalité du marché (qui n’a pas réellement besoin d’un concurrent direct à Flash).

Focalisation sur les médias et les applications d’entreprise pour Silverlight 5

La cinquième version de Silverlight proposera donc un certain nombre de nouveautés pour la partie média :

  • Exploitation de la puce graphique pour décoder des vidéos ou faire de la 3D en temps réel ;
  • Possibilité de faire des légers ralentis d’une vidéo sans perte de qualité du son (comme peut le proposer Flash : Auto-apprentissage en vidéo et ralentis audio sur EnglishCentral) ;
  • Améliorations de la gestion de l’énergie (blocage de l’économiseur d’écran) et prise en charge de la télécommande.
La possibilité de ralentis de Silverlight 5

Se spécialiser sur les contenus vidéo n’est pas forcément une mauvaise idée, car il y a un marché gigantesque avec la VOD. De ce point de vue là, Silverlihgt va donc devenir un concurrent du Quicktime Player d’Apple.

De nombreuses autres améliorations sont également prévues pour la partie applicative avec l’accélération matérielle, un meilleur rendu du texte, de meilleures performances et une gestion plus fine des données (dont vous trouverez des détails en français dans cette interview : « Silverlight améliore son intégration à Windows, mais perd en portabilité« ).

Le focus sur les applications d’entreprise confirme également la stratégie de Microsoft qui capitalise sur son environnement de développement Visual Studio. Vous noterez au passage que l’accélération matérielle semble donc être le nouveau cheval de bataille des éditeurs (Adobe, Microsoft, Google mais également Mozilla)…

Une grande victoire pour HTML5 ?

La nouvelle posture de Microsoft confirme donc l’engouement de l’industrie pour HTML5 dont rien ne semble arrêter la progression. Dernière preuve en date : après Aviary, c’est au tour de Grooveshark de proposer une nouvelle interface en HTML5 :

La nouvelle interface en HTML5 de Grooveshark

Pour le moment nous n’observons que des « petites » initiatives à droite et à gauche, mais la sortie imminente de Chrome OS devrait définitivement valider la viabilité d’HTML5 comme langage de prédilection pour les applications en ligne.

HTML5 marque-t-il donc le point de la victoire face aux technologies RIA propriétaires ? Absolument pas, j’ai déjà eu l’occasion de vous expliquer pourquoi HTML5 et Flash ne peuvent être comparés, et je le répète une nouvelle fois : HTML5 peut faire bien plus de choses qu’HTML4 (notamment avec CSS3 et javascript) mais ne pourra en aucun cas offrir une expérience aussi riche que des plug-ins comme Flash, Silvelright, Unity3D…

En tout cas s’il y a bien une chose dont je suis certain, c’est que 2011 sera l’année des RIAs, quelle que soit la technologie utilisée.