L’iPad est enfin sorti, n’en parlons plus

Après plusieurs (interminables) semaines de spéculations, l’iPad d’Apple est enfin commercialisé. Pour le moment les avis convergent tous vers la même conclusion : Un très bel appareil qui recèle un formidable potentiel… pas encore pleinement exploité. Au dernière nouvelles il y aurait presque 500.000 unités vendues en 1 week-end (MàJ : Visiblement les chiffres diffèrent d’une source à l’autre), belle performance.

Je ne retiendrais que trois choses pour la sortie du touchbook d’Apple :

  • La disponibilité de l’application Kindle d’Amazon (qui cherche à assurer ses arrières) ;
  • La disponibilité de l’application Pandora (un service de découverte musicale qui risque bien d’exploser les compteurs car le contexte d’usage de l’iPad – dans le salon – est tout à fait propice à cette activité) ;
  • La publication par Apple d’une liste de sites compatibles avec l’iPad (ils sont donc conscients qu’il y a un problème à ce niveau).

Voilà, sinon je peux vous renvoyer aux différents articles que j’ai rédigé sur le sujet (inutile de répéter les mêmes choses) :

J’attends donc avec impatience la V2 (ou la V3).

Compte-rendu de la conférence Transmedia Storytelling 3.0

Comme chaque année, le gratin du web marketing se retrouve à Brie-comte-Robert pour une journée de conférences et débats sur les meilleures pratiques du marketing en ligne. L’édition 2010 était l’occasion d’inaugurer le tout nouveau convention center (chez Ginette) :

Le centre de conventions
Le centre de conventions

Entre le lancement imminent de l’iPad, les rumeurs autour des annonces de nouveaux services pour Facebook et le passage à l’heure d’été, l’ambiance était survoltée pour la keynote d’ouverture.

Keynote

Jeffrey porter au micro lors de la Keynote
Jeffrey porter au micro lors de la Keynote

C’est Jeffrey Porter (dont j’ai déjà parlé sur ce blog) qui a ouvert l’édition 2010 avec une intervention remarquée sur la rugosité des marques sur les applications de réalité diminuée sur touchbook :

  • Vous dites que vous voulez une révolution, mais tu sais nous voulons tous changer le monde ;
  • Vous me dites que c’est l’évolution, mais vous savez nous voulons tous changer le monde ;
  • Mais quand vous parlez de la destruction, ne savez-vous pas que vous pouvez compter sur moi ;
  • Ne savez-vous pas que tout va bien se passer, bien se passer, bien se passer ;
  • Tu dis que tu as une vraie solution, Eh bien vous savez nous aimerions tous voir le plan ;
  • Vous me demandez une contribution, Eh bien, vous savez nous faisons ce que nous pouvons ;
  • Mais quand vous voulez de l’argent pour les gens à l’esprit que la haine ;
  • Tout que je peux dire, c’est un frère que vous devez attendre ;
  • Ne savez-vous pas que tout va bien se passer, bien se passer, bien se passer.

Une vision radicale pour un intervenant d’exception !

Après un détour par la press room j’enchaine sur la première conférence.

How to Manage a Backside 540° Corkscrew Approach in your Media Planning?

Shaun Black à la conférence xx
Shaun Black à la conférence sur les stratégies 540°

Une session quasi-pleine pour écouter Shaun Black de l’agence con-media sur leur approche transmedia :

  • Tout vient à point à qui sait apprendre ;
  • C’est au pied du phare que l’on voit le mieux le phare ;
  • Un pain vaut mieux que deux fraises Tagada ;
  • On ne prend pas une douche avec du vinaigre ;
  • En partant du boulot le soir reboote ton Windows, si tu ne sait pas pourquoi, lui le sait ;
  • Si tu ne veux pas que les choucas t’assiègent de leurs cris, ne sois pas la boule d’un clocher ;
  • La célébrité, c’est l’avantage d’être connu de ceux qui ne vous connaissent pas ;
  • Le plus dur, ce n’est pas de devenir célèbre, C’est de retourner à l’anonymat.

Encore une fois je ne peux qu’approuver l’engagement de cette agence dans leur façon d’aborder les problèmes.

Transmedia Storytelling is the new Chatroulette

Brian Johnson lors de sa session
Brian Johnson lors de sa session

Dernière session de la journée avec Brian Johnson sur l’évolution des pratiques abusives de facturation par les stagiaires séniors des agences :

  • Facile de vivre, une vie sans billets de saison sur une autoroute à sens unique ;
  • Sans rien demander, laissez-moi être ;
  • Prenant tout mon stride dont la raison ont besoin, la rime n’avez pas besoin ;
  • N’est pas rien, je préfère ne pas en descendant, le temps parti ;
  • Mes amis vont trop être là, je suis sur l’autoroute de l’enfer ;
  • Aucun signe d’arrêt, vitesse maximale, personne ne va me ralentir ;
  • Comme une roue, allant le spin, personne ne va déconner avec moi ;
  • Hé Satan, paye donc ma cotisation pour jouer dans un groupe à bascule ;
  • Hé Maman, regarde-moi je suis sur le chemin vers la terre promise ;
  • je suis sur l’autoroute de l’enfer (ne m’arrêtez pas) je vais tout en bas.

