Designing for AJAX and JavaScript
I gave a team presentation the other day on AJAX and JavaScript focusing on how our designers can best tackle this approach in their creative, and how our account managers can describe the technology without sounding like idiots.
The fundamental, non-technical, difference between AJAX and JavaScript is that JavaScript moves stuff around the page, while AJAX is a way of getting/sending dynamic data without reloading the page. That’s about as simple as it gets without pointing and grunting, and I think even Robin almost understood it.
Designers are very visually led and have short attention spans so I decided to show them examples of what JavaScript can do, rather than how its used. Here is a list of examples :
- JQuery’s Interface Elements is a collection of functions which make it easy to apply animation to any element on the page.
- Tabs is an example of the tab interface without the page reload.
- Advertising can benefit from JavaScript.
- Rounded Corners without me begging our designers to use straight corners.
- Changing Colours is smooth and easy.
- Manipulating Images can be used in content management systems.
- Reflecting images is easy (even though its going to date quicker than milk in a desert).
- Other Stuff is possible too!
Gap.com’s product pages use AJAX very effectively
AJAX is a bit more complicated to demonstrate, so its best to show some sites that are currently using it (apart from the obvious ones that we all know about, like Flickr and Google Personalised Homepage):
- Gap’s basket and product selection.
- Panic’s drag-and-drop basket functionality.
- Amazons A9’s adding/moving/updating and deleting sections without page reload.
- Casting Collective is a nice site i found when promoting our Humdrum Idol site.
- Zillow is an AJAX mash-up with a great search narrowing feature.
A point to mention is that this isn’t new, and it’s still the same technology that gave us the atrocious googly eyes which followed the mouse around badly-designed GeoCitites homepages back in the day. The difference now is that there are libraries (such as script.aculo.us and jquery) which encourage us to use accessible and, above all, useful JavaScript.
Other points of call for keeping up with the AJAX trends are the AJAXian showcase and MiniAjax.
Filed under: Industry Comment on March 10th, 2007
[…] first thing to note about this game is that is built using AJAX (Ollie wrote a post elaborating on the merits of AJAX in an earlier post). It’s a very intuitive game in terms of useability, although if you […]