Hello, I’m Vinch

And this is my website.

Flash, c’est de la merde !

07/21/09

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

Cette phrase, je pense que je dois l’entendre au moins trois fois par jour dans notre jeune société 1MD. Bien que nos derniers sites (Fear Tracker et The Prototype Experience) utilisent cette technologie à merveille, il serait vraiment idiot de penser que nous faisons partie d’un quelconque fan club d’Adobe ! En effet, Flash est une technologie propriétaire encore complètement imparfaite malgré ses 13 ans d’existence. L’IDE est une vraie plaie et le langage ActionScript doit quasiment être réappris à chaque nouvelle version (AS1, AS2, AS3). De plus, elle présente de profonds manquements au niveau de l’accessibilité et du référencement…

Dans ce cas, pourquoi utilisons nous cette technologie ?

Tout simplement car ce que nous voulons faire est totalement impossible avec n’importe quelle autre technologie existante… Toutes les technologies dites “standard” comme JavaScript, SVG, Canvas, les animations CSS, etc. permettent de splendides choses mais sont encore trop limitées pour l’impitoyable monde réel, et pour certaines pas encore implémentées sur tous les navigateurs du marché. A ce jour, si vous voulez faire de la 3D ou afficher de la vidéo, seul Flash vous le permet…

Et Silverlight ?

Oui, c’est vrai, Silverlight permet, à peu de choses près, de faire la même chose qu’avec Flash… Cependant, Silverlight possède tous les défauts de Flash (propriétaire, IDE défaillant, accessibilité, référencement, etc.) sans disposer de ses principaux avantages (taux de pénétration, ressources disponibles, etc.). A part quelques fans de Microsoft, personne ne développe avec cette technologie morte-née… A oublier au plus vite donc ! (là, je vais me faire des ennemis)

Mais que faire pour le référencement et l’accessibilité ?

Certains types de sites doivent obligatoirement être en HTML. Je pense aux blogs, aux sites d’informations et aux sites proposant, de manière générale, une quantité relativement importante de contenu textuel. Dans ce genre de sites, le contenu est roi et doit être lisible par tous et facilement indexable. Sans ça, ces sites sont inutiles, tout simplement. Impossible donc de les imaginer en Flash.

Certains autres sites, quant à eux, sont ce qu’on appelle des expériences c’est-à-dire des campagnes marketing faisant la promotion d’un produit lambda et destinées à durer quelques mois. C’est le cas des deux sites que j’ai cité en début d’article. Ici, le plus important est d’en mettre plein la vue et de créer de la viralité. Pour en mettre plein la vue, la meilleure technologie à ce jour est Flash.

J’assistais il y a quelques semaines à une conférence de Michelle Blanc où celle-ci disait que seul le développeur, le client, la mère du développeur et la mère du client pourraient voir un site réalisé en Flash. Avec tout le respect que je lui dois et toute la sympathie que j’ai pour elle, je pense que Michelle n’a pas compris qu’il existait plusieurs types de sites et que chaque type de site était adapté à une certaine technologie. Pour info, Fear Tracker et Prototype ont réalisé respectivement 600000 et 1000000 visites lors de leurs quatre premières semaines de vie. Alors, soit le développeur et le client ont de gigantesques familles, soit il y a un truc.

C’est quoi le truc ?

Premièrement, ces sites ont été repris dans de nombreux tweets et dans de nombreux walls Facebook. Le référencement naturel n’est pas la seule source de trafic ! Deuxièmement, ces sites sont malgré tout référencés ! Certes, pas de manière directe, mais quand même… Tapez “Fear Tracker” ou “Prototype Experience” dans Google et vous aurez un nombre très importants de résultats. Il s’agit de tous les blogs qui parlent des sites en question. Donc, même si c’est totalement inutile pour ce genre de sites, ils sont quand même référencés, de manière indirecte.

Pour moi, penser que le Web se résume à une seule technologie (que ce soit HTML ou Flash), c’est comme être handicapé, comme utiliser ses bras et pas ses jambes et inversement. Une des grandes forces de 1MD est de pouvoir proposer la technologie adéquate aux attentes du client par rapport au type site qu’il veut construire. HTML est de loin le meilleur pour un site à contenu majoritairement textuel, Flash pour des sites promotionnels censés avoir une durée limitée dans le temps et pourquoi pas Flex pour des interfaces d’administration et des intranets…

Je tenais vraiment à écrire cet article pour dire que nous ne sommes vraiment pas fans de Flash mais que ce dernier a quand même sa raison d’exister et qu’il est idiot de vouloir à tout prix sa mort.

Que ce soit bien clair, si une technologie standard venait à sortir demain et permettait les mêmes choses que Flash, nous l’adopterions sur le champ. Mais je crains que ce ne soit pas demain la veille que cela arrivera !

Premier test de la 3D dans Flash Player 10

05/19/08

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

Comme vous l’avez sans doute lu un peu partout, Flash Player 10 vient de sortir (le 15 mai pour être exact) et ça s’annonce génial pour les développeurs que nous sommes. Un collègue a fait un très bon résumé des nouvelles fonctionnalités de Flash Player 10 (nom de code “Astro”) donc inutile que je répète tout ici.