Voilà, cette journée s’achève et comme toujours elle ne m’a pas déçue. Vivement la prochaine édition !

Les interfaces naturelles d’aujourd’hui et de demain

J’ai déjà eu l’occasion de vous parler de l’évolution de l’outil informatique vers des terminaux polymorphes et nomades. Cette évolution du hardware se fera de concert avec le software et notamment les systèmes d’exploitation et les logiciels. D’ailleurs nous sommes en plein dedans avec la vague des widgets (sorte de mini-applications) qui font la fortune d’Apple sur l’iPhone et le prochain Chrome OS de Google qui sera un hybride entre navigateur et système d’exploitation.

Les interfaces naturelles bientôt dans notre quotidien

Depuis que j’ai assisté au speech très inspiré de Bill Buxton sur les interfaces naturelles, je m’interroge sur la pertinence du modèle écran / clavier / souris. Regardez de près le Project Gustav pour vous rendre compte du potentiel que pourrait représenter des interfaces faisant une utilisation optimale des écrans tactiles et des périphériques naturels (ici un simili-pinceau pour cette simulation de peinture) :

L'interface du Gustav Project
L'interface du Gustav Project

La prise en main est immédiate et l’utilisateur s’exprime d’autant mieux qu’il utilise les gestes et outils de son quotidien. Démonstration vidéo ici :

Ce type d’interface a d’ailleurs été vu sur les stands de Fiat et de Renault au récent Salon de Genève pour épater les visiteurs : Les configurateurs interactifs de Fiat et Renault au Salon de l’Auto de Genève.

Le configurateur ludique de Fiat au Salon de Genève
Le configurateur ludique de Fiat au Salon de Genève

La dimension ludique est ici évidente et l’on se met à rêver des nombreuses possibilités offertes par des terminaux comme Surface… ou comme la Sphere, un autre projet de Microsoft qui combine un affichage sphérique et une surface tactile :

Le projet Sphere de Microsoft
Le projet Sphere de Microsoft

Mais pas la peine de sortir la grosse artillerie pour proposer une expérience différenciante. Exemple avec le Gesture Cube, un concept à mi-chemin entre touchbook et cadre numérique qui pousse encore plus loin la logique de terminal domestique connecté popularisée par le Chumby : Gesture Cube, Une interface 3D interactive.

Le concept de Gesture Cube
Le concept de Gesture Cube

Là encore, ce cube domestique aux formes et dimensions très proches d’un radio-reveil, exploite parfaitement les gestes naturels et surtout la contextualisation des informations / applications en fonction de la pièce dans laquelle vous vous trouvez :

Et dans la série “je fais du neuf avec du vieux“, je me permets également d’évoquer le concept Waveface Ultra proposé par Asus, un écran tactile souple que vous enroulez autour de votre poignet :

Le concept Waveface d'Asus
Le concept Waveface d'Asus

L’idée ici n’est pas de miniaturiser un smartphone mais plutôt de faire monter en compétence votre montre pour qu’elle puisse vous envoyer des notifications et qu’elle interagisse avec ce qui vous entoure :

Là encore vous remarquerez que le terminal et les gestes utilisés pour le manipuler sont les plus naturels possibles (l’interface est ici presque transparente).

Dernier exemple et pas des moindres avec SixthSens le concept d’interface gestuelle portable présentée par Pranav Mistry lors du dernier TED : An interview with Pranav Mistry, the genius behind Sixth Sense.

SithSens, l'interface gestuelle portable
SithSens, l'interface gestuelle portable

Imaginez-vous avec un terminal en forme de médaillon qui serait équipé d’un mini-projecteur (pour afficher des informations) et d’une caméra pour capter le mouvement de vos doigts. Lorsque vous allumez le terminal, vous choisissez une application et celui-ci projette alors une interface adaptée au contexte d’utilisation (ici, la lecture d’une vidéo en complément d’un article) :

L'interface gestuelle SixthSens en action
L'interface gestuelle SixthSens en action

Pour le moment le terminal en lui-même est rudimentaire mais l’on décèle un potentiel énorme dans la vidéo suivante :

Et comme dans les précédents exemples, c’est un objet du quotidien (un médaillon) qui est mis en scène dans notre quotidien (prendre une photo, lire un journal) et dont l’interface se manipule de façon tout à fait naturelle (avec les doigts).

Interfaces naturelles et jeu vidéo, une réalité

Bon nous sommes tous d’accord pour dire que ce n’est pas demain la veille où nous sortirons avec notre médaillon augmenté, il n’empêche que les interfaces naturelles sont une réalité pour un grand nombre de personnes (vous avez déjà essayé la Wii ?) et qu’il n’y a aucune raison pour que l’industrie du jeu vidéo n’aille pas plus loin (d’ailleurs elle a toujours été très précurseur).

La Wiimote pour reproduire les gestes naturels
La Wiimote pour reproduire les gestes naturels

