Sélectionner une page

Le mois dernier j’ai fait un peu d’illustration, sous l’influence de mon fils Peïo, 5 ans et demi, qui a reçu une lunette astronomique du père Noël. Après avoir observé la lune ensemble, j’ai ressortis du fond de mes archives, un dessin de la lune qui n’avait jamais servi. J’y ai ajouté une fusée et des soucoupes volantes pour le plus grand bonheur du minot.

Voulant mêler l’utile à l’agréable j’ai intégré et animé tout ça en html5 avec une chouette application, en créant la “madudesign Facebook landing page“, la page d’accueil des nouveaux venus sur ma page de marque facebook !!

L’outil en question est Adobe Edge preview 4 (encore en version béta mais on peut le tester gratuitement), qui permet à la manière de Flash de créer des contenus animés en HTML5, JavaScript et CSS3. La prise en main est plutôt simple et l’interface utilisateur est un mélange subtil entre After effects et Flash. Même s’il manque encore un tas d’outils de création essentiels*, et la présence de quelques bugs, le preview 4 se comporte plutôt bien. Edge à l’avantage d’être plutôt accessible aux graphistes qui peuvent être retissant au code grâce à l’implémentation de quelques fragments de codes JavaScripts qui permettent  des actions simples. Un projet Edge génère automatiquement et en temps réel un fichier html et tout ses petits fichiers javascript et images à la racine de celui-ci, dans des petits dossiers qui leur vont bien. Vous pouvez donc visualiser votre projet directement dans votre navigateur, ou bien le mettre directement en ligne. Symétriquement vous pouvez aussi importer un projet html dans Egde afin d’y apporter de l’animation interactive. Que ce soit d’un point de vue de l’interface et/ou des fonctionnalités, Edge ressemble un peu à Flash à ces débuts. Voila donc un outil prometteur, et il me tarde de voir comment celui-ci va évoluer.

* Les fonctionnalités à mon goût qui serait super pour la preview 5 sont : des Guides, des règles, l’import de psd, la possibilité d’intervertir les symboles (comme dans flash), les fonctionnalités de dégradés du CSS3, + un petit script de chargement ne sera pas de trop non plus, (car ma page à titre d’exemple est un peu lourde 2,7Mo…) (en attendant j’ai trouvé une parade qui consiste à mettre un gif léger de chargement en arrière plan du fichier html) et pour finir la preview 4 n’exploite pas encore la balise “canvas“, mais cela ne saurait tarder d’après ce que l’on peut lire sur les forums.

Voir ma page facebook et liker là : http://www.facebook.com/pages/Madudesign/172487069518048

Pour en savoir plus Edge : http://labs.adobe.com/technologies/edge/

http://tv.adobe.com/watch/adc-presents/introducing-adobe-edge-preview-4/