AJAX & Flash What we learned building SlideShare.net Jonathan Boutelle

Jonathan Boutelle

First www.jonathanboutelle.com www.slideshare.net/jboutelle

www.jonathanboutelle.com

www.slideshare.net/jboutelle

ymmv

Play the field You don’t have to choose You quite possibly need both

You don’t have to choose

You quite possibly need both

Keep Flash on a leash http://www.california-gold-rush-miner.us/california-gold-nugget.htm

SEO ;-<

Load time ;-<

Flash nuggets as best practice Full-Screen?

Invisible Flash! Swfupload Dojo.storage

Full-screening? OK for “immersive” experiences

OK for “immersive” experiences

Cheapest Tricks “Is it even AJAX”?

“Is it even AJAX”?

Tabs

Accordions

MicroLink

One-Second Mutation

PopUp

Cheap Tricks and Server-side Performance

3) Cheap(ish) Tricks Malleable Content Progress Indicator One-Second Spotlight

Malleable content The Brand Gap Tags Brand design The Brand Gap From: coolstuff , 1 day ago 326 views | 1 comment | 5 favorites Tags Brand design branding The Brand Gap From: coolstuff , 1 day ago 326 views | 1 comment | 5 favorites Tags Brand design branding Share this slideshow Digg this Subscribe to user Mark as inappropriate Favorite [x] tags : brand design branding marketing (Edit) 1 3 4 Share this slideshow Digg this Subscribe to user Mark as inappropriate Favorite [x] tags : brand design (Edit) From: coolstuff , 1 day ago 326 views | 1 comment | 5 favorites The Brand Gap From: coolstuff , 1 day ago 326 views | 1 comment | 5 favorites Tags Brand design branding Add/Edit tags Separate tags by spaces. Put multi-words tags within quotes, e.g., “palo alto” Cancel Update brand design 2

Progress Indicator

One-second spotlight Pricew’s Slidespace pricew Male, San Francisco, CA pricew.blogspot.com Pricew’s Slidespace pricew Male, San Francisco, CA pricew.blogspot.com 2 1 Add pricew as contact Ping pricew Add pricew as contact Ping pricew Message price1 pings Liked your presentation on venture capital By jboutelle (1 second ago) Welcome to SlideShare By userx (2 days ago) This is great by coolstuff (5 days ago)

Temp Messages Pricew’s Slidespace pricew Male, San Francisco, CA pricew.blogspot.com Add pricew as contact Ping pricew Message pricew Liked your presentation on venture capital By jboutelle (1 second ago) Welcome to SlideShare By userx (2 days ago) 1 Pricew’s Slidespace pricew Male, San Francisco, CA pricew.blogspot.com Add pricew as contact Ping pricew Message pricew 2 Hey dude! Long time… pings Liked your presentation on venture capital By jboutelle (1 second ago) Welcome to SlideShare By userx (2 days ago) Message Sent!

Cheap Tricks and server-side performance (2)

Net Impact (on engineers) (on users) (on IA)

4. Flash graphic goodies Fonts Vector graphics Animation

Fonts

Vector graphics

Animation

Flash multimedia output

Flash multimedia input

Flash multimedia editing

6. Widgetopia! Yes, I mean widgets

Yes, I mean widgets

http://www.baychi.org/calendar/20060314/

Upload progress bars Swfupload.js

Sockets!

Local Data Objects “ supercookies” dojo.storage

7. Cool, but not useful to me FLEX (125 kb download size)

FLEX (125 kb download size)

8. AJAX FLASH crossover Artists

Finally

www.slideshare.net/jboutelle Questions?

www.slideshare.net/jboutelle