InterfacesRiches.fr

Alors que Google est en train d’accélérer le rythme des innovations autour de son navigateur, les équipes de Chrome Experiment viennent de publier une nouvelle démonstration technologique autour de HTML5 particulièrement intéressante : Arcade Fire, HTML5 and Chrome. Cette expérimentation artistique met en scène le dernier titre du groupe Arcade Fire dans une chorégraphie de fenêtres orchestrées par le réalisateur Chris Milk : The Wilderness Downtown.

The Wilderness Downtown avec HTML5

L’objectif affiché de cette création artistique est de valoriser des techniques comme la balise vidéo, le rendu 3D de la balise Canvas (avec le nuage d’oiseaux), la manipulation d’objets (les cartes issues de Google Maps et Hearth), la synchronisation des fenêtres, les dessins procéduraux (voir la capture en dessous), les filtres couleur appliqués aux images ainsi que l’incrustation de sprites dans les vues aériennes et les streets views.

Dessin vectoriel séquentiel et fenêtres synchronisées

Le tout forme une expérience inédite mais qui consomme tout de même beaucoup de ressources. Qu’importe, j’imagine que l’objectif de Google est de démontrer la supériorité de son navigateur et surtout d’illustrer des possibilités jusqu’alors inexploitées. Des possibilités inexploitées par un navigateur… ça ne vous dit rien ? Avec cette démonstration Google est en train de préparer tranquillement l’opinion publique à la sortie de son web OS éponyme (programmée pour la fin de l’année) qui va devoir se heurter au scepticisme des clients qui vont avoir bien du mal à faire le deuil du couple OS / logiciel auquel ils sont attachés.

Même si cette expérimentation nous prouve surtout que les navigateurs sont limités en capacité de traitement, ils préparent déjà la suite avec un gros coup : Une nouvelle version de Chrome capable d’exploiter la carte graphique des ordinateurs (Hardware Acceleration is Coming to Chrome). Petit à petit, Google est donc en train de creuser l’écart avec ses concurrents et surtout de préparer l’avenir avec un Chrome promu au status de plateforme : OS + Navigateur + App Store (cf. Chrome OS Gets Ready for Gaming). Selon cette perspective, Chrome ne serait plus réellement un concurrent de Firefox ou encore d’IE, mais plutôt d’iTunes et d’iOS. À suivre…

(via The Next Web)

Les habitudes de consommation changent, et les éditeurs évoluent avec elles. Ainsi nous passons de plus en plus de temps sur les terminaux alternatifs comme les smartphones ou les touchbooks, et cette tendance va s’accroître fortement au vue des prévisions. Pour anticiper cette évolution Adobe a tout récemment lancé deux initiatives pour renforcer sa légitimité sur ces terminaux alternatifs.

Il y a tout d’abord l’annonce du lancement de l’offre Digital Publishing qui permet de publier des contenus de type magazine sur des touchbooks. Le premier exemple visible est le portage du magazine Wired sur l’iPad. Après cette première expérience réussie, et la petite scène de ménage en public (cf. Vivement la fin du conflit entre Apple et Adobe), Adobe propose maintenant une extension à la suite InDesign pur pouvoir intégrer des contenus multimédias et concevoir une interface adaptée aux touchbooks : Adobe to Roll Out New Publishing Software for Tablets.

L'outil de publication de magazines numériques d'Adobe

Cette extension est composée du Digital Content Bundler qui permet d’importer des sources, de les retravailler, d’y ajouter des meta-données ainsi qu’une couche d’interactivité et de les publier dans un format propriétaire (le .issue). L’autre partie de l’offre est le Digital Content Viewer, un module de visualisation qui est proposé aux éditeurs pour qu’ils puissent distribuer leurs magazines.

La version numérique du magazine Wired

Je ne rentrerais pas dans les détails de l’offre, mais cette dernière me semble tout à fait adaptée aux contraintes des éditeurs (ne pas révolutionner leur chaîne de production) et va permettre d’abaisser grandement le coût de transformation des publications (enfin je pense, si vous avez des retours d’expérience je suis preneur). Cette offre nous prouve donc deux choses :

