InterfacesRiches.fr

J’ai comme l’impression que 2010 sera l’année de la 3D (ou peut-être bien 2011 le temps que les technologies murissent). Vous pouvez d’ors et déjà expérimenter de la 3D “nouvelle génération” dans vos salles de cinéma avec le film Avatar, mais vous pourrez bientôt en bénéficier chez vous avec l’arrivée de la 3D sur les disques Blu-Ray (3D high-def movies coming to your living room on Blu-ray) et sur les moniteurs (LG Unveils Full HD 3D Monitor) ou les équipements équipés de technologies comme 3Ddisplay.

Plus proche de nos domaines de préoccupation, les applications et sites web, nous allons commencer à voir des choses tout à fait intéressantes avec notamment ce brevet déposé par Apple pour une technologie mélangeant capture et affichage 3D : Apple Working on 3D ‘Hyper-Reality’ Displays.

L’idée est de pouvoir manipuler des contenus 3D sans avoir recours à des périphériques comme le SpaceNavigator en utilisant votre webcam. Dans l’exemple qui suit, il suffit ainsi de se pencher pour faire pivoter le graphique :

Déplacez des objets 3D avec votre webcam

Plus intéressant, cette technologie peut également servir à mieux s’y retrouver dans vos fenêtres en décalant votre perspective :

Mieux gérer vos fenêtres avec votre webcam

Une application fort utile car ne nécessitant pas d’apprentissage (elle reproduit un comportement de tous les jours).

Dans un registre plus terre-à-terre, et pour faire écho à la récente publication des spécifications de WebGL (WebGL draft published, Khronos seeks community involvement), nous commençons à voir des expérimentations d’applications en 3D temps réel dans le navigateur comme ici avec Cube Defense :

Un jeu de tower defense dans votre navigateur avec WebGL

Rien de révolutionnaire, si ce n’est le fait que cette application ne nécessite aucun plug-in (juste un navigateur compatible). Démonstration vidéo ici (via 3D Test) :

Terminons cette série avec la “3D du pauvre” (n’y voyez rien de péjoratif) réalisée uniquement en CSS : CSS 3D Meninas. L’astuce est de simuler une profondeur de champ avec le mouvement de la souris :

En déplaçant la souris sur la droite de l’image, vous déplacez les différents éléments du tableau :

Les explications sont ici : De la fausse 3D à l’aide de CSS3.

Ces différents exemples ne sont pas directement liés, mais ils illustrent une tendance de fond qui va monter en puissance l’année prochaine. Ça à commencé au cinéma, ça va arriver sur votre TV et votre ordinateur, la prochaine étape sera votre mobile : 3-D Untethered: A Look at Mobile 3-D Technology. À suivre…

Le mois dernier le maire de Lyon et le président de l’OL ont lancé un nouveau site pour faire la promotion du futur grand stade de l’Olympique Lyonnais :

Le site du futur grand stade de l'OL

Pour faire découvrir ce futur stade au public ils proposent une visite virtuelle en 3D qui exploite le Shiva Web Player :

Une vue des tribunes du futur Grand Stade de l'OL

Cette visite virtuelle a été réalisée par Immersive Solution avec la solution Shiva de Stonetrip (utilisée notamment pour KidNet). Vous avez ainsi la possibilité de visiter l’intérieur du stade selon différents points de vue (pelouse, gradins…) mais également l’extérieur :

Vous remarquerez la possibilité de “sauter” de point à point (à l’aide de la petite carte) ou encore de prendre des photos (virtuelles). Il y a également une très belle vue d’oiseau :

La vue d'oiseau du futur grand stade de l'OL

Cette mise en ligne correspond à un premier pas vers de la billetterie assistée par de la 3D (prochainement implémentée) qui permettra de choisir au mieux sa place dans le stade. Il y aura ensuite un deuxième temps visiblement beaucoup plus ambitieux, mais je ne peux pas vous en parler pour le moment…

