For our last educational technology brainstorming session at the Educational Technologies and Multimedia Group we discussed Podcasting & Vodcasting. This time we're going to take a look at AJAX -- Asynchronous Javascript & XML -- and its implications for development here at Harvard Business School. Thanks to the group who collaborated in person and via email to create the agenda: Larry Bouthillier, Leo Haskin, Dave Lieberman, Dave Goodrich, and Doug Swanson.
AJAX Overview
- Asynchronous Javascript and XML
- Old model -- every click requires re-loading the entire page even if you just changed one line. AJAX allows page updating without refreshing entire page.
- Javascript makes a call to the server behind the scenes in response to user action. Javascript is used to build user interface on client side -- server sends no UI information. This is in contrast to how we currently build web applications (Struts, Java Faces, etc). From a production standpoint this should be used in conjunction with CSS/style sheets.
Quick Wins
(Derived in part from this Sun Developer Network article which includes a good list of uses and drawbacks)
- Response time, plus page doesn't reload so if you are scrolled down a ways on a page when you update, it doesn't scroll you back to the top.
- Smart forms -- immediate validation, auto-completion and only showing you relevant choices
- Sophisticated user interface controls -- web pages can behave more like desktop apps
Challenges
- New model of development for programmers
- Javascript technology has differences depending on browser client
- Browser 'Back' button may have unintended consequences
Examples
- Google Home Page, Google Maps, Google Suggest
- Zimbra web-based email client
- NumSum web-based spreadsheet
- Monket web-based calendar
- Also see an earlier post on uses of AJAX and the tech-oriented Ajaxian site
Examples at HBS
This kind of technology allows us to focus on those innovate technology uses we've already implemented and think about how we can continue to enrich the user experience on our products and applications. Some of these innovations have actually used AJAX, whereas others embody the same types of benefits.
- Course Platform bucket on the MyHBS portal. This was an early predecessor to AJAX-type innovations using a hidden iFrame that loaded Javascript from the server. This is an example of the "loose coupling" that Larry Bouthillier has made a part of our technology mission -- integration of multiple sources of data into a single source, in this case a web page. Thinking this way opens up many possibilities of how we can assimilate our many areas of content.
- Tutorial Platform Authoring Environment -- we'll look at how AJAX is used in the new content editing feature as well as the module re-ordering tool.
- "Communication Exercise: Distinguishing Truth & Lies" -- we'll look at how an approach similar to AJAX is used in this interface.
- HBS/Google Map Mash-up. Our ETMM intern Jacob Potter created a mash-up of Google Maps with HBS campus info.
It will be interesting for us to consider how to approach designing applications. Even our resourcing model isn't exactly set up for this since many of our top Java programmers don't have Javascript or CSS experience and some of our design/UI/JS savvy folks don't often deal with server coding. Our developer Leo Haskin found this article on which kind of devs will code AJAX apps.
Comments