WDE08 Designing for interaction with Ajax

Ajaxdesigningfor interaction

with

Ajax

Communicating with the server without refreshing the whole page.

speed

frames

framesiframe

framesiframeFlash

framesiframeFlashXMLHttpRequest

XMLHttpRequest

XMLHttpRequest

Microsoft

XMLHttpRequest

Microsoft IE5

XMLHttpRequest

Microsoft IE5Mozilla Safari Opera

XMLHttpRequest

Microsoft IE5Mozilla

W3CSafari Opera

asynchronous

asynchronous

asynchronous

asynchronous

XMLHttpRequest

browser server« »

thin client

browser server« »

thin client

storage

browser server« »

thin client

processingstorage

browser server« »

thin client

processingstoragedisplay

browser server

rich client

browser server

rich client

« »XHR« »

browser server

rich client

storage« »XHR« »

browser server

rich client

storagedisplay« »XHR« »

browser server

rich client

processingstoragedisplay

« »XHR« »

progressive enhancement

content

contentstructure

contentstructurepresentation

contentstructurepresentationbehaviour

contentstructurepresentationbehaviour

HTML

contentstructurepresentationbehaviour

HTMLCSS

contentstructurepresentationbehaviour

HTMLCSS

JavaScript

contentstructurepresentationbehaviour

HTMLCSS

contentstructurepresentationbehaviour

HTML

progressive enhancement

progressive enhancement

XMLHttpRequest

Hijax

browser server

browser serverstorage

browser server

processingstorage

browser server

processingstoragedisplay

browser server

processingstoragedisplay

« »XHR« »

browser server

deceptivelyrich client

processingstoragedisplay

« »XHR« »

browser server

navigationsearch

main contentlog on form

shopping cartfooter

{browser

XHR

navigationsearch

main contentlog on form

shopping cartfooter

browser

paradox?

plan for Ajax from the start

paradox?

implement Ajax at the end

plan for Ajax from the start

paradox?

pattern recognition

MozillaMozilla

pattern recognition

sign up

MozillaMozilla

pattern recognition

sign up

add to cart

MozillaMozilla

pattern recognition

sign up

add to cartrate this

MozillaMozilla

pattern recognition

sign up

add to cartrate thisadd a comment

MozillaMozilla

pattern recognition

sign up

add to cartrate thisadd a comment

search results?

MozillaMozilla

pattern recognition

sign up

add to cartrate thisadd a comment

search results?

MozillaMozillapagination?

feedback

what is happening?

feedback

what just happened?what is happening?

feedback

conventions

conventions

status indicators

conventions

status indicatorsyellow fade

conventions

status indicatorsyellow fade

drag’n’drop

beyond the browser

beyond the browser

the back button

beyond the browser

the back buttonbookmarking

user testing

adactio.com

http://flickr.com/photos/chuckbiscuito/161971512/

http://flickr.com/photos/ferricide/501816333/http://flickr.com/photos/julianbleecker/3867804/

http://flickr.com/photos/mollyeh11/13664426/

thank youadactio.com

http://flickr.com/photos/chuckbiscuito/161971512/

http://flickr.com/photos/ferricide/501816333/http://flickr.com/photos/julianbleecker/3867804/

http://flickr.com/photos/mollyeh11/13664426/