Je me suis personnellement penché sur la 3D gérée de façon native dans cette nouvelle mouture de Flash Player. Cela nous permettra, à terme, de nous passer de Papervision3D (ou équivalents) pour faire de la 3D simple en Flash.

Le problème avec Flash Player 10, c’est qu’au moment où j’écris ces lignes, aucun éditeur ne le prend encore en charge. Il faut donc tout compiler à la main pour arriver à générer nos SWF ce qui peut sembler un peu rebutant à première vue mais pas si compliqué que ça en fait (si j’y suis arrivé, vous y arriverez).

Avant tout chose, vous devez désinstaller Flash Player 9. J’ai utilisé Flash Player Uninstaller pour cela. Ensuite, téléchargez et installez Flash Player 10.

Une fois Flash Player 10 installé, suivez ce tutorial qui va vous expliquer comment on peut compiler en lignes de commande. Ne faites pas attention à tout ce qui concerne Flex Builder, vous pouvez travailler avec l’éditeur de texte que vous souhaitez (moi, c’est TextMate), seules les sections “First Things First” et “Command-line Compiler” nous intéressent. Tout ce que vous devez faire en gros, c’est télécharger la nightly build la plus récente de Adobe Flex SDK et de modifier le fichier de configuration comme indiqué.

La dernière chose à faire est compiler vos fichiers ActionScript en utilisant la commande mxmlc (sous Windows, utilisez mxmlc.exe) qui se trouve dans le répertoire bin du SDK.

Exemple :

./mxmlc ../../astro/ThreeD.as

Cela va générer un fichier ThreeD.swf au même niveau que le fichier ActionScript. Ce fichier SWF doit impérativement être ouvert avec un navigateur Web. Cela ne va pas fonctionner en standalone !

Intéressons nous maintenant à réaliser un petit exemple en 3D avec les possibilités de Flash Player 10. Allons d’abord jeter un oeil à ThreeD.as. Ce fichier va générer 200 carrés à des profondeurs différentes et avec des couleurs et des positions en x et en y aléatoires. Lors d’un click sur un carré, celui-ci va se retourner sur lui-même et on va s’en rapprocher.

Voilà la résultat : 3D experiment with Flash Player 10.

Notez que l’inclusion du SWFObject doit se faire de cette manière :

var so = new SWFObject("ThreeD.swf", "threed", "600", "400", "10");

Dans cet exemple, les deux grandes nouveautés qui rendent notre vie plus belle sont les suivantes :

* Pouvoir déterminer z (profondeur) en plus de x et y sur un Sprite ou MovieClip.
* Pouvoir faire des rotations sur l’axe en x, y et z (via rotationX, rotationY et rotationZ) alors qu’autrefois, seul rotation existait (qui est équivalent à rotationZ).

En quelques lignes de code, nous avons donc réalisé un petit truc sympa en 3D. Il aurait certainement fallu quatre à cinq fois plus de temps et de lignes de code pour faire ça avec Papervision3D. Vive Flash Player 10 !

Cet article a été inspiré par les deux screencasts suivants de Lee Brimelow (je n’ai rien inventé) :

* Flash Player 10 Beta: Getting Started
* Flash Player 10 Beta: 3D

Flash et problèmes de compatibilité !

04/29/08

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

On pourrait penser qu’en Flash, les problèmes de compatibilité entre navigateurs et systèmes d’exploitations n’existent pas ! Et bien non, c’est une légende urbaine !

Aujourd’hui, j’ai essayé d’ajouter deux bêtes fonctionnalités au Twitter3D de Michaël. Vous pouvez admirer le résultat ici (le seul fichier qui change par rapport au code de Michaël est Twitter3D.as). Les fonctionnalités en question sont :

* Afficher un input pour pouvoir choisir le compte dont on souhaite afficher les tweets.
* Pouvoir naviguer avec la roulette de la souris.

Pour la première fonctionnalité, je n’ai eu aucun problème. Essayez en tapant “Vinch01” ou “michaelvillar“, ça fonctionne. Il faut juste que j’améliore l’ergonomie car cet input ressemble à une barre de loading qui ne se loade pas !

Pour la seconde fonctionnalité, en revanche, j’ai eu l’immense surprise d’apprendre que la gestion de la roulette de la souris en Flash ne fonctionne pas sur Mac ! Il a donc fallu utiliser un bon vieux hack ! L’explication du hack se trouve sur ce blog. En résumé, il faut, d’une part, importer une librairie dans le fichier Flash et d’autre part, ajouter un petit JavaScript dans le fichier HTML qui contient le SWF. C’est complètement tordu mais quand on fait aussi du XHTML, CSS et JavaScript, on est habitué à ce genre de choses. Je suis un peu déçu car je pensais que le verbe “chipoter” ne faisait pas partie du vocabulaire Flash. En même temps, c’est pas trop grave, l’important c’est qu’il existe une solution relativement robuste pour réparer tout ça…

Et de votre côté, vous connaissez d’autres problèmes de compatibilité dans Flash ? Ca pourrait m’être utile, je commence les choses sérieuses dans très peu de temps !