Hello, I’m Vinch

And this is my website.

La 3D débarque sur le Web !

04/27/08

This post is more than 9 years old. It might not reflect my current skills and convictions.

C’est une réalité ! Si 2007 était l’année de la vidéo sur le Web, 2008 est incontestablement en train de devenir l’année de la 3D sur le Web ! En effet, en ce moment, il ne se passe pas un jour sans qu’on voie fleurir un nouveau site ou une nouvelle démo totalement en trois dimensions. Je vous propose de faire un petit tour non exhaustif des technologies qui permettent, aujourd’hui, de faire de la 3D sur le Web…

JavaScript

Oui, faire de la 3D en JavaScript, c’est possible ! Néanmoins, cela reste juste de belles performances technologiques, sans plus. Même si le travail accompli est fantastique, je ne pense pas que ces triangles qui tournent sur eux-mêmes et 3D Tomb II (un doom-like) vont revolutionner le Web. JavaScript n’est pas adapté pour faire de la 3D et ne le sera sans doute jamais. Je pense qu’on peut définitivement oublier cette voie.

HTML 5 + JavaScript

Autant le JavaScript utilisé seul et la 3D n’ont aucun avenir, autant le JavaScript couplé avec la puissance du tag canvas d’HTML 5 peut s’avérer une solution très efficace pour faire de la 3D.

canvas est un tag HTML 5 qui permet (via JavaScript) de faire du dessin en 2D et 3D et de l’édition de photos (le tout pouvant être animé). Il est actuellement implémenté par les navigateurs Gecko, Safari et Opera. Il devrait plus que probablement être implémenté dans Internet Explorer 8, si Microsoft tient ses promesses…

Je vous propose de lire ce très bon tutorial sur le Mozilla Developer Center. Ensuite, allez jeter un oeil à cette démo pour vous faire une idée de la puissance du tag canvas ! C’est autrement plus impressionant que 3D Tomb II !

Flash

Même si canvas est très prometteur, Flash reste aujourd’hui LA meilleure solution pour faire de la 3D sur le Web. Cependant, il faut savoir que Flash n’implémente pas la 3D en natif (ce sera le cas pour Flash 10). Il faut en effet importer des librairies externes pour arriver à nos fins. La plus connue reste Papervision3D mais d’autres comme Away3D et Alternativa tirent également leur épingle du jeu. Si vous en voulez plus, elles sont toutes listées sur cette page.

Quelques exemples marquants :

* In An Absolut World (Papervision3D)
* Flower By You (Papervision3D)
* whitevoid (Papervision3D)
* Monster Burnout (Papervision3D)

Et le meilleur pour la fin : Promenade dans un magnifique décor avec Alternativa !

Tous ces exemples montrent qu’on peut sans plus attendre commencer à faire de la 3D sur le Web. Selon moi, le problème majeur est d’arriver à trouver des interfaces et des systèmes de navigation efficaces en 3D, c’est qui encore loin d’être gagné pour l’instant !

De plus, il ne faut pas oublier que la plupart des informations seront toujours plus efficacement présentées en 2D et que la 3D n’est pas une évolution et une solution à tout !

N’empêche, c’est vraiment grisant de voir à quel point ça évolue rapidement en ce moment… Et ça ne fait que commencer !

Ca commence à ressembler à quelque chose…

04/03/08

This post is more than 9 years old. It might not reflect my current skills and convictions.

Si vous avez compris mes messages subliminaux à deux balles, vous savez que maintenant, je fais (aussi) de l’ActionScript.

Pour ceux qui ne connaissent pas ActionScript, il s’agit du langage de programmation utilisé dans les applications Flash et (plus récemment) Flex. Ce langage est basé sur l’ECMAScript, tout comme JavaScript. Néanmoins, depuis sa version 3, ActionScript est devenu un vrai langage de programmation orienté objet ce qui n’est pas encore tout à fait le cas pour JavaScript…

Cela fait maintenant un peu moins de deux semaines que j’ai commencé à potasser AS3 et je dois avouer que je m’amuse comme un petit fou. Mon niveau a un peu évolué depuis ma première animation (heureusement). J’ai lu d’une traite ActionScript 3.0 CookBook, un livre que je recommande à tous !

Pour vous donnez une idée, voici deux trucs que j’ai réalisé ces derniers jours :

* Un détecteur de mouvement simple (et avec du flou). Vous devez avoir une webcam pour que ça fonctionne. Vous pouvez régler la sensibilité et le niveau de flou, entre autres. Les fichiers sources : MyWebcam.as et MotionDetector.as
* Un exemple où je joue avec la lumière et les ombres. J’ai du me rappeler ma trigonométrie… Comme quoi, les mathématiques, c’est utile (je n’arrête pas de le répéter). Le fichier source : Galaxy.as

Ma première animation Flash…

03/25/08

This post is more than 9 years old. It might not reflect my current skills and convictions.

C’est moche, les animations sont à chier, le code source doit sûrement être optimisable à mort mais soyez indulgents, c’est ma première animation Flash !

Cliquez sur le carré rouge pour lancer l’animation, sur la voiture pour la stopper et sur le carré bleu pour revenir au début…

Juste pour rire, voici le code source.

Toute suggestion d’amélioration est la bienvenue !