Passé relativement inaperçu l’année dernière, le jeu EndWar est ainsi un bel exemple d’interface naturelle avec son principe de commandes vocales plutôt abouti :

L'interface à commandes vocales du jeu EndWar
L'interface à commandes vocales du jeu EndWar

Commandes gestuelles, commandes vocales, c’est la sortie en juin prochain de la déclinaison grand public du Project Natal de Microsoft qui devrait normalement rehausser la barre d’un cran avec des concepts de jeu tout à fait renversants. Exemple avec ce concept malheureusement abandonné de beat them all qui se joue avec les doigts : Indie studio reveals cancelled, finger-powered Natal game.

Un projet de jeu de combat avec les doigts
Un projet de jeu de combat avec les doigts

Quel dommage que ce concept n’ai pas été retenu car je me voyais tout à fait jouer avec mes doigts sur la table basse :

Illustration du jeu 2 Finger Heroes
Illustration du jeu 2 Finger Heroes

Bref, j’ai comme l’impression que les souris et claviers vont prendre une grosse claque avec la généralisation des écrans tactiles et des interfaces naturelles. Quoique…

Pas d’interfaces naturelles dans le milieu professionnel ?

Outre les métiers graphiques, j’ai du mal à anticiper une percée des interfaces naturelles dans le monde professionnel. Autant je suis convaincu du potentiel ludique et intuitif de ce type d’interfaces, autant je ne pense pas que l’on puisse améliorer la productivité d’un utilisateur de clavier / souris dans un contexte pro.

C’est donc malheureusement l’argument économique qui va pérenniser l’outil informatique tel que nous le connaissons sur le poste de travail. Rien de dramatique dans la mesure où nous pourrons toujours exploiter des interface naturelles dans nos moments de détente ou à la maison. La rupture entre le monde pro et perso sera ainsi d’autant plus nette et agréable.

Et le web dans tout ça ?

Reste une grande inconnue pour les interfaces naturelles : Comment les exploiter dans le cadre d’un navigateur web ? Et c’est là où nous nous heurtons au casse tête des interfaces web qui se manipulent à la fois avec la souris pour le clic ou le drag & drop (donc potentiellement la main ou le doigt), mais également avec le clavier pour saisir une URL ou remplir un formulaire.

Donc très clairement sur ce cas d’usage particulier je suis incapable de prendre position. Comme je fais un usage intensif du web, je penche tout de même en faveur du traditionnel couple clavier / souris. Mais tout ceci pourrait bien changer avec la “widgetisation” des sites web et services en ligne sur l’iPhone et encore plus sur l’iPad.

Affaire à suivre, nous aurons l’occasion d’en reparler.

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…

MIX 2010 – Jour 2 (suite)

Suite de la deuxième journée de conférence au MIX 2010. Les vidéos et diaporamas des sessions sont déjà disponibles ici : Live.VisitMix.com/videos.

Total Experience: A design Methodology for Agencies

Salle comble pour cette session présentée par Organic sur les méthodologies créatives en agence :

  • Il y a 10 ans, les web designers subissaient de terribles contraintes (256 couleurs, 4 typographies, des pages de moins de 60 Ko…), ils sont maintenant beaucoup plus libres dans les possibilités créatives et les expériences qu’il est possible de faire vivre au travers d’un site web ou d’une création digitale ;
  • Si les clients / prospects sont connectés 24H/24 sur différents terminaux (ou presque), les marques doivent suivre ;
  • Le prototype est une composante essentielle du processus créatif car il permet de matérialiser une stratégie et éviter de prendre du temps lors de la réalisation ;
  • Les hollandais ont inventé le Total Football, un tactique au foot où les joueurs peuvent changer de poste en fonction des phases de jeu, les agences devraient s’en inspirer pour éviter la sur-spécialisation des profils (créatifs ou non) ;
  • L’intérêt de la Total Experience est d’occuper le terrain entre deux campagnes et ainsi de ne pas s’éloigner des clients / prospects ;
  • Ils ont 4 principes fondateurs pour les expériences de marque = Connect, Context, Interact, Syndicate ;
  • Les prototypes sont de formidables outils pour vendre des idées aux clients (à combiner avec du story-telling) ;
  • Exemples de campagnes = Morris pour Bank of America (pop-up website), Off RoadR pour Jeep (communauté en ligne), Pur pour P&G (Facebook App), U by Kotex pour Kimberly Clark.

Le mot de la fin : Il insiste sur l’importance de faire du travail de terrain pour bien comprendre les habitudes / motivations / contraintes des clients et prospects (plutôt que d’acheter des études aux instituts spécialisés) et pour itérer sur un concept créatif, une campagne ou un site (notion de beta perpétuelle, même pour une action de com’).

Modern Web Form Design

