Upload
christophe-porteneuve
View
1.851
Download
3
Tags:
Embed Size (px)
DESCRIPTION
Les moteurs JavaScript récents sont ultra-rapides, on commence à pouvoir faire de vraies animations en CSS, on peut dessiner en bitmap comme en vectoriel dans plein de navigateurs, et la vraie 3D accélérée sans plugin est en train de poindre le bout de son nez… En somme, Flash n’a plus guère d'argument côté effets visuels. D'autant qu'il prend, au final, beaucoup plus de ressources que ses alternatives. Alors, qu'est-ce que vous attendez pour vous y mettre ? Cet atelier fera un tour d'horizon des possibilités, exemples à l'appui, afin de vous mettre le pied à l'étrier.
Citation preview
Comment ça c’est pas du Flash ?!
Christophe Porteneuve • Paris Web 2010
Christophe qui ?
• @porteneuve + @gitattitude
• 33 ans, Paris, CTO @ Ciblo
• Prototype, script.aculo.us / Scripty2, Rails, Basecamp, Freckle
• Bouquins chez Eyrolles & Pragmatic Bookshelf
Alors déjà, Flash…
• Ça suce la machine jusqu’au sang
• Même quand ça fout pas grand chose
• Ça ne sera jamais sur iOS
• Ça a beaucoup de mal sur les autres périphériques mobiles
• Ça fait pas tant de choses que ça !
Et donc…?
Les standards du Web nous fournissent une térachiée™ de technologies plus ouvertes, plus puissantes et moins gourmandes.
http://bit.ly/not-in-flash-anymore
L’idée de cet atelier
1. On fait le tour du web et vous en prenez plein les mirettes
2. On fait quelques essais en live
3. Vous sortez remontés à bloc et allez pondre un truc qui tue dès ce soir !
4. Profit !
Leçon 1
CSS roxxe des Pimms
Leçon 2
Canvas arrache le slip
Leçon 3
SVG met une branlée
Leçon 4
Web Fonts FTW!
Leçon 5
A/V Cæsar !
Leçon 6
WebGL — Waoôoouh !
Accélération matérielle
• CSS3 Transforms 3D, WebGL, Canvas…
• Safari : partout (OSX, iOS, Windows)
• FF4 Windows (dont XP)
• IE9 (pas XP, mais sinon à fond !)
• Chrome/Opera y travaillent
Quand est-ce qu’onse goinfre mange ?
• FF3.5+ (boost perfs avec FF4)
• Safari 4+ (5, Webkit… = perfs ↗)
• Chrome 5+ (6, 7 = perfs ↗)
• Opera 10.6
• IE9
Travaux Pratiques
Merci.
• @porteneuve + @gitattitude
• http://www.slideshare.net/tdd