1. Adobe compte bien maintenir sa position dominante sur le créneau des outils d’édition
2. Adobe n’est pas tant fâché que ça avec Apple (après tout ils ont besoin l’un de l’autre)

Plus d’infos ici : Creating Digital Magazines et Advancing the future of digital publishing.

Deuxième initiative, un grand concours de développement de jeux sur mobile avec Flash (sur le plateforme Android) auquel participent trois gros acteurs (Kongregate, Flash Game Licence et Mochi Media).

Jeux mobiles avec Flash sur le Nexus One

Il y a ainsi près de 30.000$ de gains pour chacun de ces concours qui récompensera les meilleurs jeux mobiles (en fonction de leur jouabilité, de l’esthétisme et des performances techniques). Adobe n’en est pas à son premier gallop d’essai pour les jeux mobiles en Flash (Kongregate Tests New Android Flash Implementation With 100+ Games) mais ce concours devrait fortement stimuler les développeurs. Nottons au passage l’effort de pédagogie réalisé par Kongregate qui profite de l’occasion pour publier des recommandations parfaitement bien documentées : Best Practices for Adobe Flash Multiscreen Gaming.

À ce sujet je suis à la recherche de sources donnant des ordres de grandeur de coûts / temps de développement d’applications ou jeux mobiles selon les plateformes (iPhone, Android, BB, Symbian). Si vous avez des liens, merci des les partager dans les commentaires.

(Merci à Damien D. pour les liens)

La réalité augmentée est décidément un sujet chaud en ce moment. Et ça tombe bien car Total Immersion, le pionnier et le leader de ce créneau (Cocorico !), vient de lancer un module pour Flash : Total Immersion enhances its D’Fusion platform with the launch of its new augmented reality Adobe Flash module. Jusqu’à présent, pour faire de la réalité augmentée avec votre webcam vous aviez le choix entre utiliser une technologie propriétaire comme celle de TI (qui fonctionne très bien mais nécessite un plug-in : Olympus utilise la réalité augmentée pour la démo de son nouvel APN) ou utilisé une brique open source comme FLARToolkit mais qui ne fonctionne qu’avec un marqueur. Un choix pas évident car si Flash est installé sur 99% des ordinateurs, la nécessité d’imprimer une page avec un marqueur dessus est plus que bloquant. D’un autre côté, installer un plug-in est toujours pénible, mais la solution de Total Immersion peut se passer de marqueur donc fonctionner avec n’importe quel support 2D.

Ce choix est maintenant derrière nous avec la mise à disposition du module D’Fusion for Adobe Flash Player. Le principe est de proposer un environnement de développement générique (D’Fusion) et différents modules de déploiement (ordinateur, mobile, web…). Je vous recommande de tester la démo pour bien appréhender le potentiel de cette technologie :

La réalité augmentée avec Flash et sans marqueur

Encore une fois, tout l’intérêt est de pouvoir faire de la réalité augmentée SANS marqueur, donc d’exploiter des supports génériques comme des publicités ou des logos de marque. De nombreuses possibilités sont ainsi ouvertes, à commencer par des dérives comme cette campagne anti-BP : Are We Entering the Age of Augmented Trademark Infringement?.

Mais le principal avantage que je vois dans cette annonce est de pouvoir profiter du portage de Flash sur les smartphones Android pour faire rimer réalité augmentée et mobilité. Le gain de temps pour monter une opération est très significatif.

Bref, je me réjouie de cette annonce, d’autant plus qu’elle concerne une entreprise française ! Au passage, s’il y a des personnes de chez Total Immersion qui lisent ce blog, je suis partant pour une petite interview et plus si affinité (comme un visite de la cellule R&D par exemple…).

(et éventuellement s’il y a un ou deux AR.Drones qui trainent chez Parrot, je suis preneur aussi !)

(Ha mince, rien à voir, si ce n’est que se sont deux sociétés françaises)

(Bon c’est pas grave, j’ai déjà publié le billet…)

(via R/W W)

