Etat de l’art des interfaces riches

Voilà plus de 6 ans que je parle des interfaces riches sur ce blog (en fait depuis la première année). Au cours de cette période, il s’est passé beaucoup de choses et les usages se sont fortement diversifiés et intensifiés. Je souhaiterais aujourd’hui faire un tour d’horizon des interfaces riches pour plusieurs raisons :

  1. Parce que les interfaces riches existent depuis plus de 10 ans et sont indissociables de l’internet ;
  2. Parce qu’il y a toujours ce très désagréable débat de fond sur HTML5 qui va remplacer Flash (une belle ineptie : Pourquoi HTML5 et Flash ne peuvent être comparés) ;
  3. Parce que l’on en parle trop peu et que le sujet est néanmoins délicat à traiter ;
  4. Parce que je suis en train de finaliser une formation sur ce sujet : Interfaces riches, quelles opportunités pour votre marque ou votre activité.

Bref, j’ai envie de mettre les interfaces riches à l’honneur. Mais commençons par le commencement…

Définition et historique

Lancé en 1996 par Macromedia, Flash est la technologie la plus emblématique des interfaces riches. Cela fait donc 15 ans que les interfaces riches existent. Le terme « Rich Internet Application » est par contre plus jeune puisqu’il a été introduit pour la première fois en mars 2002 (on utilisait également les termes « client riche« , « client léger« , « client web« …).

Pour bien comprendre ce que sont les interfaces riches, intéressons-nous d’abord à ce qu’elles ne sont pas. Les interfaces pauvres désignent ainsi les pages web statiques composées de textes ou d’images. N’y voyez pas un quelconque jugement de valeur, des sociétés comme Amazon ou Ebay ont gagné des milliards de dollars avec des pages web composées exclusivement de textes, images, tableaux et formulaires.

Il est également important de ne pas opposer interfaces riches et pages HTML : les interfaces riches sont un complément du HTML, pas un substitut. Les interfaces riches sont ainsi des modules encapsulés dans des pages HTML. Donc dans tous les cas de figure, les interfaces riches ne remplacent pas le HTML, elles le complètent, l’enrichissent.

La définition communément admise est que ce sont des interfaces web qui proposent les mêmes fonctionnalités et la même expérience qu’une application traditionnelle, mais je trouve cette vision trop restrictive, car elle se limite à l’aspect applicatif. Nous en venons donc à ma définition : Les interfaces riches sont des interfaces web offrant plus de possibilités d’affichage et de manipulation que les pages web traditionnelles. Cette définition englobe donc des usages plus vastes dont le rich media. Mais cela n’empêche pas les éditeurs de solutions de présenter les interfaces riches comme une alternative très intéressante aux applications classiques.

Vous noterez également que ma définition ne mentionne pas explicitement les navigateurs web. Et pour cause, les interfaces riches se scindent en deux grandes familles :

  • Les Rich Internet Applications (RIA) qui sont exécutées dans le navigateur ;
  • Les Rich Desktop Application (RDA) qui sont lancées depuis le bureau.

Autant les RIAs restent confinées dans votre navigateur, autant les RDAs sont indépendantes de ce dernier et sont lancées depuis le menu « Démarrer » ou un raccourci. Elles se comportent donc comme des applications natives et ne sont pas installées sur le système d’exploitation mais sur une couche intermédiaire (la machine virtuelle). Cette différence entre RIA et RDA est subtile, mais peut parfois être confusante à l’image de logiciels qui peuvent être exécutés indifféremment dans votre navigateur ou sur votre bureau comme Balsamiq ou le Project Rome.

Il y a quelques années j’avais rédigé un article pour expliquer ces différences types d’interfaces riches: 10 ans d’évolution des interfaces web au service de l’expérience utilisateur. Même si certaines technologies ont disparu ou évolué, le schéma d’ensemble est toujours valide :

Comparaison des différents types d'interfaces riches

Nous en venons donc à la grande question : les interfaces riches sont-elles mieux que les interfaces pauvres ?

Pourquoi utiliser les interfaces riches ?

En fait la question de la supériorité des interfaces riches est subjective : mieux par rapport à quoi ? Comme avec toute technologie informatique, tout est une question de contexte et de contraintes. Les interfaces riches sont plus sophistiquées, mais plus lourdes qu’une page HTML. Elles sont plus puissantes, mais plus complexes. Elles sont plus performantes, mais plus risquées.

Il existe de nombreux avantages et inconvénients à utiliser les interfaces riches, mais nous pouvons néanmoins isoler 3 motivations principales :

  • Afficher des contenus multimédia (vidéos, musiques, animations…) ;
  • Offrir une expérience utilisateur plus sophistiquée ;
  • Proposer un outil de travail plus performant.

Autant il ya quelques années la question avait son importance, autant maintenant les interfaces riches sont partout, sous la forme de modules enrichis exploitant différentes technologies (javascript, Flash…). Les sites de commerce en ligne font ainsi un usage quasi-systématique des interfaces riches : Différentes interfaces riches pour différentes fonctions.

Les interfaces riches appliquées au commerce en ligne

