Slideshow transcript
Slide 1: Experience AJAX Workshop for Designers June 20, 2006 WEB 2.0 & AJAX Ravi Shankar, Oracle Sreedhar Gunduboina, ADP usability.in USID 2007
Slide 2: What is Web 2.0? Lot of current technologies have been around for sometime.. Web Services API.. Around since 1998 Web Syndication- since 1997 AJAX- 1998 Services on the web (payment, information, ..) - 1990s Blogs.. As web diaries/journals around for a long time Online music around since mp3.com Encyclopedias & info databases since Yahoo & Britannica… Then what is next generation internet & Web 2.0? Is it Buzz, Marketing Hype? or Changing attitude ?
Slide 3: Attitude shift from Web 1.0 to Web 2.0 Publisher (Powerful) Publisher (Still in Control) Users (Humble, Grateful) Users (Sharing Information, Demanding More) Enablers, Brokers , Networks, Search Engines Publisher (Humble, Sharing Users content) (Empowered, Interacting, Creating)
Slide 4: Defining Web 2.0 “Web 2.0 is made of people” Key Aspects of Web 2.0 The Web and all its connected devices as one global platform of reusable data and services Data consumption and remixing from all sources, particularly user generated data Continuous and seamless update of software and data, often very rapidly Rich and interactive user interfaces Architecture of participation that encourages user contribution user ownership of data Web 2.0 is an attitude not a technology.
Slide 5: You are part of web 2.0 You are part of web 2.0 Every time you search, you make google better You are Blogging, Commenting, tagging, Digging, Wikiing People talk about you - Technocrati, coComment, Flickr System Changes Single idea = New business Build in smaller parts Add to the ecosystem Offshore; Small teams; Designers/Developer Blend; Agile; Short turn around
Slide 6: A confluence of a number of trends Shaking up the page Desktop metaphors; Cinematic visual behaviors The RIA model will evolve to greater heights Focus on User, rich usable interfaces Letting it go free Traditional software needs to be redefined Access to content and services – RSS, APIs The Mashup phenomenon will mature Playing with others The economy of mediating participation & consumption An increasing attention scarcity Online social communities Semantic web, Interactive web, Social Web
Slide 7: Key Technology Constituents Unobtrusive RIA techniques such as Ajax Semantically valid XHTML, CSS or Microformats Advanced UI languages such as XUL and SVG Syndication and Aggregation of data in RSS/Atom Clean and meaningful URLs Weblog publishing Flash Remoting REST or XML Webservice APIs Semantic Web (Tagging) Some social networking aspects
Slide 8: Introduction to AJAX WEB 2.0 & AJAX usability.in USID 2007
Slide 9: Need for AJAX Is it for Developers or Designers? Issues with web applications Page based High level of granularity Almost all processing on the server High latency Not responsive To take web applications to desktop interaction To increase Web's interactivity, speed & usability Enhance usability & User Interaction
Slide 10: Defining AJAX - Asynchronous JavaScript And XML What it is NOT Ajax is not a new technology. What it is is a Web development technique What has enabled AJAX The de-facto standard XMLHttpRequest Ajax incorporates standards-based presentation using XHTML and CSS; dynamic display and interaction using the DOM; data interchange and manipulation using XML and XSLT; asynchronous data retrieval using XMLHttpRequest; and JavaScript binding everything together.
Slide 11: How is AJAX different Jesse James Garrett – Adaptive Path
Slide 12: Who is using it Google Google Maps Gmail Google suggest Yahoo! Flickr del.ici.ous 37signals Backpackit Basecamp Tadalist Amazon –A9, Thousand's of businesses
Slide 13: Layers of AJAX Framework Web Application frameworks with AJAX Extensions Shale, Echo2, Ruby on Rails Ajax based RIA Frameworks Bindows, Smart client, Backbase Utilities & tools User Interface Toolkits DOJO, RICO, Yahoo UI Communication libraries DWR, JSON-RPC, DOJO.io.bind() XMLHTTP Iframe …….
Slide 14: What’s wrong with AJAX Breaking the back button Not giving immediate visual cues for interaction Not using links I can pass to friends or bookmark A big problem for spidering and search engines Too much code makes the browser slow Blinking and changing parts of the page unexpectedly Leaving offline (poor connectivity) people behind Asynchronously performing batch operations Changing state with links (Get Requests) Non obvious navigation to drive non obvious result
Slide 15: What’s wrong with us… Let user to adopt to new UI Conventions Not cascading local changes across the page Mimicking browser page navigation imperfectly AJAX everywhere – overdoing like FLASH Using Ajax for the sake of Ajax Have clear idea about ROI for RIA Finally - Ajax is just another tool
Slide 16: Design Concepts and Concerns Desktop application metaphor Responsive Specific metaphors (i.e. WIMP) Cinematic interaction with animation What about ubiquitous Web metaphors? Back-button Hyperlink No windows (?) Understand web application vs website Meat is in the details And the details are behavioral And compartmental (no longer are we purely interested in the whole)
Slide 17: Design Concepts and Concerns There is no page; only pathways Shaking up the page - Desktop metaphors Cinematic visual behaviors Time is now our driving axis Key design parameter to be explored Think in terms of time and context Designing for different States In classic web, design decisions are built into the browser. In Ajax, they are explicit choices by the designer dataflow analysis (State chart diagram) Understand what user wants Do not break what the user is focusing on Manage attention effectively
Slide 18: Design Concepts and Concerns Letting it go free Access to content and services -- RSS, APIs Build in reusable blocks, visualize big picture Encourage participation 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
Slide 19: Design Concepts and Concerns Innovate process, methods & tools Design Validate Document Communicate Changing our approach Prototyping and Documenting New patterns for people designing for the web Know the tech, work closely with development Breaking down interaction > structure > presentation Can’t test for use in the context without interaction Understand the big picture, design for the user
Slide 20: Rich Internet Apps & Alternatives Plug-in based Flex, SVG Browser Based XUL XAML UIML Laszlo XML Big Tickets Adobe Apollo / AIR Microsoft Silverlite / WPF/E Sun JavaFX Google Gears
Slide 21: Resources O’Reilly - Web 2.0 - http://www.oreillynet.com Jesse James Garrett – AJAX - http://blog.jjg.net/ AJAX Patterns - http://ajaxpatterns.org/ AJAXIAN - http://ajaxian.com/ AJAX Matters - http://ajaxmatters.com/ AJAX info - http://ajaxinfo.com/ AJAX Lessons - http://www.ajaxlessons.com/ Functioning Form - http://functioningform.com/
Slide 22: Slides, demo files and resources are available at http://www.usability.in/ajax WEB 2.0 & AJAX Contact us Ravi Shankar, Oracle ravishankar.s@gmail.com Sreedhar Gunduboina, ADP sridhar.s@gmail.com usability.in USID 2007




Add a comment on Slide 1
If you have a SlideShare account, login to comment; else you can comment as a guest- Favorites & Groups
Showing 1-50 of 10 (more)