melbourne chapter

Last year I worked on a website called Living Edge which sell classic furniture by great designers (such as Ray and Charles Eames, Charles Wilson, Norman and Quaine, George Nelson, Bill Stumpf) and brands (Herman Miller, Emeco, Walter Knoll and the like).

The project was based off a custom written content management database that allowed the Living Edge staff to maintain every aspect of their online product catalog online, such as creating designers, manfacturers, categories, products, galleries and work with PDF and CAD attachments to create a rich useful interface to their A’n'd (architects and designers).

As a core requirement to the project we had to consider an implementation of a search engine which would allow architects and designers to choose their preferred way of browsing a catalog (such as via their favourite designer or brand, or look under particular categories to find inspiration). With this in mind and with LivingEdge providing such a comprehensive product catalog, I implemented a series of AJAX based Drilldown Menus.

The AJAX technology was fairly new to me at the time, but was fastly becomming respected as the direction for creating powerful HTML interfaces. I chose AJAX because we could quickly drill down through the product catalog without requiring refreshes or mass data to be sent to the clients browser. It also was a way for us to limit the possibility of users choosing combinations that did not exist and result in “zero” matches.

Overall we were able to provide real-time indications of how many results would be returned for each combination and indicate beside each option. We could also remove options and guide the user quite quickly. Users could start anywhere across the dropdowns and only place in as much information as they like.

I implemented the solution using PHP to query my relational database, and built XML WDDX packets to translate the information (in a datastructure) to the front-end clients JavaScript API. I used a simple framework called SAJAX as a basis for handling my HTTP XML Requests. I also created a server-side proxy which would instantly return packets based on the criteria parsed to the server through the request to dramatically reduce load and execution times of queries. Overall it was very very snappy.

The client was very happy with how the search engine worked, and has sparked a “revamp” of several of its competitor websites. LivingEdge were able to raise the bar and provide a very quick and useful resource for their visitors to use.

Visit the Living-Edge site here.
(Interface Design, Flash and Graphics by Sacha Jerrems)

You can learn more about AJAX and AJAX design patterns online by checking out the very useful resource: http://www.ajaxpatterns.org/ or view information about SAJAX here. You can learn about distributed data exchanges on WDDX here.