La question à laquelle vous devez donc répondre est plus de savoir si telle interface ou tel module mérite un enrichissement en fonction du contexte (vos cibles, vos contraintes…). Il n’existe pas de méthode universelle pour savoir quand une interface riche est plus appropriée qu’une page HTML classique, encore une fois tout est question de contexte, il n’y a pas de bon ou mauvais choix.

Nous pouvons cependant isoler quatre grandes familles d’usages où les interfaces riches sont particulièrement bien adaptées :

Les quatre grandes familles d'usages des RIAs

Ce panorama des usages n’est pas forcément exhaustif, mais il dresse un tableau assez complet de ce pour quoi les interfaces riches sont conçues. Il vous est toujours possible de faire ce que vous voulez avec les RIAs (pourquoi pas un site textuel en Flash) mais il est toujours préférable de choisir la bonne technologie pour le bon usage. Ce qui me fait une parfaite transition avec la suite…

Quelles technologies pour quels usages ?

Le moins que l’on puisse dire est que les gros éditeurs sont particulièrement actifs pour promouvoir leurs technologies. Les grands acteurs ainsi présent sont les suivants :

  • Adobe avec Flash/Flex mais aussi AIR et l’OpenScreen Project ;
  • Microsoft avec Silverlight et WindowsClient (WPF et Windows Forms) ;
  • Google avec GWTNaClO3D et différents sites d’évangélisation de javascript comme Chrome Experiments ou 20ThingsILearned ;
  • Sun, Oracle et IBM qui sont les grands promoteurs de Java et des technologies qui vont avec ;
  • Apple qui se fait très discret mais exploite son format Quicktime ainsi qu’un framework javascript (Gianduia) ;
  • Le W3C qui oeuvre à standardiser tout ça et à faire évoluer les spécifications au travers des ses groupes de travail.

Je ne rentrerais pas dans une explication laborieuse sur les intérêts croisés de ces différents éditeurs, mais je pense ne pas me tromper en disant que les enjeux sont de taille et qu’aucun des acteurs cités plus haut ne sont à considérer comme bienfaiteur ou néfaste (la réalité est plus contrastée).

Toujours est-il qu’il existe un sacré nombre de technologies et qu’il est parfois difficile de s’y retrouver. Je vous propose donc cette classification des différentes familles technologiques liées aux interfaces riches :

Les familles technologiques des interfaces riches

Deux précisions importantes : ce panorama n’est pas exhaustif ; il existe des subtilités qui empêchent le rattachement de certaines technologies à telle ou telle famille (notamment XUL, OpenLaszlo, NativeClient, XForms) mais j’ai fait le choix de la simplification pour ne pas compliquer le travail d’évangélisation. Si vous avez une meilleure classification, n’hésitez pas à la mentionner dans les commentaires.

Le choix d’une technologie par rapport à une autre est encore une fois question de contexte : en fonction des ressources disponibles, de l’historique du projet et de son héritage, des contraintes, du budget et des délais… Il existe une infinité de critères, mais souvenez-vous qu’il n’y a pas de mauvais choix, juste des compromis.

Les nouveaux facteurs à prendre en compte

Autant il y a trois ans le choix se résumait à choisir entre Flash et Ajax, autant la situation est nettement plus compliquée aujourd’hui. Et ceci pour plusieurs raisons :

  • Les navigateurs récents sont de plus en plus performants (Chrome, Opera et Firefox se battent à coup de benchmarks) et permettent aux interfaces riches et applications réalisées en javascript de rivaliser avec les RIAs plus « lourdes » (réalisées en Flash, Silverlight…) en terme de stabilité et de rapidité d’exécution. De même, le W3C et les industriels du web (Google, Apple…) ont fait de gros efforts pour promouvoir HTML5 ainsi que CSS3 et inciter les éditeurs à mieux exploiter les opportunités offertes (cf. CSS3 et javascript seront-elles les technologies RIA du future ?). Les technologies standards du web rentrent maintenant en concurrence avec les technologies propriétaires pour la réalisation d’enrichissements de premier niveau (transitions, petites animations, effets graphiques…). Et ne pensez pas qu’Internet Explorer va se laisser facilement distancer par ses concurrents, car Microsoft s’apprête à lancer IE9 qui devrait leur permettre de rattraper une bonne partie de leur retard (avec notamment un bien meilleur support de HTML5 et CSS3).
  • Les smartphones et terminaux alternatifs prennent une place toujours plus importante dans nos usages quotidiens et notre consommation des services et contenus en ligne (cf. 2011, l’année du point de bascule). Il convient donc d’intégrer cette contrainte dans votre choix dès le départ et de réfléchir aux meilleurs moyens d’exploiter les opportunités offertes par ces terminaux.
  • Une très grosse bataille est en cours sur les codecs utilisés pour diffuser de la vidéo avec HTML5. Ce point rejoint les deux précédents, ou plutôt cristallise les tensions liées à l’exploitation de la vidéo en ligne (énorme marché) sur les terminaux alternatifs (smartphones, tablettes, TV connectées…). En fait, les enjeux de cet affrontement sont tellement importants que ce sujet mérite d’être isolé.