Impossible pour moi de rater la session de Luke Wroblewski, mon maitre à penser, sur la conception de formulaires :

  • Les formulaires en ligne sont la base de quasiment toutes les interactions sur le web (commerce en ligne, recherche, médias sociaux…) ;
  • Apple a fait un travail très intéressant de reformulation de son processus de commande avec un formulaire vertical (cf. The Apple Store’s Checkout Form Redesign) :

    Le nouveau formulaire de l'Apple Store US
    Le nouveau formulaire de l'Apple Store US
  • Il faut être très vigilant sur le nombre de champs d’un formulaire (lesquels sont réellement absolument nécessaires) ;
  • La quasi-totalité des formulaires de saisie d’adresse demande le code postal ET le nom de la ville (pourquoi ne pas déduire le deuxième du premier ?) ;
  • Les onglets optionnels sont dangereux car ils impliquent un choix exclusif (ex : comment combiner plusieurs moyens de paiement ?) :

    Exemple d'onglets verticaux pour du choix exclusif
    Exemple d'onglets verticaux pour du choix exclusif
  • Les contrôles de surface sont essentiels pour aider les utilisateurs à localiser les champs où ont été fait les erreurs comme chez Yahoo! :

    La validation en ligne chez Yahoo!
    La validation en ligne chez Yahoo!
  • Les contrôles de surface sont à réaliser en sorite de champ pour éviter de perturber la saisie (sauf pour le choix d’un nom d’utilisateur) ;
  • Exemple intéressant de formulaire prédictif chez Kayak (affichage du meilleur prix dans un calendrier avant de choisir une date) :

    Kayak et son formulaire prédictif
    Kayak et son formulaire prédictif
  • Saisir un mot de passe peut être compliqué car les caractères sont masqués (idéalement il ne faudrait cacher que les caractères déjà saisis).

Les formulaires en ligne sont de mieux en mieux maitrisés mais tout est à inventer sur terminaux mobiles (cf. Better Mobile Form Design) :

  • L’iPhone propose un zoom sur le champ en cours de saisie (attention à bien vérifier que les intitulés et aides restent visibles => il est préférable de placer les intitulés au dessus des champs) :

    Le zoom lors de la saisie d'un champ sur iPhone
    Le zoom lors de la saisie d'un champ sur iPhone
  • HTML 5 introduit de nouveaux types de champs de saisie pour simplifier et limiter les erreurs (date, slider…) ;
  • Exemple intéressant chez Kayak de formulaire avec mise en page originale et exploitant les fonctions natives de l’iPhone :

    Formulaire de recherche en situation de mobilité chez Kayak
    Formulaire de recherche en situation de mobilité chez Kayak
  • Il est important de prendre en compte la contrainte d’orientation dans la mise en page :

    L'orientation des formulaires sur smartphone
    L'orientation des formulaires sur smartphone
  • Le Nexus One propose la saisie vocale (touche ‘Micro’ sur le clavier) et visuelle via l’appareil photo (reconnaissance de caractères).

Génial, même si je connais quasiment l’intégralité du travail de Luke W, je garde une excellente impression de cette session. Du coup je vais surement acheter son dernier livre : Web Form Design: Filling in the Blanks.

À suivre…

MIX 2010 – Jour 2

Deuxième jour de conférence à Las Vegas avec une seconde Keynote normalement consacrée à Internet Explorer 9 (entre autre).

Keynote 2

C’est Dean Hachamovitch qui va représenter l’équipe IE 9 :

  • Les applications en ligne consomment beaucoup de ressources processeur ;
  • Les applications en ligne réalisées avec HTML 5 proposeront une expérience très proche des applications desktop ;
  • IE 9 représente la troisième version majeure depuis IE 6 (ils affirment avoir franchi un cap qualitatif) ;
  • IE 9 va exploiter l’accélération matérielle pour améliorer les performances des applications en ligne ;
  • IE 9 inclura un nouveau moteur Javascript qui va compiler le code javascript de façon transparente et exploiter de façon plus efficace les processeurs multi-coeur et/ou la puce graphique ;
  • Pour bien comparer les performances des navigateurs il faut s’intéresser à l’ensemble des tâches (et pas qu’au moteur javascript) ;
  • IE 9 sera parfaitement compatible avec les spécifications HTML 5 et CSS 3 (border-radius, opacity, animations…) ;
  • Microsoft va devenir un contributeur majeur pour les spécifications HMLT 5, CSS 3, DOM et SVG.

Nous passons à une explication détaillée sur l’accélération matérielle dans IE 9. Ici une démonstration d’animation circulaire de pictos dans IE 9, Firefox et Chrome :

Démonstration de contenus SVG 1.1 :

Utilisation de SVG dans IE 9
Utilisation de SVG dans IE 9

Démonstration d’un moteur physique exploitant DirectX :

Démonstration de la balise <video> de HTML5 sur un netbook :

Une dernière démonstration technique avec un carrousel de vidéos et des effets de transparence :

La IE9 Platform Preview est disponible immédiatement auprès de la communauté de développeurs (d’autres expérimentations sur IETestDrive.com). Tout ça me semble aller dans la bonne direction…

Scott Hanselman monte ensuite sur scène pour présenter la Web Plateform. S’en suit une laborieuse revue de code avec ASP.net 4 et une longue visite guidée des possibilités de Visual Studio 2010.