Impossible aujourd’hui de passer à côté de l’annonce du jour : Deezer lance son offre premium avec son Haute Qualité (jusqu’à 320 kb/s) et version mobiles / desktop (pour en savoir plus : Deezer lance Deezer Premium, Spotify en ligne de mire).

Même si cet abonnement premium présente un intérêt certain, nous sommes tous d’accord pour dire que l’important n’est pas de qui passe dans les tuyaux mais la sophistication du player. Sur ce point là, le player “classique” est assez sobre, si ce n’est un très léger effet coverflow sur les pochettes des albums :

Le player classique de Deezer

Mais les choses deviennent beaucoup plus intéressantes avec le player plein écran qui propose une cinématique d’introdution en Flash 3D et une très belle interface de lecture :

Le player plein écran en 3D de Deezer

Nous avons droit à de très beaux reflets et un défilement des titres avec un effet fish eye. Le rendu est très sobre et classieux. Une réussite !

(via Graphism)

Mise à jour : Un article très intéressant de Hebi nous apprend que cette interface a été également prévue pour un usage tactile : Fullscreen chez Deezer, et écrans tactiles.

Annoncée en mars dernier, la nouvelle version de Papervision3D (baptisée provisoirement PapervisionX) a enfin été annoncée officiellement : Papervision3D is Shifting Gears. Il s’agira donc de la version 3.0 qui représente une évolution majeure par rapport à la 2.1 puisqu’entièrement réécrit pour profiter pleinement du Flash Player 10.

Voici donc une excellente nouvelle… mais qui ne se concrétisera pas avant plusieurs mois !

En attendant, vous pouvez toujours prendre votre dose quotidienne de 3D dans Flash sur les différents blogs de la “galaxie” Papervision :

• PV3D Developers Blog, le blog officiel pour les dev ;
• Daily Papervision3D, un blog qui liste les différents projets ;
• PV3D.org et PV3World, deux blogs indépendants ;
• Papervision3D Tutorials, pour vous familiariser avec le code ;
• Papervision Showcase, pour des exemples (mais là le site semble en carafe).

Il y a assurément une communauté solide derrière cette librairie qui semble vouloir distancer les autres. À ce sujet je suis preneur d’un comparatif des librairies 3D, n’hésitez pas à déposer vos liens dans les commentaires (billet à suivre bientôt).

Connaissez-vous le Pixel Art ? Mais si enfin, ces fameuses compositions numériques réalisées pixel par pixel. Mélangez cela à de la 3D et vous obtenez de la 3D Pixel Art. Comme son nom l’indique, la 3D Pixel Art est un art. Et comme dans toute création artistique, il faut les outils adaptés.

Il existe déjà des éditeurs en ligne comme Cubescape mais ces derniers ne vous facilitent pas la tâche car le vue est figée :

Une composition 3D en Pixel Art réalisée avec CubeScape

Heureusement les équipes de l’agence japonaise Kyucon nous propose Q-Block, un éditeur 3D Pixel Art qui utilise PaperVision3D :

L'édition de 3D Pixel Art dans Q-Block

L’intérêt de cet outil est de pouvoir éditer un objet 3D en le faisant tourner dans tous les sens. Bon OK mes réalisations peuvent difficilement être qualifiées d’artistiques mais il y a de belles choses dans la galerie :

Exemple de réalisation avec Q-Block

Par contre les objets 3D ne sont pas animés. Mais avec un peu de travail c’est tout à fiat faisable comme le propose les équipe de Neuro et leur 3D Pixel Fun :

Animation en 3D Pixel Art

Et puisque l’on parle de 3D et de PaperVision, avez-vous visitez le site de la nouvelle agence de Carlos Ulloa (Hello Enjoy) ? Il ne s’y passe pas grand chose mais vous pouvez jouer avec les lettres pendant des heures :

Jouez à casser les lettres du logo du site Hello Enjoy

Bref, tout ça pour dire que je suis plus qu’impatient de découvrir les nouveautés 3D dans Flash qui vont certainement nous être présentées au MAX de la semaine prochaine…