Rajouter à cela les contraintes d’accessibilité, de référencement, d’utilisabilité, de ROI, de performances, de disponibilité des ressources… et vous aurez un contexte extrêmement complexe à maitriser. Est-ce une mauvaise nouvelle ? Non pas du tout, car si ce sujet est aussi complexe, c’est qu’il est au coeur de l’internet et du quotidien des utilisateurs. En d’autres termes : Bien appréhender les enjeux liés aux interfaces riches conditionne le succès de votre présence sur le web.

De la nécessité d’équilibrer les budgets de communication

Je ne me lancerais pas dans un cours magistral sur l’histoire de la communication et des techniques publicitaires, mais je pense ne pas me tromper en disant que la banalisation d’internet dans un premier temps et l’avènement des médias sociaux ont fortement bouleversés les relations entre annonceurs et consommateurs. Jusqu’à récemment, pour vendre il suffisait d’occuper l’espace. Plus votre marque occupait de la place sur les médias et plus les ventes étaient importantes. Cette configuration de marché forçait donc les communicants à raisonner en fonction du GRP d’un produit, elle a conduit les marques à investir des sommes toujours plus importantes.

Le problème est que cette configuration de marché a maintenant évolué et que matraquer la tête des consommateurs n’est plus suffisant pour doper les ventes. Car le consommateur d’aujourd’hui a appris à se protéger des messages publicitaires et a surtout acquis des réflexes bien spécifiques en phase pré-achat : il se renseigne, lit et discute (cf. 58% des consommateurs s’informent sur internet à propos des produits qu’ils veulent acheter). Cette évolution dans les habitudes de consommation devrait logiquement s’accompagner d’une évolution dans la hiérarchisation des supports de communication. Or, c’est loin d’être le cas, car les budgets des annonceurs sont encore très largement utilisés pour crier et non pour écouter / dialoguer (cf. Branding in the Digital Age: You’re Spending Your Money in All the Wrong Places).

Exposition des prospects lors des différentes étapes du cycle d'achat

Si l’on observe ainsi les pratiques de communication, une très large partie du budget de communication est dépensé lors des étapes de reconnaissance du besoin (publicité, sponsorisation…) et lors de la prise de décision (promotions, PLV…). Entre les deux, il ne se passe pas grand-chose, et c’est bien dommage, car c’est là où tout se joue. Les prospects en phase de recherche des offres et d’étude des alternatives sont ainsi exposés à une multitude de mentions des produits et services sur les médias sociaux (blogs, forums, Facebook, Twitter…). Ils ont également accès à un très grand nombre d’avis client (sur les sites des distributeurs ou sur les sites dédiés) et de critiques expertes (blogs ou portails spécialisés).

Ne trouvez-vous pas dommage de dépenser autant d’argent pour augmenter la notoriété d’un produit / service et de se limiter quand il est question de leur réputation ? Certes, les médias sociaux peuvent impressionner, faire peur (ce sont des territoires de communication bien plus instables que les médias traditionnels) mais ce n’est pas une raison pour maintenir un tel déséquilibre. Pire : vous ne parviendrez jamais à compenser une mauvaise réputation de vos produits en communicant plus fort, au contraire vous aggraverez les choses en augmentant l’exposition des produits (donc le nombre de critiques).

Certains ont décidé de sauter le pas, comme Pepsi-Cola qui n’investit plus un seul centime en communication traditionnelle. Sans aller dans cet extrême, je trouve logique de procéder à un arbitrage plus cohérent des budgets publicitaires en accordant plus d’importance aux médias qui impactent le plus la décision d’achat. En clair : dépenser moins en affichage / marketing direct et plus en social marketing.

Cette vision est peut-être utopiste, mais même un léger équilibrage peut faire une grosse différence : les campagnes traditionnelles se chiffrent en millions d’euros alors qu’une cellule d’écoute / dialogue en coûte 20 à 50 fois moins.

Un autre facteur à prendre en compte est la marge sur les prestations vendues par votre agence de communication : elle privilégiera naturellement les campagnes qui lui rapportent le plus. Mais c’est une autre histoire…

De la naïveté des médias concernant Facebook et les données personnelles

Cette semaine nous avons encore doit à une énième polémique sur l’exploitation des données personnelles par Facebook : Facebook in Privacy Breach. Cette polémique est la dernière d’une longue série d’articles publiés par le Wall Street Journal sur le sujet, elle dénonce la transmission de données personnelles à des sociétés de marketing par certaines applications Facebook (plus précisément : les social games de Zynga). Officiellement pour Facebook, il s’agit d’une « faille de sécurité » qui a été corrigée. Cet article a été immédiatement dénoncé par la blogosphère (à juste titre) et notamment par Techcrunch : Fear And Loathing At The Wall Street Journal.

Pourquoi cet article est-il risible ? Tout simplement parce que le modèle économique de Facebook repose sur l’exploitation des données personnelles (ils appellent ça le graphe social pour ne choquer personne). C’est comme si je publiais un article pour dénoncer la consommation d’essence par les voitures ! Ce n’est pas explicitement dit dans la page consacrée à la confidentialité (Controlling How You Share) mais il faut vraiment être naïf pour penser qu’ils ne font pas autrement.

Facebook_Chart