Puis John Resig vient nous présenter les derniers travaux sur jQuery :

  • Près de 30% des sites web utilisent la librairie jQuery ;
  • Microsoft est maintenant un contributeur actif au projet jQuery.

Vient ensuite un longue présentation de Open Data Protocol qui permet de simplifier la création d’APIs, leur déploiement sur Azure et leur monétisation sur une marketplace baptisée provisoirement Project “Dallas”. Je vous passe les détails techniques car ce n’est pas ma spécialité.

Après cette séance très technique, Bill Buxton monte sur scène pour nous parler d’usages et d’expérience utilisateur :

  • Depuis le lancement des outils de développement d’applications pour Windows Phone quelqu’un a déjà développé un client Twitter en morse (illustration d’un phénomène d’innovation empirique) :

    Une application Twitter pour Windows Phone qui utilise le morse
    Une application Twitter pour Windows Phone qui utilise le morse
  • Les interfaces graphiques naturelles (“Natural UI“) vont devenir de plus en plus à la mode car ils réduisent grandement la courbe d’apprentissage ;
  • Les ordinateurs n’utilisent qu’une partie des sens des utilisateurs (vision, audition) et de leurs capacités (saisie au clavier, interaction avec la souris) ;
  • Le projet Natal introduit une nouvelle forme d’interaction en captant les mouvements de votre corps ;
  • Démonstration d’une application de peinture utilisant une interface tactile et un moteur physique pour reproduire de façon réaliste le comportement de la peinture ou d’une gomme (cf. Project Gustav) :

    L'application de simulation de peinture GustavPaint
    L'application de simulation de peinture Gustav
  • Des applications comme SketchFlow pourraient tirer parti de cette innovation pour libérer la créativité des concepteurs / designers.
  • L’important n’est pas d’innover pour le chalenge technologique mais plutôt d’améliorer / de simplifier le processus créatif.

Wow, quelle claque ! Autant je ne voyais pas trop où il voulais en venir (il est très brouillon dans ces explications) autant de faire le rapprochement entre ces nouveaux outils / techno de “libération créative” et la conception d’interfaces / expériences web est très intéressante. Je m’imagine déjà en train de concevoir une interface sur une table Surface au travers d’une interface naturelle…

À suivre…

Les commentaires sont fermés

MIX 2010 – Jour 1 (suite)

Suite de la première journée du MIX avec des sessions dans l’après-midi et de belles rencontres.

Seesmic Platform et l’application Seesmic pour Windows Phone

Suite à sa présentation lors de la Keynote nous retrouvons Loic Lemeur à la terrasse d’un restaurant pour qu’il nous en dise un peu plus sur son nouveau produit. Bonne surprise il dispose d’un prototype de Windows Phone (très rare) :

Loic Lemeur et son prototype de Windows Phone
Loic Lemeur et son prototype de Windows Phone

Nous en profitons donc pour squatter une salle et improviser une interview “exclusive” avec Eric :

Eric, Loic et Mathieu autour du Windows Phone
Eric, Loic et Mathieu autour du Windows Phone

Ils nous ont donc gentiment proposé une visite guidée de l’application Seesmic, ou du moins d’une pré-version :

Designing Windows Phone 7

Restons sur le même thème (Windows Phone) avec une session sur la genèse du projet Windows Phone par Albert Shum au travers de la présentation de Metro (son interface graphique) :

  • Metro est un projet entièrement nouveau qui a été créé de toutes pièces pour renouveler l’interface utilisateur de Windows Mobile :

    L'interface de Windows Mobile
    L'interface obsolète de Windows Mobile
  • Les codes graphiques des métros du monde entier ont été la source d’inspiration principale car ils permettent d’orienter les usagers et s’adressent à un public très large ;
  • Les interfaces de la Xbox et du Zune ont également été clé dans l’approche générale et les choix ;
  • L’interface tactile a été l’élément déclencheur d’une réflexion de fond ;
  • L’interface métro repose sur plusieurs principes : Rapidité, simplicité, minimalisme (“content is the interface“) ;
  • Un gros travail a été réalisé sur les choix typographiques (tout comme pour les chartes graphiques des métros) ;
  • Les animations et transitions sont clés dans l’expérience d’utilisation du Windows Phone (un héritage de Zune ?) ;
  • L’interface du Windows Phone n’a pas essayé de copier celle de l’iPhone mais de créer une expérience authentique ;
  • L’interface a nécessité de très nombreuses itérations :

    Itérations pour l'interface du Windows Phone
    Itérations pour l'interface du Windows Phone
  • L’interface n’est pas figée et est amenée à évoluer en fonction des feed-back des utilisateurs / développeurs / éditeurs ;
  • L’écran de démarrage est le point de départ de l’expérience avec un principe de tuiles (“tiles”) qui orientent l’utilisateur vers les contenus récents ;
  • L’idée derrière la “panoramic view” est de donner plus d’espace aux contenus et de créer des hubs autour de fonctions sociales ; illustration sur les écrans Pictures et People :

    La typographie utilisée dans l'interface de Windows Phone
    La typographie utilisée dans l'interface de Windows Phone
  • Ils se sont inspirés de personas modernes pour accompagner le travail de conception (qu’ils appellent des “life maximizers“) ;
  • L’interface peut être décrite par 3 adjectifs : Personal, Relevant, Connected :

    L'interface de Windows Phone résumée en 3 adjectifs
    L'interface de Windows Phone résumée en 3 adjectifs
  • Le minimalisme est omniprésent dans les écrans et permet de différencier l’expérience du Windows Phone par rapport à ses concurrents :

    Minimalisme dans l'interface du Windows Phone
    Minimalisme dans l'interface du Windows Phone
  • Couper les titres et les items de navigation est un moyen très efficace pour inciter les utilisateurs à faire défiler les écrans de façon horizontale ;
  • Les animations sont omniprésente mais restent discrètes pour ne pas saturer et/ou ralentir l’interface ;
  • De nombreux gestes sont disponibles pour déclencher différents types d’action :

    Les gestes supportés par l'interface du Windows Phone
    Les gestes supportés par l'interface du Windows Phone
  • Il y a des guidelines très précises sur les minima à respecter :

    Les guidelines de l'interface du Windows Phone
    Les guidelines de l'interface du Windows Phone
  • De nombreux contrôles sont disponibles nativement pour assurer un maximum de cohérence :

    Les contrôles natifs disponible pour Windows Phone
    Les contrôles natifs disponibles pour Windows Phone
  • Le principe de Hub peut être appliqué à n’importe qu’elle application pour améliorer l’immersion et proposer une alternative aux applications avec plusieurs écrans :

    Illustration du Hub applicatif sous Windows Phone
    Illustration du Hub applicatif sous Windows Phone