Après trois mois de spéculations irraisonnées et d’escarmouches par articles interposés, il semblerait que la gue-guerre entre supporters d’HTML5 et supporters de Flash soit enfin calmée (cf. Pourquoi HTML5 et Flash ne peuvent être comparés). Maintenant que les arguments des uns et des autres ont été entendus, ceux qui sont réellement légitimes sur le sujet (les producteurs de contenus, pas les analystes du dimanche) commencent à s’exprimer et à faire entendre un son de cloche très différent des ayatollahs des standards web :

• HTML5 Vs. Flash. What You Haven’t Heard, où l’auteur nous explique qu’HTML5 n’est pas un choix suffisamment mature pour les jeux en ligne. Flash propose ainsi une solution plus intéressante notamment pour le preloading, pour la simplicité d’animation de sprites et de fonds, pour le P2P, pour l’encaspulation de jeux en un fichier unique,  pour les performances… Bref, les producteurs de jeux en ligne restent fidèle à Flash même si nous voyons des choses très intéressantes pour HTML5 (cf. Les jeux en HTML5 deviendront-ils une réalité ?).
• HTML5 And Flash: Why It’s Not A War, And Why Flash Won’t Die, où le fameux Smashing Magazine nous explique que Flash va progressivement reprendre la place qu’il aurait toujours dû occuper (animations multimédia, jeux…) mais qu’il ne va en aucun cas être remplacé par HTML5.
• Why Porn and the iPad Are Key for HTML5, où l’on nous explique que les éditeurs de contenus pornographiques en ligne migrent vers des lecteurs vidéo en HTML5 pour draguer les utilisateurs d’iPad et espérer vendre plus de services premium. Tout en sachant que ces fameux services premium exploiteront de toute façon un lecteur vidéo en Flash pour mieux protéger les contenus et bénéficier de DRM solides. Cet avis est également partagé et détaillé ici : Why HTML5 Video Won’t Replace Flash.
  

  Le gros problème d'HTML5 avec les contenus vidéo

• Pardon Our Dust, où les équipes de Hulu expliquent les avantages de Flash comme lecteur vidéo (adaptive streaming, égalisation du volume de publicités, flexibilité du sous-titrage, seek preview, video analytics…).
• Flash and the HTML5 <video> tag, où les équipes de YouTube listent les avantages de Flash (utilisation de nombreux codec dont le WebM, protection des contenus sous licence, exportation très simple du lecteur, vidéo en plein écran, accès très simple à la webcam et au micro…).

Et pour enfoncer le clou, les équipes de YouTube viennent même de publier un jeu qui mélange très habilement le contenu de plusieurs vidéos ainsi que des briques externes (formulaire, cartes…) : Google Chrome FastBall – A Race Across The Internet.

Un jeu sur Youtube qui mélange plusieurs types de contenu

Bon OK, même si ce jeu est surtout là pour vanter les mérites de Chrome, ça fait quand même du bien d’avoir des avis d’acteurs légitimes pour définitivement clore ce débat qui a trop duré.

Décidément il ne se passe pas une semaine sans que l’on parle de développement mobile et d’HTML5. Je profite donc de cette actualité pour traiter les deux sujets en même temps : Sencha (anciennement Ext JS) vient de sortir un framework de développement d’applications mobile reposant sur HTML 5 (Introducing Sencha Touch, HTML5 Framework for Mobile).

Sencha Touch pour vos développements mobiles

Pour celles et ceux qui se posent la question : “Un framework est un ensemble d’outils conçus en vue d’aider les programmeurs dans leur travail en permettant notamment la réutilisation du code” (adapté de la définition de Wikipedia). Traduction : Un framework vous permet d’assembler des bouts de code pour accélérer et standardiser le développement d’une application. Dans le cas d’une application mobile, ce framework est particulièrement intéressant avec la multiplication des plateformes mobiles. Plus de plateformes = Plus de versions = Plus de temps de développement.

Ce framework est donc compatible avec iPhone, iPad et Android (soit 90% des mobinautes). Il propose les fonctionnalités suivantes :