Ce n’est pas la première fois que Facebook se fait épingler pour ce type de dérapage (Facebook iPhone app shares all your phone numbers, Facebook Illegally Accessed, Saved Non-User’s Data, Facebook Privacy: 6 Years of Controversy…) et quelque chose me dit que ça ne sera pas la dernière…

FacebookPrivacyTimeline

Bon, ceci étant dit, cette pratique n’est pas une exception et d’autres s’y adonnent également : Facebook, MySpace Confront Privacy Loophole, Canada, Spain Find Google Violated Privacy Laws, Collected Loads of Personal Data, Medical Records. Les données personnelles sont le trésor de guerre des plateformes sociales, si ces dernières sont gratuites, il y a une contre-partie : l’exploitation de vos données personnelles. Et alors ?

Je vais vous faire une confidence : chaque fois que vous ouvrez votre navigateur, vous êtes surveillé et vos moindres faits et gestes sont revendus à des spécialistes de l’analyse comportementale. C’est à ça que servent les cookies et autres shared objects. Jusqu’à présent cela n’a jamais dérangé personne (certains vont même plus loin : Pour Tim O’Reilly, améliorer le monde vaut bien un peu de vie privée). Et de toute façon les sociétés qui exploitent les bases de données e-marketing sont des enfants de coeur comparés à ce que font (et possèdent) les spécialistes de la donnée consommateurs comme Consodata.

Bref, exploiter les données personnelles n’est pas vraiment un sujet polémique, c’est ce qui permet aux marques d’améliorer leur offre et aux agences de mieux cibler leurs campagnes. Ce que je ne comprends pas bien, c’est pourquoi les journalistes qui ont rédigé l’article s’enflamment à propos de l’exploitation potentielle de données disponibles dans le profil public des membres de Facbeook. Profil public = Tout le monde peut voir ce qu’il y a dessus (les autres membres, Google, les bases de données marketing…). Ceci fait écho à un paradoxe que j’ai déjà décrit : les membres veulent de la visibilité mais veulent également protéger leur vie privée (La schizophrénie des membres va-t-elle tuer Facebook ?).

Cette polémique récurrente met surtout en évidence un manque flagrant d’éducation du grand public (et des médias) vis-à-vis des pratiques de ciblage comportementale et de leur dangerosité. Au pire, que peut-il arriver : se faire spammer sa boîte aux lettres.

Pour le moment il n’y a rien de très alarmant, mais je suis par contre plus inquiet pour l’avenir : combien de temps Facebook va-t-il entretenir l’ambigüité sur l’exploitation du graphe social par les annonceurs ? Si l’on s’en tient à ce qui se passe sur Facebook, vous ne risquez pas grand chose. Par contre, c’est plus gênant avec des systèmes d’authentification automatique comme Facebook Connect qui sont déployés à grande échelle, car il n’est pas compliqué de déduire des informations « sensibles » à partir de vos actions :

  • Vos convictions politiques en fonction des articles qui sont lus et aimés sur les sites d’information (comme CNN) ;
  • Vos orientations religieuses ou sexuelles en fonction des endroits que vous fréquentez ou notez sur Yelp (un resto kasher ou un bar gay) ;
  • Vos antécédents médicaux en fonction des recettes que vous consultez et partagez sur un site de cuisine (recettes sans sel ou allégées)…

Bref, la situation n’est pas alarmante, mais pourrait rapidement le devenir si l’opinion publique ne prend pas conscience d’une réalité : Facebook a BESOIN d’exploiter les données personnelles de ses membres pour pouvoir financer son activité et sa croissance. Et il en est de même pour l’ensemble des plateformes sociales gratuites. Encore une fois, je ne condamne pas ces pratiques, mais je trouve que l’attitude de Facebook est bien trop ambiguë à mon gout : l’exploitation des données personnelles n’est pas une faille de sécurité, c’est un modèle économique.

Conclusion : Éduquer les internautes sur les dangers de l’exposition des données personnelles en ligne (mais également les bénéfices) devrait être une priorité pour les acteurs du web social, ou au moins un pré-requis. C’est ce que fait notamment Google en publiant et en expliquant clairement leur charte de confidentialité (Trimming our privacy policies).

Mes réflexions sur le MIX 2010

Je suis maintenant de retour en France et je prends le temps d’analyser tout ce qui nous a été montré lors de l’édition 2010 du MIX par Microsoft.

Retour en force de Microsoft sur de nombreux fronts

Alors que ces dernières années Apple, Google ou Facebook innovaient dans tous les sens, Microsoft avait accumulé un retard notable sur un certain nombre de sujet : Navigateur, smartphone et cloud computing. Depuis le début de l’année il semblerait bien que la firme de Redmond ait la très ferme intention de revenir dans la course et même de retrouver son leadership avec de nouveaux produits comme Windows Phone et IE 9. Nous commençons également à y voir un peu plus clair dans les plans de Microsoft en ce qui concerne Azure et les nombreux services qui vont petit à petit venir s’y greffer. De toute façon, nous n’en attendions pas moins de Ray Ozzie sur ce dernier point. Maintenant que le voile a été levé, reste à Microsoft d’assurer LE test ultime : celui du marché.

Des changements culturels profonds