Force est de constater qu’il y a eu un très gros travail de remise en question des équipes Microsoft pour proposer une expérience en rupture par rapport aux concurrents. Ils ont édité un livre qui résume la philosophie et les inspirations de l’interface Metro : A look at “Metro” – the book.

Plus d’infos sur le blog de Christian Schormann : ElectricBeach.org.

À suivre…

MIX 2010 – Jour 1

C’est aujourd’hui l’ouverture “officielle” du MIX 2010 avec sa traditionnelle Keynote. Je retrouve dans les couloirs de la conférence Eric Dupin qui est arrivé la veille et nous allons nous installer dans la grande salle.

Keynote 1

Bonne chose, nous sommes particulièrement bien placés dans la salle au quatrième rang avec un bureau et un câble réseau (le privilège du badge presse) :

L'espace Press lors de la Keynote du MIX 2010
L'espace Press lors de la Keynote du MIX 2010

Surprise : Loic Le Meur vient nous saluer, il nous révèle qu’il va intervenir en fin de Keynote pour présenter une nouvelle version de Seesmic :

Eric et Loic avant la Keynote du MIX 2010
Eric et Loic avant la Keynote du MIX 2010

En attendant le début nous avons droit à une impressionante démonstration de yo-yo par un prodige de 17 ans :

 

Comme à chaque fois c’est Scott Guthrie qui ouvre le bal avec une session dédiée à Silverlight :
- Disponibilité immédiate d’une nouvelle version de Silverlight 4 (pour une version définitive d’ici le mois prochain) ;
- Retour sur les grands succès de Silverlight (retransmission d’événements sportifs, nombreuses applications BtoB), taux de pénétration = 60 % du parc de navigateur ;
- Explications sur la retransmission des J.O. d’hiver avec smooth streaming HD, deep zoom sur la galerie de photos, incrustation de publicités contextuelles, analytics détaillé en temps réel ;
- Le code source du video player va être publié en open source ;
- Nouvelles fonctionnalités = Affichage d’un flux vidéo HD sur plusieurs écrans, livraison de nombreux composants d’interfaces, support amélioré de Chrome ;
- Manipulation de jeux de photos grandement améliorée grâce à l’outil Pivot :

Manipulation des photos avec Silverlight 4 dans Pivot
Manipulation des photos avec Silverlight 4 dans Pivot

- Lancement de Expression Blend 4 en beta (avec une nouvelle version de sketchflow).

Premier cas client avec Ebay présenté par Raji Arasu :
- Un beau pied de nez fait à Adobe et l’application AIR ;

L'application Ebay en Silverlight
L'application Ebay en Silverlight

- Possibilité de scanner le code barre de votre produit avec votre webcam pour faciliter le processus de publication ;
- Dave Wolf de Cynergy nous confirme la bonne santé de l’écosystème autour de Silverlight (prestataires et clients) ;
- Explications sur le processus créatif (en passant par Sketchflow) :

Le prototype de l'application Ebay avec Sketchflow
Le prototype de l'application Ebay avec Sketchflow

- Amélioration du Sketchflow Player pour faciliter la collaboration (l’application a été conçue et développée en 8 semaines).

