Faire de la 3D dans un navigateur est un sacré challenge, tout simplement car ils n’avaient pas été prévus pour ça. Il n’empêche, la pression de la part des éditeurs de jeux en ligne est toujours plus forte. De ce fait, une course à la montre à donc été entamée depuis quelques temps pour combler cette lacune (lacune ?) et faire tourner de la 3D dans nos navigateurs.

Plusieurs technologies sont ainsi en concurrence et le choix n’est pas évident car on peut difficilement les comparer. J’ai déjà eu de nombreuses occasions de vous en parler, mais je souhaite au travers de ce billet faire le point avec vous et éventuellement en apprendre sur des technologies et produits que je ne connais pas (encore). Il ne s’agit pas ici de dresser une liste exhaustive des technologies mais plutôt de voir où en sont les trois plus prometteuses.

Il y a tout d’abord Flash associé à la librairie Papervision3D qui permet de faire des choses tout à fait intéressantes. Le principal avantage est que Flash est installé sur plus de 95% des ordinateurs. Illustration avec OGCOpen, une simulation de golf :

La communauté est très active autour de ce projet mais il y a plusieurs problèmes :

• Le coeur du moteur 3D de Papervision est en cours de réécriture depuis 1 an (nom de code : PapervisionX) et le chantier n’est pas terminé ;
• Adobe travail de son côté à l’intégration de la 3D dans Flash ;
• Il n’existe pas d’environnement de production dédié au jeu (même dans Flash Builder 4).

Hypothèse optimiste : Adobe décide d’investir officiellement dans le projet (pour l’intégrer dans les futures versions) et lance un environnement de production dédié dans Flash Builder 5.

Il y a ensuite Unity3D, une technologie propriétaire dont les principaux avantages sont les performances et la maturité de l’environnement de production (la prochaine version 3 s’annonce encore plus impressionnante).

Problèmes :

• La technologie est propriétaire ;
• Le taux de pénétration du Unity Web Player est quasi insignifiant ;
• L’éditeur est de petite taille donc se pose à la question de la pérennité.

Hypothèse optimiste : Unity est racheté ou financé par un gros éditeur et atteint la taille critique pour s’imposer sur le marché.

Citons enfin WebGL, le standard promulgué par le Khronos Group (cf. WebGL, le nouveau standard de la 3D sur le web) qui progresse à grand pas. En témoigne CopperLicht, un moteur Javascript exploitant WebGL et proposant à la fois de très bonne performances et un environnement de production dédié (cf. Copperlicht: A new WebGL 3D Engine).

WebGL semble donc être un bon compromis entre les deux technologies citées plus haut en combinant performance, ouverture et au moins un éditeur d’un environnement de production. Gros problème : WebGL n’est supporté que par les navigateurs de dernière génération (par exemple Webkit sur Mac).

Vous l’aurez donc compris, le choix n’est pas simple et il faut bien peser le pour et le contre avant de miser sur une technologie : Performances, maturité, viabilité, ouverture… La clé de cette course étant la domination d’un marché qui s’annonce très juteux : Les Rich Internet Games.

Merci de mettre en commentaire toute information complémentaire sur ces technologies ou sur des alternatives (ou même sur un benchmark).

J’ai comme l’impression que le créneau des social MMO est en pleine explosion. La preuve en est avec une cascade de nouveautés : Ouverture des betas de Waatavi, Worlds of Cars et Kung Fu Panda Worlds ainsi qu’une nouvelle version pour Nooja.

Ouverture de la beta publique de Waatavi

Après plusieurs mois d’expérimentation en phase alpha, les équipes de Waatavi sont enfin prête à ouvrir la beta publique de cet univers dès le mois prochain (à découvrir ici : Découvrez Waatavi, le premier social MMO). Au programme des nouveautés :