J’ai comme l’impression que les projets d’univers virtuels 3D en Flash sont les candidats idéals pour un sujet “pommier” (qui revient régulièrement, comme les feuilles des pommiers). Bref, tout ça pour dire que j’ai récemment découvert deux expérimentations très intéressantes d’univers vrituels en 3D qui e jouent dans le browser (donc sans nouveau plug-in).

Il y a tout d’abord Yogurt3D, un framework de jeu en ligne dont le rendu 3D est assuré par SwiftGL (un moteur 3D compatible avec OpenGL). La démo est très impressionnante et mérite le long temps de chargement. Pour la démo, c’est ici : Yogurt3D Demo.

Le moteur 3D de Yogurt3D

Il y a ensuite Massiva3D, un MMORPG qui vient de rentrer en phase beta et qui repose sur la très efficace librairie Away3D. Pas de démo disponible pour le moment mais l’accent est visiblement mit sur les fonctions de communication in-game. La démo est ici : Massiva3D Demo.

Le moteur 3D de Massiva3D

Il y a enfin des tentatives de FPS comme les très bon Andagel réalisé avec Sandy 3D : Andagel an amazing 3D sci-fi game developed with Sandy3D.

Andagel, un FPS en Flash

Sinon nous sommes toujours en attente de projets en gestation comme Coobico ou IdentiFiction :

Premiers écrans de Coobico

Le très attendu IdentiFiction

Tout ceci est vraiment très encourageant mais j’anticipe une nette évolution avec PapervisionX, la prochaine version de Papervision3D qui est en cours de réécriture pour mieux exploiter les fonctions 3D natives de Flash 10. Vivement la suite…

(via Hebiflux et Hebiflux)

J’ai déjà eu l’occasion de vous parler de Papervision3D, de même que des moteurs physiques Flash, ainsi que de différentes techniques de manipulation vidéo… mais jamais des trois en même temps !

C’est ESPN, la chaîne US dédiée au sport, qui m’en donne l’occasion avec le NASCAR Results Simulator. Il s’agit d’une application en ligne permettant de simuler les résultats de la prochaine course et de participer à un concours du meilleur pronostiqueur :

Le NASCAR Results Simulator de ESPN

En bon fans de RAI que vous êtes vous apprécierez cette grille en 3D temps réel (animée par la librairie Papervision3D) où il est possible de positionner les pilotes. Là où ça devient intéressant, c’est que les pilotes sont animés grâce à de la vidéo (ils bougent, font des signes de la main, parlent et s’étirent) et ils répondent aux lois de la physiques (lorsque vous les déplacez, leurs jambes et bras pendent dans le vide).

Plus impressionnant, il y a un très bel effet de profondeur de champ car les pilotes déposés en fond de grille sont plus petits :

La profondeur de champ en action sur le NASCAR Results Simulator

Rajoutez à cela une sonorisation soignée (on entend les commentaires et les bruits de voitures en fond sonore) et vous avez une interface riche très ludique et surtout parfaitement réalisée.

(via Blitz)

A l’occasion de la sortie de sa collection Printemps 2009, Orange vient de lancer un mini-site original sous forme de visite guidée en 3D temps réel : Orange – Collection printemps été 2009.

La navigation au sein du mini-site Orange

L’idée derrière ce mini-site est de promener l’internaute au sein d’un showroom virtuel avec du contenu réparti sur différentes pièces. Le déplacement au sein des pièces est libre (c’est là tout l’avantage de la 3D en temps réel) mais le passage d’une pièce à l’autre est scénarisé avec des cinématiques de transition tout à fait sympathiques.

Une autre pièce du showroom

Même s’il est amusant de pouvoir bouger la caméra dans tous les sens, le contenu est tout de même un peu déceptif (de simples panneaux de texte). Pour info ce site ne nécessite pas de plug-in si ce n’est Flash (le rendu 3D est assuré par la librairie Papervision3D). Je retiens donc de ce site une expérience novatrice qui peut nous aider à imaginer ce que pourrais être le web 3D.