Une partie sur le tout nouveau Windows Phone 7 par Joe Belfiore :
- Lancement très prochain de la marketplace d’applications sur Windows Phone ;
- Présentation de l’interface d’accueil avec ses panneaux (“live tiles“) et ses trois fonctions essentielles (Start, Search, Back) ;
- Utilisation d’une “app bar” dans toutes les applications pour les fonctions contextuelles :

L'app bar dans l'interface du Windows Phone
L'app bar dans l'interface du Windows Phone

Présentation de l’application calendrier avec la fonction magique “I’ll be late” qui envoie une notification de retard à tous les participants :

La fonction magique I'll be late du calendrier Windows Phone
La fonction magique I'll be late du calendrier Windows Phone

- Explications sur la notion de “panoramic experience” avec un indice visuel sur le bord de l’écran pour vous faire comprendre que l’interface est bien plus grande que ce qui est affiché :

- Possibilité d’installer sur l’écran d’accueil un panneau avec vos contacts favoris (pour avoir de la notification pus sur leur activité).

Démonstration d’applications tiers réalisées avec Silverlight (cf. Silverlight for Windows Phone) :
- Ici l’application d’Associated Press :

L'interface panoramique de Windows Phone
L'interface panoramique de Windows Phone

- Possibilité d’intégrer des publicités contextuelles ;
- Parfaite intégration avec l’interface de Windows Phone 7 et de la notion de “panoramic experience” ;
- Démonstration d’une application de journal intime (Hush Hush) :

L'application Hush-Hush sur Windows Phone
L'application Hush Hush sur Windows Phone

- Utilisation des applications natives par les applications tiers (ex : application de retouche photo pour la galerie) ;
- Démonstration d’un jeu 3D avec intégration des mécaniques sociales de Xbox Live :

- SL pour Windows Phone 7 utilise rigoureusement le même code que pour une application SL sur un ordinateur ;
- Démonstration de l’environnement de production dans Visual Studio 2010 intégrant un émulateur (ici un client Twitter) :

Création d'un client Twitter pour Windows Phone
Création d'un client Twitter pour Windows Phone

- Démonstration de l’outil de création d’interface dans Expression Blend avec des imports de Photoshop et Illustrator :

Visual Studio 2010 pour Windows Phone
Visual Studio 2010 pour Windows Phone

Démonstration de l’application Graphic.ly pour Windows Phone :
- L’interface respecte toujours l’expérience panoramique :

L'application Graphic.ly pour Windows Phone
L'application Graphic.ly pour Windows Phone

- Utilisation de Deep Zoom pour observer de près les détails des cases :

Utilisation de deep zoom pour l'application Graphic.ly pour Windows Phone
Utilisation de deep zoom pour l'application Graphic.ly

Démonstration de l’utilisation de données de localisation avec l’application Foursquare et Bing Maps :

Foursquare et Bing Maps pour Windows Phone
Foursquare et Bing Maps pour Windows Phone

Démonstration de Shazam et de son intégration à la marketplace Zune :

L'application Shazaam pour Windows Phone
L'application Shazam pour Windows Phone

Démonstration de la fonction de notification Push avec l’application de la Major League Soccer :

L'application MLB pour Windows Phone
L'application MLB pour Windows Phone

Démonstration de l’utilisation de l’accéléromètre avec l’application marionnette :

Notre Loïc national entre sur scène avec l’application Seesmic :

Loic Lemeur sur la scène du MIX 2010
Loic Le Meur sur la scène du MIX 2010

- Démonstration de la nouvelle Seesmic Platforme avec la notion de plugins ;
- Annonce de Seesmic Desktop sur Mac :

Seesmic Desktop pour Mac
Seesmic Desktop pour Mac

- Présentation du client Seesmic pour Windows Phone :

L'application Seesmic pour Windows Phone
L'application Seesmic pour Windows Phone

- Il insiste sur le fait qu’une très grande partie du code source de cette application a été récupérée de la version Desktop.

Nous passons maintenant à des démonstrations autour des jeux :
- Une expérience intéressante avec une application pour piloter un robot équipé d’un canon hydraulique :

Un robot piloter par un Windows Phone
Un robot piloter par un Windows Phone

- Démonstration d’un jeu sur Windows Phone :

- Explications sur les possibilités offertes par XNA Game Studio pour simplifier le déploiement et la distribution de jeux (illustration avec Battle Punk, un social game disponible sur Facebook) :

Le jeu Battle Punks sur Windows Phone
Le jeu Battle Punks sur Windows Phone

- Illustration de la portabilité des jeux avec The Harvest (le jeu que nous avons vu plus haut) qui a été très facilement porté sur PC ou xBox :

Le jeu multi-plateforme The Harvest
Le jeu multi-plateforme The Harvest

Nous terminons avec des détails sur la marketplace d’applications :

La marketplace d'applications pour Windows Phone
La marketplace d'applications pour Windows Phone

Le mot de la fin : Disponibilité immédiate des Windows Phone Developer Tools sur developer.windowsphone.com.

À suivre…

Les commentaires sont fermés

MIX 2010 – Jour 0