• Amélioration du moteur de rendu pour plus de performance (rapidité, fluidité)
• Intégration complète de Jiwa pour écouter de la musique et partager vos playlists in-game
• Amélioration de la discothèque (cf. The Waave fait peau neuve) avec un affichage de la playlist, la possibilité de participer au mix et de consommer des boissons énergétiques (ou de faire le barman)
• Amélioration de la salle de cinéma avec une capacité de 60 personnes, le streaming de vidéos depuis YouTube et de nombreux partenariats en cours de bouclage
• Lancement de 2 nouveaux jeux (Just Draw It et Gloops)
• Lancement de profils plus complets pour les membres
• Intégration complète à Facebook

Rendez-vous le 2 avril pour l’ouverture de cette beta publique.

Lancement de la beta de Worlds of Cars

Après presque 1 an 1/2 de fignolage, Worlds of Cars est enfin ouvert au public (cf. Disney teste un nouvel univers virtuel sur le thème de Cars). La ville de Radiator springs est toute à vous pour explorer ses recoins, on y croise déjà quelques joueurs :

Un certain nombre de quêtes sont disponibles ainsi que la possibilité de gagner des points sur le circuit de course :

Autant je ne peux que reconnaitre la qualité de la réalisation, autant j’ai comme l’impression qu’ils ont 2 ans de retard sur la sortie opérationnelle de cet univers. Depuis le film Cars il y a eu deux autres films de Pixar et les produits dérivés de Pixar commencent sérieusement à s’épuiser. Quel dommage car le potentiel ludique de cet univers est toujours intact.

Nouvelle version pour Nooja

Quelques mois après le lancement de sa première version (cf. Découverte de Nooja, un univers virtuel musical avec une approche casual), Nooja vient tout juste de lancer une seconde version avec un moteur graphique plus performant :

De nombreux contenus ont été ajoutés : 6 nouveaux écrans, de nouvelles quêtes ainsi que des jeux :

Connectez-vous en début de soirée et vous commencerez à croiser des joueurs qui discutent :

Je suis toujours aussi fan de cet univers, et plus particulièrement du soin apporté à la sonorisation de l’interface.

Ouverture de la beta de Kung Fu Panda World

Celle-là je ne l’avais pas vu venir, l’univers virtuel dérivé de Kung Fu Panda vient d’ouvrir ses portes : Kung Fu Panda World starts sneak peek. On ne sait pas grand chose de cet univers si ce n’est qu’il propose un environnement très ludique avec des mini-quêtes et des jeux multi-joueurs. L’univers est gratuit mais les joueurs sont régulièrement exposés à des pubs avant chaque partie, il existe une version payante à 5,95$/mois qui supprime les bannières et donne accès à du contenu premium.

Pour le moment le site est complètement saturé mais la situation devrait revenir à la normale dans les prochains jours. Test à suivre…

Je termine une série d’articles sur la conception de formulaires avec deux sujets encore non-traités : Les formulaires pour terminaux mobiles et les formulaires narratifs.

Tout ce que vous avez besoin de savoir sur les formulaires mobiles est ici : Forms On Mobile Devices: Modern Solutions. Cet article est en fait un résumé d’une série de billets publiés par Luke Wroblewski sur son blog (Web Form Innovations on Mobile Devices et Better Mobile Form Design). J’ai eu la chance d’entendre ce fameux Luke en conférence lors du MIX et je peux vous assurer que son discours est parfaitement au point.

Dans son article il recommande ainsi d’exploiter au maximum les spécificités des interfaces des terminaux mobiles pour faciliter le travail de saisi dans les formulaires avec :

• La fonction de zoom

• L’adaptation du clavier virtuel en fonction du format du champ
• L’affichage temporaire du dernier caractère saisi dans un champ de mot de passe
• Les menus contextuels pour la saisie de valeurs numériques
• Les menus spéciaux pour la saisie de données complexes (comme la date ou la taille en pieds / pouces)
• L’adaptation de la mise en page en fonction de l’orientation de l’écran
• L’utilisation d’éléments d’interfaces natifs qui sont livrés avec le système d’exploitation
• L’utilisation des composants hardware comme le micro, le GPS ou le compas.