Saviez-vous que la moitié des employés de Microsoft ont moins de 8 ans de maison ? Non pas que le turn over soit élevé, mais que le renouvellement des équipes est visiblement une priorité dans la politique RH. Résultat : Une nouvelle vague de collaborateurs issus de la génération Xbox / Zune qui accouche de produits étonnamment disruptifs et en rupture complète par rapport au marché (à l’image du Windows Phone ou du projet Natal). Il y a donc une réelle volonté de la part de Microsoft de tourner la page sur les années Windows / Office et se tourner vers les marchés d’avenir (nomadisme, divertissement…). Autre conséquence de cette nouvelle image : Un rapprochement évident avec les communautés open source (par opposition à Apple qui s’affirme comme le champion des standards fermés).

Silverlight comme le garant d’une expérience riche et multi-plateforme

Plus nous avançons dans les versions de Silverlight et plus il est évident que cette technologie est bien plus qu’un plug-in RIA. En plaçant Silverlight au coeur de produits comme la Xbox ou Windows Phone, Microsoft cherche à en faire le vaisseau amiral d’une nouvelle expérience utilisateur multi-plateforme. À ce petit jeu là, Microsoft risque bien de prendre de vitesse Adobe et son Open Screen Project qui se heurte à Apple.

J’ai également eu la très nette impression que Microsoft cherche à séduire les développeurs de casual et social games en mettant en avant la maturité de l’environnement Visual Studio et les capacités de Silverlight dans ce domaine. Rappelons à ce sujet que Microsoft est actionnaire de Facebook, que Facebook est LA plateforme sociale de référence pour les social games, social games qui tournent à 99,99% sous Flash. On pourrait ainsi supposer que Microsoft a la ferme intention de se positionner sur le marché des social games avec une offre verticale comme peut le proposer Unity. Il faut dire qu’entre XNA et Bungie, Microsoft possède de sérieux atouts.

En attendant le prochain Windows…

Nous ne savons pas grand chose de Windows 8, juste que Microsoft nous prépare quelque chose de gros… Impossible de savoir s’il s’agit de bluff, mais entre le discours de Bill Buxton sur les interfaces naturelles, les incroyables possibilités du project Natal et la maturité de la réflexion sur l’interface du Windows Phone, je me dis qu’ils pourraient bien nous surprendre. D’autant plus s’ils décident de s’intéresser aussi aux périphériques pour proposer une offre hardware + OS + logiciels entièrement nouvelle.

Je peux me tromper, mais j’ai la conviction qu’ils ont à la fois la volonté et les ressources financières / humaines pour complètement ré-inventer leur approche de l’outil informatique. Plus que jamais les prochaines années vont être passionnantes…

MIX 2010 – Jour 3

Troisième et dernier jour pour mon séjour à Las Vegas à l’occasion de la conférence MIX.

Building Multiplayer Games in Silverlight 4

Une session allégée qui devait présenter une étude de cas concrète de développement de jeux multijoueurs avec Silverlight mais qui doit se contenter de dire des généralités sur le développement de jeux avec Silverlight pour des raisons de confidentialité car le jeu en question n’est pas encore lancé :

  • Silverlight 4 cible 3 platefomes (PC, Xbox, Windows Phone) et peut s’appuyer sur différentes architectures (Xbox Live, Windows Azure) ;
  • Près de 70% des joueurs de social gaming sont en dehors des USA (principalement en Corée du Sud) ;
  • Le marché des causal games grossit de 20% par an en moyenne ;
  • Farmville, LA star des social games avec 60 millions de joueurs, a été développé en 5 semaines, l’éditeur (Zynga) vient de lancer un nouveau jeu de Social Poker (Poker Blitz) qui a l’ambition de faire encore mieux ;
  • Emergence d’une nouvelle catégorie d’éditeurs de causal / social games qui incubent des développeurs indépendants et se rémunèrent en pourcentage des revenus ;
  • Le marché est toujours en attente des Facebook Credits pour simplifier la monétisation ;
  • La performance est une préoccupation clé dans le développement de jeux en ligne, d’autant plus quand ils sont multijoueurs car le lag détruit le gameplay ;
  • Plusieurs outils seront disponibles dans Visual Studio 2010 pour faciliter / accélérer le développement de jeux ;
  • L’accélération matérielle dans Silverlight va permettre d’améliorer grandement la sophistication graphique des jeux ;
  • Visual Studio n’est pas spécialement conçu pour faire des micro-tests / ajustements (« spiking« ) mais il est possible de biaiser pour en faire quand même ;
  • Les hackers sont très actifs sur les social games (packet sniffing & injection…) car il y a de l’argent en jeu (au travers des objets virtuels et boosters) ;
  • Silversprite permet d’exploiter les librairies de XNA dans Silverlight 4 ;
  • Le mode out of browser de Silverlight est très intéressant pour valoriser les jeux en ligne (et les faire passer pour des jeux desktop).

J’ai comme l’impression que le speaker nous aurait bien présenter des choses surprenantes s’il en avait eu le droit. Mon intuition me dit que Microsoft va bientôt se positionner en force sur les environnements de développement de jeux (avec le couple Visual Studio / SL). Plus d’infos sur gskinner.com/blog.

HTML5: Cross-Browser Best Practices