(via DailyPV3D)

…

…

…

…

Mouais… et bha c’est encore ça le web 3D ! Je préfère terminer cet articles ur une note positive avec une autre réalisation en 3D temps réel sous Flash (mais avec le moteur Sandy3D) avec ce surprenant jeux d’action : Andagel.

Autre usage de la 3D temps réel avec le jeu Andagel

Plus d’infos ici : Andagel an amazing 3D sci-fi game developed with Sandy3D.

Je vous propose ce matin de découvrir cette très bonne comparaison des capacités 3D de Flash et Silverlight : Flash 10 vs Silverlight 3: Perspective 3D. (Si ce type de comparaison vous intéresse, il y a en a des tonnes ici : Flash vs Silverlight Gallery)

La 3D dans Flash et Silverlight

Bon en fait il ne s’agit pas tout à fait de 3D “100% naturelle” mais plutôt de perspective 3D (donc de la 3D simulée).

Et le résultat des courses est : Ces deux technologies se valent pour faire de la pseudo 3D mais si vous voulez vraiment passer aux choses sérieuses, il n’y a plus qu’un seul acteur (Unity3D).

Unity3D en action

Les raisons qui font que la bataille est perdue d’avance sont les suivantes :

1. Adobe tout comme Microsoft se sont lancés dans une course à l’armement autour de la vidéo HD (et leur player respectif évoluera en priorité dans cette direction) ;
2. Aucun des deux ne propose un environnement de production 3D performant ;
3. On ne peut pas être bon dans tous les domaines (surtout avec un player qui ambitionne de rester sous la barre symbolique des 5 Mo) ;
4. Il existe bien des offres plus ciblées comme Shockwave ou 3DVIA mais elles ne proposent pas une expérience aussi ludique que la technologie de Unity (le rendu visuel du premier est clairement moins bon et le second est plus lourd) ;
5. Des initiatives de standards 3D commencent à voir le jour (cf. Standardisation de la 3D sur le web avec le html ?… ou pas).

Je pense très honnêtement ne pas me tromper sur ce point, Flash est encore largement en tête pour tout ce qui est casual gaming (cf. Flash Gaming Summit Slides and Presentation) mais Unity3D propose un environnement bien plus mature.

Pour nourrir cette réflexion je vous propose une série de liens :

• Flash is dead in March – Unity3d coming to Windows, à propos du lancement récent de la plateforme de production sous Windows ;
• Flash vs Unity 3D, une argumentation très complète sur les avantages des deux technologies et une conclusion mitigée (ces deux technologies poursuivent deux ambitions différentes) ;
• Unity3D – Adobe should buy them, Voilà… tout est dit (mais ça fonctionne aussi pour Microsoft ou Google).

Encore une fois je ne pense pas qu’il soit pertinent de comparer Flash, Silverlight et Unity, mais puisque l’on parle de 3D je ne pouvais pas faire l’impasse.

Il existe pléthors d’advergames dans le monde de l’automobile (à découvrir sur Advergame.fr). Par contre je n’en connaissais pas dans le monde des constructeurs de camion. C’est maintenant chose faite avec Volvo qui fait la promotion de son FH16, le camion le plus puissant du monde : The Strongest Truck.

Outre des vidéos et divers contenu, ce mini-site propose donc un advergame où il faut acheminer à bon port une livraison à l’aide de ce fameux FH16-700 :

L'advergame de chez Volvo Trucks

Bien évidement la parcours est compliqué et les caisses s’envolent à la moindre bosse. Il faut donc faire preuve de doigté pour dompter la “bête”. Une réalisation soignée avec un chargement pas trop long, rien à redire, c’est tout bon. D’autant plus que les bénéfices du produit sont bien restitués (puissance maîtrisée), ne rigolez pas car ces gros engins peuvent parfois provoquer des catastrophes (cf. Promoter Killed In Monster Truck Accident).

(via Papervision 3D)