Web 2.0 for IA's

  • 3,305 views
Uploaded on

A presentation teaching IA's why they should care about emerging trends known as Web 2.0

A presentation teaching IA's why they should care about emerging trends known as Web 2.0

More in: Technology
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
  • Great demonstration about the need to innovate business models; how you can represent them succinctly; together with the need to make innovation initiatives actionable. Excellent use of photos and obvious to see illustrative samples.
    Sharika
    http://winkhealth.com http://financewink.com
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
3,305
On Slideshare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
0
Comments
1
Likes
10

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. What do AJAX and Web 2.0 Really Mean for IAs? David Heller www.synapticburn.com March 2006 IA Summit 2006 Vancouver, British Columbia, Canada
  • 2. Buzz, Hype - So What?
  • 3. How we got here - Web 1.0
    • Publishing
    • Transacting
    • Communicating
    • Collaborating
    • Documents
    • Forms
    • Frames
    • Thin Client
  • 4. What is Web 2.0?
  • 5. And then there is this …
  • 6. 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 around
    What other qualities do you all think?
  • 7. 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
  • 8. 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
  • 9. Just for Fun - Comet Alex Russell’s - Coment: Low Latency Data for Browsers - alex.dojotoolkit.org
  • 10. Historical Context thin thick mainframe Client-server Web 1.0 RIA
  • 11. It used to be about content
  • 12. Time is our new constant companion
  • 13. Changing our ways
    • Prototyping vs. Documenting
    • New patterns for people designing for the web
    • Planning to let people control your content
  • 14. Changing the Magic
    • Our primary job is to do what?
    • Design
    • Validate
    • Communicate
    • Document
  • 15. 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
  • 16. The old page - Orbitz
  • 17. The new page - Paguna
  • 18. 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
  • 19. 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
  • 20. 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
  • 21. Examples from the public Internet
    • AJAX Examples
    • Yahoo Maps
    • Wufoo
    • Zimbra
    • Web 2.0 Examples
    • Frappr.com
    • Wayfaring
    • Shadows
    • Ning
    Offline Web 2.0??
  • 22. Yahoo Maps Beta
  • 23. Yahoo Maps Beta
  • 24. Wufoo.com
  • 25. More Wufoo.com
  • 26. Zimbra - email+mashing API’s
  • 27. Zimbra e-mail client
  • 28. Zimbra email w/ Desktop Interactions
  • 29. Frappr.com - Social Mashing
  • 30. Wayfaring.com - mapmashing
  • 31. Shadow Pages
  • 32. Shadow pages
  • 33. Shadow Pages - creating one
  • 34. Examples from my work
    • I will review examples of …
    • Incorporating both AJAX and other Web 2.0 functionality into our system
    • How we are changing the way we communicate and do design.
    • Gotta come to see
  • 35. 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?
  • 36. 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
  • 37. 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!
  • 38. Resources
    • Ajaxian.com Great mix of technical insights and survey of examples mix of contributors
    • eHub - http://www.emilychang.com/go/ehub Listing of Web 2.0 apps with interviews of those making them Emily 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!
  • 39. Thanx … questions? David Heller http://synapticburn.com/