J’ai commencé par un workshop sur HTML5 et je termine par un session sur HTML5 avec Tony Ross (le chef de projet IE9) à propos de la gestion de la compatibilité entre les navigateurs :

  • Il commence avec l’exemple de border-radius qui est implémenté différemment sur Firefox et Chrome (et préfèrent leur sémantique : -moz-border-radius et -webkit-border-radius) ;
  • Nous sommes passé d’un code orienté navigateur (avec une gestion conditionnelle pour les navigateurs à la traine) d’un code orienté fonctionnalités (avec une gestion conditionnelle pour le support ou non d’une balise / propriété) ;
  • Il recommande également la détection de comportement (« behavior detection« ) qui permet de tester la capacité du navigateur et de proposer une solution de contournement au cas où ;
  • L’intérêt de ces détections est de ne pas avoir à modifier le code lorsqu’une nouvelle version du navigateur est disponible et corrige des bugs ou des faiblesses d’implémentations (de type « if IE » qui force la prise en compte d’une feuille de style IE6 alors qu’IE9 a fait de très gros progrès);
  • Utiliser les techniques de détection (fonctionnalités et comportements) permet de réduire le coût de maintenance du code HTML ;
  • Très nombreuses références à jQuery qui semble être le nouveau couteau Suisse d’IE (rappelons que Microsoft est maintenant un des contributeurs majeurs à jQuery).

Les conseils de cette sessions étaient plein de bons sens, mais je pense que les équipes derrière Internet Explorer marchent tout de même sur des oeufs quand il est question de compatibilité avec les standards et de coût de maintenance du code HTML (IE 6 est la hantise des intégrateurs HTML). Bref, qu’ils reconnaissent leurs erreurs est une bonne chose mais il ne faudrait pas qu’ils se mettent à donner des leçons aux autres éditeurs de navigateur sous prétexte qu’IE9 est (soi-disant) le seul à correctement supporter la propriété border-radius.

À suivre…

À la recherche de nouveaux formats hybrides pour les touchbooks

Alors que la date de sortie officielle de l’iPad a été annoncée au 3 avril prochain et que de sérieux concurrents commencent à pointer le bout de leur nez (HP Slate, Dell Streak…), nous sommes toujours dans l’expectative pour savoir quel type de contenu va faire mouche sur les touchbooks. Après avoir tourné le problème dans ma tête de nombreuses fois, j’en viens à la conclusion que les contenus réellement adaptés aux touchbooks ne sont pas encore là, mais que nous n’en sommes pas très loin. Plusieurs expérimentations me laissent en effet penser que la solution se trouve dans un format hybride à mi-chemin entre web-documentaire, livre / BD enrichis et jeux narratifs. Encore faudra-t-il résoudre le casse-tête du format et de la distribution, mais nous reviendrons là-dessus plus tard.

J’ai déjà eu l’occasion de vous parler des web-documentaires, ces documentaires morcelés en chapitres librement accessibles mélangeant du texte, des photos, de la vidéo… Après en avoir consulter plus d’un, force est de constater que l’on n’est pas très bien installé sr une chaise en face de son écran. Par contre, visionné sur un touchbook dans votre canapé favori, l’expérience est autrement plus intéressante. Imaginez ainsi ce que pourrait donner un contenu comme Afrique : 50 ans d’indépendance

Afrique

Le niveau d’interactivité est parfaitement adapté à ce que l’on peut faire sans trop d’effort sur un écran tactile : Choisir un chapitre, cliquer pour lire un texte complémentaire, laisser un commentaire…

Il y a ensuite le cas des bandes dessinées qui pourraient tout à fait être adaptées sur les touchbooks. Nous avons déjà des start-up qui se positionnent sur le créneau comme Graphic.ly ou Panelfly mais je ne suis pas certain qu’ils prennent la bonne direction. Je suis ainsi bine plus conquis par ce que propose les Humanoïdes associés avec le portage sur Megalex sur iPhone.

MEGALEX

Au final nous nous retrouvons avec une vidéo, mais l’expérience est tout à fait convaincante : Le fait de remplacer les bulles par des bruitages et voix d’acteurs ainsi que les effet de traveling sur les cases procurent un sentiment d’immersion tout à fait saisissant.

C’est d’ailleurs rigoureusement le même procédé qui est utilisé pour N, la BD vidéo de Stephen King :

N-StephenKing

C’est bien une vidéo « toute bête » qui est utilisée, mais avec un peu d’imagination on se dit que ça ne devrait pas être très compliqué de faire ça en Flash qui à la base est fiat pour ça (de l’animation vectorielle). Du Flash sur l’iPad ? Mais oui bien sûr puisqu’il existe maintenant la possibilité de compiler un contenu Flash pour en faire une application iPhone, le recours à Flash ne semble plus être un problème.

Nous pourrions même envisager des choses encore plus poussées avec la possibilité d’interagir avec le contenu comme nous le présente l’éditeur Penguin sur cette vidéo (cf. How Penguin Will Reinvent Books With iPad) :

L’idée est de transformer le lecteur en… lecteur actif ? Acteur ? Gribouilleur ? Je ne sais pas trop quel terme utilisé mais nous sommes bien dans un cas de figure unique où les enfants peuvent interagir directement sur le contenu (c’est d’ailleurs tout l’intérêt de ce type d’ouvrage) :

