![Page 1: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/1.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
What do AJAX and Web 2.0 Really Mean for IAs?
David Hellerwww.synapticburn.com
March 2006IA Summit 2006
Vancouver, British Columbia, Canada
![Page 2: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/2.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Buzz, Hype - So What?
![Page 3: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/3.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
How we got here - Web 1.0
• Publishing• Transacting• Communicating• Collaborating
• Documents• Forms• Frames• Thin Client
![Page 4: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/4.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
What is Web 2.0?
![Page 5: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/5.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
And then there is this …
![Page 6: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/6.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
What’s the biggest deal(s)?Primary● Letting it go free
– Access to content and services -- RSS, APIs● Playing with others
– The economy of mediating participation in concert with consumption
Secondary● Shaking up the page
– Desktop metaphors– Cinematic visual behaviors
● Mashing it up
● Systemic Changes to HOW–Offshore–Small team–No designers–Agile–Short turn aroundWhat other qualities do you all think?
![Page 7: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/7.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Patterns of Web 2.0● Spaces for collaboration
– Rate– Review– Comment– Tag– Blog– Feed
● Re-mixing & Mashing– Combining different content sources– Letting people use your content source– Enabling content and services to be mixed
![Page 8: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/8.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Defining AJAX• Uses technology from the 90’s
• Actually Microsoft DID do something constructive
• Simple Explanation– I can make any part of the browser do an HTML request
– I can retain entire (fairly large) datasets in memory
– I can then act on those datasets
• For the techies– XMLHttpRequest - this is a JavaScript method
– XML - a means of structuring data
– Asynchronous - Well, all the web is asynchronous.
JJ Garrett-Ajax: A New Approach to Web Applications
![Page 9: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/9.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Just for Fun - Comet
QuickTime™ and aTIFF (LZW) decompressor
are needed to see this picture.
Alex Russell’s - Coment: Low Latency Data for Browsers - alex.dojotoolkit.org
![Page 10: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/10.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Historical Contextthin
thick
mainframe
Client-server
Web 1.0
RIA
![Page 11: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/11.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
It used to be about content
![Page 12: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/12.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Time is our new constant companion
![Page 13: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/13.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Changing our ways● Prototyping vs. Documenting● New patterns for people designing for the web
● Planning to let people control your content
![Page 14: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/14.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Changing the Magic
Our primary job is to do what?● Design● Validate● Communicate● Document
![Page 15: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/15.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
What happen to our precious page?
“There is no [page].” - Neo
“There is no page; only pathways”-- Emily Chang & Max Kiesler of ideacodes
A page is a metaphor of a moment of uninterrupted context
![Page 16: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/16.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
The old page - Orbitz
![Page 17: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/17.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
The new page - Paguna
![Page 18: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/18.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Wireframes aren’t enough● Time is now our driving axis
– Needs to be explored like other parameters● Meat is in the details
– And the details are behavioral– And compartmental
● (no longer are we purely interested in the whole)● Gotta learn your tech● Breaking down interaction from structure from presentation
● Can’t test for use in the context of time without interaction
![Page 19: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/19.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Should everything be a desktop app?● What is a desktop application?
– Responsive– Content creation– Specific metaphors (i.e. WIMP)– Cinematic interaction with animation
● Mac OSX Dock with Genie Animation● What about ubiquitous Web metaphors?
– Back-button– Hyperlink– No windows (?)
● Do we really know what users want?– MS research and Apple designs are really pointing the way
● Progressive Display vs. Everything from Everywhere
![Page 20: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/20.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
AJAX Interaction Patterns
● Inline editing● Data set manipulation● In line/in context validation(s)● “instant” query results (version of progressive display)
● Contextual intelligent navigation and information display
● Data display from multiple interacting sources
![Page 21: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/21.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Examples from the public Internet
AJAX Examples• Yahoo Maps• Wufoo• Zimbra
Web 2.0 Examples• Frappr.com• Wayfaring• Shadows• Ning
Offline Web 2.0??
![Page 22: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/22.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Yahoo Maps Beta
![Page 23: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/23.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Yahoo Maps Beta
![Page 24: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/24.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Wufoo.com
![Page 25: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/25.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
More Wufoo.com
![Page 26: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/26.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Zimbra - email+mashing API’s
![Page 27: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/27.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Zimbra e-mail client
![Page 28: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/28.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.comZimbra email w/ Desktop
Interactions
![Page 29: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/29.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Frappr.com - Social Mashing
![Page 30: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/30.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Wayfaring.com - mapmashing
![Page 31: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/31.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Shadow Pages
![Page 32: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/32.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Shadow pages
![Page 33: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/33.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Shadow Pages - creating one
![Page 34: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/34.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Issues with AJAX & Web2.0● Accessibility● Too open?
– Abuse through all kinds of spam, phishing, etc.– Should all brands be open?– Should all brands promote participation?
● Controlling access? Loosing to our competitors?
● How to differentiate● X-browser concerns● Scalability - too many connections to the server?
![Page 35: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/35.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Rules of Design Engagement● Outline your story or choreograph your dance
– Interaction is indeed a play or dance● So many interacting aesthetic elements at play to create a whole
● Keep your developers in the loop during design– I mean it!– Dangerous moment of Serendipity– Scale and performance are key to design success
● This is software– Requires deep dive into pathways
● Exceptions will abound and need to be designed for
![Page 36: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/36.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Some take home advice● Don’t require a submit button for single field forms● Be careful of too much interaction inside of a table
– Unexpected & confusing● Control the back button (you can control it)● Dialogs are a powerful tool towards creating contextual modality
– WARNING: this is a desktop app metaphor– Dialog != popup window
● Even if done with a browser window (test for popup-blockers)● DHTML dialogs are very useful indeed
● Imitation is flattery– If you’ve seen it in a desktop app, try it out in your web app.
BE CREATIVE!
![Page 37: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/37.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Resources● Ajaxian.comGreat mix of technical insights and survey of examplesmix of contributors
● eHub - http://www.emilychang.com/go/ehub Listing of Web 2.0 apps with interviews of those making themEmily Chang
● Functioning Form - http://functioningform.com/ Insights on design issues about all types of interfaces including those rich and on the Internet.Luke Wroblewski
● Too many others to mention here. My reading list here: http://synapticburn.com/more.php?id=112_0_1_0_M3
Surf or drown!
![Page 38: Download slides for 'What do AJAX, RIAs and Web 2.0 Really](https://reader035.vdocuments.site/reader035/viewer/2022062615/5489b075b47959e70c8b5a41/html5/thumbnails/38.jpg)
David Heller
March 2006 IA Summit 2006
synapticburn.com
Thanx … questions?
David Hellerhttp://synapticburn.com/