Et c’est parti pour 3 jours de conférence à Las Vegas à l’occasion du MIX, la grande messe annuelle de Microsoft. La conférence ne commence officiellement que demain mais nous avons droit à une première journée de pre-sessions en ce dimanche ensoleillé.

Une fois passé l’étape de récupération du badge et des goodies (les habituelles gourdes et stylos) nous nous retrouvons dans un centre de conférence bien agréable, surtout la partie lounge avec vue sur la plage artificielle du Mandalay Bay (le type sur la photo voudrais bien y aller mais sortir à l’air libre semble lui faire un peu peur…).

L'espace lounge de la conférence avec vue sur le dehors
L'espace lounge de la conférence avec vue sur le dehors

Pas le temps de se détendre car les premières sessions démarrent déjà.

HTML 5 Now !

La grande attraction de la journée est le workshop géant de Molly Holzschlag, la grande prêtresse du HTML et des standards web qui travaille chez Opera.

Molly sur la scène du MIX 2010
Molly Holzschlag pieds nus !

La matinée est consacrée à une question existentielle : Pourquoi HTML 5 ? (ou du moins comment en sommes-nous arrivé là) :

  • Le web repose sur la notion d’interopérabilité mais comme le HTML a stagné trop longtemps (10 ans depuis HTML 4.01), cette interopérabilité est menacée par les nombreuses initiatives des navigateurs ;
  • Les spécifications du W3C ne sont “que” des recommandations qui sont interprétées et plus ou moins implantées par les éditeurs de navigateur ;
  • Parfois des innovations isolées sont spécifiées ultérieurement par le W3C (ex. : XMLhttpRequest lancé par IE, Border-radius lancé par Firefox – il me semble) ;
  • Les spécifications d’HTML 5 sont plus longues à rédiger car beaucoup plus précises que pour les autres technologies du W3C afin d’éviter toute interprétation par les éditeurs (et notamment la gestion des erreurs) ;
  • HTML 5 est déjà (partiellement) supporté par l’ensemble des navigateurs ;
  • La majeure partie des sites (et des pages web) se font imposer la version d’HTML par l’outil de gestion de contenu qui définit de façon arbitraire le Doctype ;
  • XHTML 2 était trop rigoureux et ne voulait pas gérer les erreurs ni la rétro-compatibilité, les travaux de spécifications ont donc été stoppés car les standards sont supposés reposer sur la notion de compatibilité (même rétro) ;
  • Petite précision : Rétro-compatibilité = Vous avez le contenu sans le design, Dégradation élégante = Vous avez le contenu et la majeure partie du design ;
  • Tous les grands acteurs du web contribuent au groupe de travail sur HTML 5 (rappelons qu’il y a 2 jeux de spécifications : Celles qui sont en cours de rédaction par le WHAT-WG et celles approuvées par le W3C ;
  • Internet Explorer évolue beaucoup plus lentement que les autres navigateurs car ils doivent gérer un héritage très contraignant ;
  • IE est problématique même dans sa dernière version car si le Doctype n’est pas spécifié explicitement c’est le moteur de rendu de IE 5.5 qui est utilisé (gloups !) ;
  • HTML 5 a pour objectif de proposer la meilleure expérience d’utilisation possible pour le web, cette version est tournée vers l’avenir mais doit se plier à une contrainte de rétro-compatibilité (“evolution not revolution“) ;
  • HTML 5 est une réponse à l’enrichissement du web et aux besoins croissants relatifs aux applications en ligne ;
  • Elle insiste sur le fait que HTML 5 priorise avant tout les besoins des utilisateurs et des auteurs par rapport à ceux des éditeurs de navigateur ;
  • HTML 5 introduit une séparation stricte du contenu, de la structure et de la sémantique, cette version prépare ainsi la transition vers le web multi-plateforme (et les terminaux mobiles) ;
  • L’accessibilité est un sujet toujours d’actualité, surtout au travers des problématiques de référencement naturel.

Une intervention surprenante car plus tournée autour des enjeux “politiques” de HTML 5 que d’une explication des balises. Molly a terminé sur un point de vue surprenant : HTML 5 est plus une philosophie qu’un langage et représente une avancée majeure dans le mode de fonctionnement du W3C et ses rapports avec le marché et les éditeurs.

Vegas Baby !

L’après-midi a été consacrée à des activités beaucoup plus triviale avec un virée sur le strip et notamment le City Center, un tout nouveau complexe hôtelier à près de 11 milliards de $ qui est tellement nouveau que quasiment rien n’est terminé ! Du coup nous nous sommes rabattu sur le Bellagio et sa flamboyante galerie marchande de luxe.

Le Bellagio et sa reproduction du lac de Côme
Le Bellagio et sa reproduction du lac de Côme

La soirée a été tout aussi agréable avec une sortie groupée pour les journalistes / blogueur dans un resto japonais avec table chauffante et crevettes qui volent dans tous les sens :

Le cuisto-cascadeur du restaurant japonais
Le cuisto-cascadeur du restaurant japonais

C’est demain que les choses sérieuses vont commencer avec la keynote d’ouverture. À suivre…

Les commentaires sont fermés