Penguin-iPad

Nous quittons ici le domaine de l’édition pour rentrer sur le territoire des jeux. Et ça tombe bien car l’actualité nous fournit un très bon exemple avec Heavy Rain, un jeu vidéo narratif développé par un studio français (cocorico !) :

HeavyRain

Ici il n’est pas tant question d’action ou de dextérité à la manette mais plutôt de suivre une histoire conditionnée par vos choix (qui jalonnent la narration) et agrémenter parfois de Quick Time Events pour maintenir votre attention. Pour le moment ce titre n’est disponible que pour la PS3, un monstre de puissance, mais n’oublions pas que l’iPad (out comme l’iPhone) a des composants techniques suffisamment puissant pour faire tourner de la 3D dans de très bonnes conditions sans avoir besoin de sortir un rendu Full-HD.

J’imagine tout à fait ce type de titre envahir les touchbooks car parfaitement adaptés au contrat d’interaction que proposent les tablettes tactiles : Visionnage en plein écran et quelques clics de temps à autre. Il en va de même pour les jeux de stratégie ou de plateau qui font fureur sur l’iPhone (de type Tower Defense) qui pourraient trouver dans l’iPad un second souffle pour des projets plus ambitieux : Ngmoco hopes to rule with new mobile games.

Tout ceci est très encourageant et la solution semble donc bien se trouver dans de nouveaux formats hybrides. Mais il reste à régler deux problèmes : Tout d’abord le circuit de distribution qui est plutôt rigide chez Apple (euphémisme) et qui ne favorise pas forcément les petits éditeurs (cf. Is Content King? Then Distribution Is Crown Prince). Ensuite le format car s’il semble y avoir consensus pour les ebooks avec le format ePub (cf. Web Standards for E-books), pour les touchbooks ça va être beaucoup plus compliqué car les contenus sont loin d’être figés. Et c’est d’ailleurs tout l’intérêt de ces machines : Pouvoir proposer un éventail beaucoup plus riche de possibilités en mélangeant des images, du son, de la vidéo, du texte, des animations…

Flash a su s’imposer comme standard de facto pour les contenus rich media du web, en sera-t-il de même pour les contenus des touchbooks ? Difficile à dire pour le moment dans la mesure où le marché a toutes les chances d’être très largement dominé par l’iPad et que les rapports sont très tendus entre Adobe et Apple. Je ne vois pas bien comment la situation pourrait se débloquer dans les prochaines semaines… si ce n’est avec le rachat d’Adobe par Apple. L’idée vous semble farfelue ? Réfléchissez-y à deux fois, et pour vous aider, je vous propose cette lecture : 7 Reasons For Apple To Acquire Adobe et Why Apple Should Buy Adobe.

Je suis persuadé que l’arrivée effective de l’iPad sur le marché va faire se précipiter les choses. Plus que quelques jours à attendre…

Adobe Max 2009 – Jour 3

Troisième et dernier jour de conférences à l’édition 2009 de l’Adobe Max.

From Sketch to Click-Through HTML Prototype with Fireworks

Enfin une session sur le protoypage avec Fireworks avec Dave Hogue de l’agence Fluid :

  • Il est tout à fait possible de se servir de Fireworks pour créer des prototypes et les tester avec des utilisateurs ;
  • Tout commence avec des croquis qui sont importés dans l’outil (Fireworks CS4) ;

    Première étape du prototypage
    Première étape du prototypage
  • La Master Page est utile pour « poser » les éléments immuables (header, nav…) ;
  • La grille et les règles permettent de structurer les pages ;

    Deuxième étape
    Deuxième étape
  • Des éléments sont ensuite superposés sur le croquis ;
    Troisième étape
    Troisième étape

    Quatrième étape
    Quatrième étape
  • Les outils « Slices » et « Hotspots » servent à rajouter de l’interactivité ;
  • Possibilité d’encapsuler du code HTML (pour une carte Google Maps par exemple) ;

    Encapsulation d'éléments HTML dans la maquette
    Encapsulation d'éléments HTML dans la maquette
  • La dernière étape est l’export en HTML mais cela génère un code source de très mauvaise qualité (suffisant pour faire des tests avec des utilisateurs mais inacceptables en production) ;
  • Il y a également la possibilité d’exporter ce travail dans Dreamwaver (pour retravailler le code source) ou Flash Catalyst (pour en faire une RIA).

Une session intéressante mais qui n’a pas réellement mis en valeur les synergies possibles entre les outils de la gamme pour faire du prototypage rapide ET réutilisable. Car il faut bien admettre que tout ce qu’il a montré peut être fait dans Powerpoint, avec en plus la très précieuse possibilité de faire des tableaux (ce que ne permet pas Fireworks).

Augmented Reality within the Flash Player