Cet article est une véritable perle pour qui veut se lancer dans le développement de sites web adaptés au smartphones. Vous remarquerez que je ne fais pas référence aux applications mobiles ni aux sites web mobiles mais au cas bien particulier des sites web destinés aux smartphones (iPhone, Android, Blackberry, Palm, Windows Phone…). Il y a beaucoup de paramètres à prendre en compte dans ce contexte particulier car les différences de rendus peuvent être spectaculaires (comme en témoigne la dernière capture d’écran).

Si vous connaissez un article sur les meilleures pratiques de conception de formulaires pour sites web mobiles (à destination des feature phones) je suis preneur…

Changeons de sujet maintenant pour rebondir sur un autre article de Luke W qui traite des formulaires narratifs : Mad Libs Style Form Increases Conversion 25-40%. Pour faire court, les formulaires narratifs utilisent une mise en page complètement différente des formulaires traditionnels et privilégie une approche plus narrative : « Je suis … et je recherche … pour faire … à partir de …« . À découvrir par exemple chez Effduffer.

Dans les faits, ce type de formulaires transformerait mieux que les formulaires traditionnels, les équipes de Vast ont ainsi constaté une amélioration de 25% à 40% de leur taux de transformation sur le formulaire de contact :

 

Des résultats surprenant pour une approche très originale. Assurément une piste à creuser…

Normalement si vous lisez ce blog c’est que vous pensez que les interfaces riches ont leur intérêt sur un site marchand. OK, mais que se passe-t-il quand Flash n’est pas disponible ? Je ne suis pas en train de vous parler des puristes qui refusent tout plug-in ou des pauvres employés obligés de surfer sur le web avec une vieille d’IE sans Flash imposée par leur DSI, mais plutôt d’une mise à jour qui se passe mal ou d’un test de détection qui ne fonctionne pas comme prévu. Bref, que se passe-t-il quand vous ne pouvez plus utiliser Flash alors que cela fait des années que l’image du marque et la valorisation des produits reposent sur des animations, de la vidéo ou du son ? C’est la catastrophe !

Heureusement certains éditeurs zélés pensent à tout et prévoient une version HTML. C’est le cas de Rolex qui nous propose un site double (HTML et Flash) au contenu et à l’expérience quasi-identique. Illustration avec la page d’accueil :

De larges visuels et un défilement horizontal pour les têtes de rubrique, exactement comme la version HTML :

Idem pour les pages de contenu comme ici une rubrique sur l’expédition du sous-marin Trieste à plus de 10.000 mètres en 1960 :

Une vidéo en plein écran et du son pour poser l’ambiance, forcément absents de la version HTML mais qui propose toute de même des visuels et contenus identiques :

Pour finir je vous propose cette page produit :

Toujours un large visuel et une navigation locale sous forme de frise en bas de page avec un effet loupe, que l’on ne retrouve pas sur la version HTML mais dont la mise en page est encore une fois la même :

Que faut-il retenir de ce site ? Que les Suisses ont bien fait les choses, certes, Mais que Flash n’est pas nécessaire pour raconter une belle histoire ou pour valoriser un produit. Cette technologie (ou une autre) apporte un avantage indéniable (comme sur le page de contenu) pour un sentiment d’immersion plus prononcé mais qu’il ne faut pas faire reposer un site uniquement dessus.

Plus je navigue sur ce site et plus je me dis qu’il a été conçu en HTML et enrichi par la suite avec du Flash, juste ce qu’il faut pour ajouter une pointe d’interactivité et d’ambiance tout en maintenant une expérience cohérente entre les eux versions. C’est assurément une bonne pratique que je recommande à tous.

Voici l’enseignement que je pourrais en retirer : Si vous n’êtes pas capable de raconter une belle histoire ou de valoriser un produit avec du texte et des images alors il faut revoir votre copie. Vous aurez tout le loisir après coup de proposer une expérience plus riche et immersive mais cette étape préalable me semble indispensable pour ne pas confondre outils et moyens.