• Un moteur d’affichage en HTML5 / CSS3 ;
• Intégration de nombreuses icônes et transitions ;
• Prise en charge de la géolocalisation et du multitouch ;
• Manipulation des données facilitée avec Ajax et JSON, possibilité de stockage en local ;
• Publié sous licence GPL V3.

Le plus intéressant dans tout ça est l’utilisation intensive d’HTML5 pour exploiter au mieux les fonctions natives des terminaux ciblés (notamment pour els formulaires) tout en offrant une large gamme de représentations et comportements (voir à ce sujet les démos et le Kitchen Sink). Je ne reviendrais pas sur le grand débat application vs. HTML5 (lire à ce sujet mon précédent article : Vous êtes plutôt application mobile ou site web optimisé pour les smartphones ?) mais je pense tout de même que cette solution repose sur des fondamentaux technologiques tout à fiat viables : A HTML5 Primer for the Overwhelmed.

Je suis incapable d’évaluer la qualité des librairies proposées aussi je m’en remet à vos commentaires pour cet aspect là (vos retours d’expérience sont les bienvenus). Pour le moment ce framework est publié en licence open source, mais ils précisent qu’une licence payante est en cours de production (attendez-vous donc à sortir votre CB pour la V.2).

(via Techcrunch)

Un peu plus de 6 mois après la disponibilité des versions beta, Adobe annonce le même jour le lancement des nouvelles versions de Flash et AIR : Adobe AIR 2 Now Available et Flash Player 10.1 Now Available for Windows, Mac, and Linux.

Commençons par Flash avec cette nouvelle version 10.1 qui apporte les améliorations suivantes :

• Meilleure gestion des ressources (processeur et mémoire), les animations tournant dans un onglet non-visible seront ainsi mises en sommeil ;
• Des vidéos HD plus fluides (accélération matérielle pour le décodage du format H.264, implémentation de HTTP Dynamic Streaming) ;
• Des vidéos P2P plus performantes avec le Real Time Media Flow Protocol ;
• Nouvelles API multitouch ;
• Prise en compte du mode “Privacy” des navigateurs ;
• Meilleures performances sou Mac (surtout avec Safari).

Les équipes insistent sur le fait que cette nouvelle version représente un bon en avant et pas seulement une incrémentation de 0.1 dans la version. OK mais alors pourquoi ne pas l’avoir nommé Flash 10.5 ? En tout cas j’espère que nous pourrons constater les améliorations sur des applications innovantes comme Tweet for Honor (disponible bientôt).

Concernant AIR, voici la liste des nouveautés :

• Amélioration de la stabilité et des performances (utilisation de 30% de mémoire en moins) ;
• Support de HTML5 et CSS3 (et notamment de l’élément <canvas>) ;
• Meilleur support du système de fichier ainsi que des processus d’installation et d’impression ;
• Prise en charge du code natif avec l’API NativeProcess.

Des nouveautés qui ne seront donc pas forcément visible à l’oeil mais qui vont grandement améliorer ce qui se passe sour le capot. Pour tester tout ça, je vous recommande un petit tour sur la marketplace d’applications.

Normalement sur ce blog je ne traite que des sites web et applications proposant des interfaces enrichies (donc qui font plus qu’afficher du texte et des images), mais je souhaiterais aujourd’hui sortir de ce cadre et vous faire découvrir un concept d’interface transparente pour ebooks : Text 2.0. Par interface transparente, je fais référence à une interface invisible (pas de menu, de boutons ou d’icônes) qui serait pilotée par le regard :

Ce concept nécessite donc le recours à une webcam placée au dessous de l’écran qui capterait le regard de l’utilisateur et permettrait de déclencher des actions selon des comportements définis à l’avance.

Prototype de ebook utilisant une interface transparente

Par exemple si un lecteur s’attarde sur un mot, sa définition est affichée dans une bulle :

La définition d'un mot affichée si le regard est fixe

De même, si un lecteur se contente de survoler le texte et de lire en diagonale, l’interface va masquer la majorité des mots pour mettre en évidence ceux qui ont le plus d’importance d’un point de vue sémantique :

Masquage des mots superflus par faciliter le survol d'un texte