Enfin une session qui aborde le potentiel (et les contraintes) de la réalité augmentée dans Flash avec Jesse Freeman :

  • FLARToolkit est une librairie open source qui gère l’affichage de contenus 3D en surimpression d’un flux vidéo de la webcam ;
  • Retour d’expérience sur des expérimentations pour la Nasa et la mission Juno ;

    Exemple d'application de réalité augmentée à la NASA
    Exemple d'application de réalité augmentée à la NASA
  • L’intérêt n’est plus d’afficher du contenu 3D en réalité augmentée mais de faire interagir différents contenus (selon la position des marqueurs) ;
  • Problème = autoriser l’accès à la webcam à chaque fois ;
  • Il existe un émulateur pour gagner du temps et faciliter le debugging ;
  • Le Virtual Physical Computing est un domaine d’application prometteur = manipulation d’objets et de contenus 3D sans clavier ni souris ;
  • Les limitations de FLAR = très gourmand en CPU, pas de gestion native de la 3D dans Flash (nécessite des librairies 3D comme Papervision3D ou Away3D, le flux vidéo de la webcam est plutôt lent) ;
  • Les évolutions = utilisation d’Alchemy pour mieux exploiter les capacités hardware, support 3D natif et plus performant, réalité augmentée en dehors de Flash (smartphones…).

Vient ensuite au micro James Aliban pour des retours d’expériences plus expérimentales / créatives :

  • Utilisations plus artistiques avec de la gestion des particules (AR Particle Bean) ou des expérimentations musicales (Augmented Reality Drum Kit) ;

    Réalité augmentée et gestino des particules
    Réalité augmentée et gestion des particules
  • Implémentation facilitée avec FLARManager ;
  • Une communauté existe depuis l’année dernière (FLARToolkitDocs.org) ;
  • Très intéressante expérimentation avec les cartes de visite augmentées ;
  • Il existe de nombreuses applications commerciales (GE, BMW, Nissan, Toyota, Ikea…) ;
  • Autres exemples = 5Gum, Living Sasquatch, Julian Perretta’s « Ride My Star »… ;
  • Flash est clairement un facteur limitatif car il utilise le processeur pour faire le rendu 3D et non la carte 3D (600 polygones maximum pour limiter l’effet stroboscope, lié au faible taux de rafraichissement en cas de mouvements du modèle 3D ou de la webcam) ;
  • Entre 20% et 25% des ordinateurs domestiques sont équipés d’une webcam ;
  • La prise en main est délicate pour les concepteurs et développeurs d’applications car l’image est inversée (vue depuis la webcam).

Wow ! Non seulement nous n’en sommes qu’au début de cette nouvelle forme d’expression mais en plus la communauté est très active (de nombreuses choses sont disponibles en open source).

Building Browser-Based Casual MMOs

Campfu, un casual MMO qui n'existe plus
Campfu, un casual MMO qui n'existe plus

Encore une session très prometteuse avec l’intervention de Nick Fortugno concepteur en chef chez Rebel Monkey qui nous propose son retour d’expérience sur Campfu, un casual MMO qui n’existe malheureusement plus :

  • Le projet a nécessité 18 mois de développement et 2M$ d’investissements (le site n’a été en ligne pour 6 mois) ;
  • Pas besoin d’avoir de très beau graphismes comme Runescape (ex : Kingdom of Loathing qui est quasi-textuel) ;
  • La notion d’engagement est clé car la grosse majorité des causal MMO sont gratuits ;
  • Le fait de ne pas avoir à télécharger ou installer quelque chose est un levier concurrentiel très puissant (vis à vis des MMORPG traditionnels) Puzzle Pirates a commencé en version téléchargeable et est maintenant accessible en ligne ;
  • Les plus grosses difficultés techniques sont du côté du serveur (il existe des solutions middleware comme SmartFoxServer, ElectroServer ou Project Darkstar) ;
  • Avec une solution middleware comme SmartFoxServer, le temps de développement peut être réduit à 1 mois (mais cela induit de fortes limitations en terme d’évolutivité et de montée en charge) ;
  • Les difficulté auxquelles il faut faire face = sécurité (qui a un impact direct sur les performances), disponibilité, stabilité (surtout pour du code interprété), intégrité (via à vis des possibilité de hacking de la partie « client ») ;
  • Les jeux en temps réel sont un vrai défi technologique, voilà pourquoi il est très sceptique vis à vis des solutions de cloud gaming comme OnLive ;
  • Les outils d’automation (débug…) permettent de gagner beaucoup de temps lors de la phase de développement ;
  • La phase de beta est indispensable car de toute façon il y aura des bugs majeurs (quelque soit le temps de préparation et de conception) ;
  • La visibilité est clé dès le début du projet car il faut impérativement recruter très vite un grand nombre de testeurs ;
  • Les revenus générés par la publicité ne deviennent significatifs qu’avec plusieurs millions de joueurs ;
  • Les modèles économiques fondés sur l’abonnement sont particulièrement adaptés pour la cible des plus jeunes (Tween) ;
  • La vente d’items virtuels est intéressant mais demande de gros efforts de surveillance (pou éviter la fraude ou les trafics parallèles) ;
  • Tout comme pour les sites web et boutiques en ligne, les solutions de surveillance des échanges comme celle de TwoFish sont indispensables pour comprendre les flux économiques et éviter les déséquilibres (il est tout à fait possible de faire de l’A/B testing sur le prix de vente d’accessoires virtuels).

Voici une session extrêmement riche en enseignements et surtout un discours qui n’était pas que technique mais qui abordait aussi les problématiques organisationnelles et business.