Fonctionnalité bonus, si un lecteur prend le livre électronique en main et parcours la page de façon chaotique (il cherche sa ligne), l’interface affiche une petite flèche pour l’aider à reprendre sa lecture là où il l’avait laissée : :

L'interface qui vous aide à retrouver votre ligne

Magie ? Non, technologie. Ici le concept est poussé à l’extrême, mais il serait tout à fait possible de proposer ces fonctionnalités en complément de menus et boutons (recherche, accès à l’index…). L’idée serait alors d’assister l’utilisateur dans son quotidien ou plutôt de modifier légèrement le protocole d’interaction pour lui simplifier la vie. En tout la plus-valeur d’une telle interface justifie largement l’implémentation d’une webcam dans un ebook (c’est tout de meme plus discret qu’une EyeSeeCam !).

(via Wired)

Le mois dernier MSN a lancé un nouveau magazine en ligne (Glo.msn.com) avec une mise en page des plus surprenantes :

La page d'accueil de Glo

À l’origine de ce projet il y a un partenariat avec BermanBraun et Hachette Filipacchi Media pour monter un féminin en ligne (cf. Glo launches today on MSN.com) proposant une expérience très différente de ce que l’on connaissait déjà. D’après ce que j’ai compris, le contenu est issu des différentes publications du réseau MSN mais c’est bien dans la façon de consommer les contenus que ce magazine innove : Pas de pages intérieures ou de rubriques, tout se passe sur la page d’accueil avec un système de défilement vertical.

L’idée est de présenter une couverture par jour avec des articles auxquels on accède en cliquant sur le titre (ou en défilant la page vers le bas). Les articles peuvent être des diaporamas ou des vidéos :

Un contenu vidéo dans Glo

Il y a également des articles plus classiques avec du texte :

Un article dans Glo

Notez également la possibilité de mettre des côté des articles ou des produits dans le Scrapbook (accessible en utilisant Facebook Connect) :

Le système de Scrapbook dans Glo

Au final nous avons donc un magazine en ligne au format surprenant mais tout à fait convainquant. Il ne faut pas être devin pour se rendre compte que ce format est particulièrement adapté aux touchbooks car il n’y a pas de clic, juste du défilement vertical. Ce n’est donc pas un hasard si ce magazine n’est pas en Flash (à par le Scrapbook) mais en HTML pour pouvoir être accessible depuis n’importe quel tablet ou terminal alternatif.

Notez également que MSN n’en est pas à son premier coup d’essai puisqu’ils avaient déjà lancé WonderWall, un portail orienté entertainement avec un principe de défilement horizontal :

Qui peut me confirmer que ce site passe très bien avec l’iPad ?

Décidément il y a des petits malins chez Apple qui se plaisent à entretenir le conflit du moment (cf. Vivement la fin du conflit entre Apple et Adobe) car nous venons de découvrir qu’Apple travaillerait sur un concurrent de Flash : Apple is developing a Flash alternative. Un concurrent de Flash ? Non pas tout à fait car il s’agit d’un framework javascript pour réaliser des interfaces riches. Le nom de code de ce framework est Gianduia et serait une version browser-side de Cocoa avec un peu de CoreData et de WebObject dedans (pour les détails c’est ici : Gianduia, une alternative à Flash ?).

Donc ce Gianduia serait en fait beaucoup plus proche de framework comme SproutCore, Cappucino (déjà utilisé par Apple pour MobileMe et iWork) ou JavascriptMVC que de technologies avec plugin comme Flash ou Silverlight. Ce framework permet de faire des interfaces en HTML / CSS / javascript avec un affichage et un comportement cohérent entre les différents OS et navigateur. Cela permet de gagner du temps et standardiser les développements.

Exemple d'interface en javascript utilisée par Apple

Dans l’absolu Apple est carrément en retard sur ce coup là car il existe d’autres framework à la philosophie proche ainsi que de nombreuses bibliothèques dont certains proposés par de grands éditeurs comme Spry d’Adobe ou YUI de Yahoo! ou des bibliothèques open source comme jQuery ou Dojo.

Je ne me lancerais pas dans un comparatif de ces frameworks / bibliothèques, mais je sais qu’il faut beaucoup de moyens et d’énergie pour développer et maintenir une offre viable dans ce domaine. Eventuellement Apple pourrait proposer du code optimisé pour son navigateur (Safari) mais celà restreindrait carrément le champ d’application.

…

…

…

…

…

…

…

…

…

Un framework RIA en javascript qui serait proposé par l’éditeur d’un navigateur web. Ça ne vous rappelle personne ? Google peut être avec GWT et Chrome. Donc au final ce Guianduia est plus un concurrent de GWT que de Flash (cf. Avec Gianduia, Apple vise Flash et Silverlight, mais aussi GWT).

Je pense qu’il faut donc nuancer cette annonce et y voir une technologie utilisée en interne chez Apple plutôt qu’un concurrent direct de Flash. Donc on se calme (d’où le titre du billet).

Vous connaissez iTunes ? Vous connaissez les comics ? Alors vous adorerez Graphic.ly, un lecteur de comics numériques. En fait ce n’est pas tant un lecteur qu’une plateforme, car Graphic.ly ambitionne d’être aux comics ce qu’iTunes est aux chansons : Une plateforme complète pour consulter, gérer, acheter et même sociabiliser.

Il vous faut donc télécharger l’application (qui tourne sur AIR) et créer un compte. Vous accédez alors à l’écran d’accueil qui est subtil mélange de Twitter (pour le flux d’activités), de l’App Store (pour les meilleures ventes) et de l’Adobe Media Player (pour le côté sobre et élégant de l’interface) :

Le basculement entre les écrans est très fluide et l’on trouve tout de suite ses repères, notamment dans la boutique qui est un modèle de sobriété :

Là où ça devient intéressant, c’est dans la partie News où vous pouvez consulter différents flux RSS de blogs dédiés aux comics mais dans l’environnement de l’application (mêmes couleurs, typos…). Le résultat est très plaisant et donne réellement la sensation d’être dans un espace protégé (sans pub ou agressions visuelles) :

La lecture des comics en eux-même se fait en mode plein écran avec différentes possibilités de visualisation et notamment la vue par défaut qui affiche une double page en grisée et fait un zoom sur la case en cours de lecture (navigation au clavier) :

La visualisation en plein écran dans Graphic.ly

Il y a aussi un mode de lecture plus classique où l’on peut également consulter les commentaires laissés par vos amis ou la communauté :

La visualisation des commentaires dans Graphic.ly

Nous avons donc au final une application tout à fait remarquable car elle garantie une expérience utilisateur de très haut niveau dans un environnement parfaitement maîtrisé. Le fait d’intégrer un lecteur de flux RSS de même que des fonctions sociales (profil, liste d’amis, messagerie interne…) plonge l’utilisateur dans une petite bulle de bonheur (sous réserve que vous appréciez les comics).

Finalement est-ce ça l’avenir des contenus numériques ? Peut-être… En tout cas l’expérience est tout à fait plaisante et la possibilité de pouvoir accéder à sa collection quelque soit le support (c’est tout l’intérêt de AIR) est un plus indéniable pour celles et ceux qui n’aiment pas voir s’entasser les comics dans une bibliothèque.

Reste à trancher LA question : Est-ce que l’iPad ne serait pas le support idéal pour ce genre d’application ? Si, bien sûr que si. Mais ça n’arrivera pas pour les raisons que vous connaissez (il va falloir attendre la sortie de la version spécifique à l’iPad – PanelFly est déjà sur le coup). Je me demande également comment ce type d’application pourrait voir le jour sur des ebooks… en théorie Amazon s’apprête à lancer une App Marketplace pour son Kindle donc nous devrions y retrouver cette application (reste à régler les problèmes de droits et de partage des revenus).

Au final il ne manque qu’une seule chose à cette application : Du son ! Autant il faut vraiment être fan pour acheter les comics tels qu’ils sont vendus sur la boutique (après tout ce ne sont que des PDF), autant en y ajoutant du son et des voix le produit prendrait carrément plus de valeur, quitte à augmenter le prix (cf. la très concluante expérience menée avec Megalex).