Roy Zornow MS Word version

IA / UX Designer

email:
Work Samples
Q&A
 
   
Questions & Answers
Question

Answer

What are some of your favorite web sites in terms of design and why?

In answering this question I'll examine three different types of sites, each of which I find to employ successful information design principles:

  1. Craigslist is a global classified ad site divided by city.
  2. Expedia.com is a travel site that allows for price comparison and online booking.
  3. Pandora is a site that hosts a Flash-based application which allows users to edit and share multiple streaming radio stations.

In general I favor sites that emphasize the heuristic of "recognition rather than recall" and the concept of elision - eliminating non-essential elements in order to emphasize those which remains.

1. Craigslist is a global online classifieds site, divided into city pages and offering some advanced functionality such as user forums and an event calendar. It provides a close match between the system and the real world in that the page uses the same language and follows the same layout of an actual newspaper's "classifieds" page, with sections such as "for sale", "jobs" and "housing".

 

Craigslist successfully applies the heuristic of consistency and standards by using the same page template for every city page. Thus a user can navigate within any city page in the world with the ease and familiarity as they can their home city's page.

2. Expedia.com is a travel aggregator which allows users to compare and book airline flights, hotels, and rental cars. It is very good at lowering a user's "memory load" by utilizing principles of inheritance. For example if a user initiates a new attempt at booking an airline flight, the system will store and display the previously-chosen dates.


The user can then, if they choose, change those dates by clicking on a text box which launches a pop-up calendar. The user need not click on the calendar icon, a mouse-click within the text-box initiates the calendar.

While this violates the principle of affordance - one expects a text box to accept keystroke text entry rather than launch a pop-up - the overall usability benefit of saving a mouse-click and directing the user immediately to the highly-usable javascript calendar more than compensates.

In order for this design decision to pay off it must be based on user-research. I once created an online life insurance claims form without the benefit of being able to interview end-users. I too utilized javascript pop-up calendars as the default date-selection method, but later found that the user base consisted of employees who were most comfortable and quickest with keystroke date entry.

Presumably Expedia's end users are not as comfortable typing dates via the number row on their keyboards.

3. A full analysis of Pandora can be found here.

   
What would you improve on any one of these sites to make it even more usable?

Craigslist - Although craigslist benefits from the familiar newspaper page model, it fails to extend its search capability beyond that of the local city and fails to take full advantage of the portability of digital information.

Expedia.com - When Expedia returns a results list of matching flights it offers the following categories displayed as radio buttons:



Clicking on a radio button sorts the list by its corresponding label. Once again the principal of affordance is violated, in that when a user clicks on a radio button no system response is normally expected other than the option itself being "selected". Typically this choice would then be followed by a "Go" or "Submit" button at the end of the form.

In the case at hand, radio button labels have also been underlined and thus appear as links. The expected system response to clicking on a link is that the user will be taken to a new page. This appears to be an earnest attempt by the designers to alert the user that SOMETHING is going to happen when a button is clicked.

Why is this violation of affordance unsuccessful compared to the previous example of initiating the pop-up calendar from a text box? Because in the previous example there was a net gain of a mouse-click. In the radio button example there is no net gain here, and other more "affordable" alternatives exist. One such example would be to use labeled "pushbuttons" that show a selected and unselected state. When a pushbutton appears to be depressed the list would be sorted by its label. When the user clicks on another pushbutton, the first button springs up and the newly-selected button appears to be selected. One reason Expedia may have avoided this solution is to decrease the use of images which would cause a longer page load time. Perhaps there could be a hybrid solution, using form elements rather than graphics, yet retaining the "selected" and "unselected" appearance.

Another improvement area for Expedia occurs during the otherwise highly-usable "Save as Itinerary" function. This feature allows a user to save previously selected searches, and to recall the results later. Due to the dynamic nature of flight and hotel pricing however, the prices indicated in the saved search results may no longer be valid when accessed at a later date. Expedia does not offer a way of checking current price validity. Instead it uses a link that says simply "Book now to guarantee price and availability." I was too fearful of actually incurring charges that I could not bring myself to further pursue this user path. Better would be for Expedia to use the principal of error prevention and offer the option to "Check whether price is still valid. This will NOT book your flight."

A full analysis of Pandora including suggested improvements can be found here.

   
What tools do you use for creating early stage designs? I believe in using tools that are "just good enough" for early design stages. The presentation of an excessively-high-fidelity prototype in the very early stages of a project will reduce the quality of discussions, and will cause people to focus on fine details rather than underlying structures. So initially I prefer to use whiteboards, Post-It notes, and paper and pencil, then move on to Visio, Illustrator or a tool like Denim, and finally create an HTML clickable prototype.
   
Do you code? Yes.
   
Are you comfortable hand coding HTML? Yes, I hand-coded this HTML page.
   
Which project that you worked on are you most proud of and why?

Although I've worked on more technically complicated projects, the project I'm most proud of is the one I'm currently working on: developing the information architecture and user interface for a searchable online training catalog, sponsored by City of New York, and targeted towards job-seekers. This application's user-base is not web-savvy, yet they possess an overwhelming need for the services provided. Thus every usability improvement I make directly impacts not only their user experience, but also has the potential to, to some small degree, improve their quality of life should employment be obtained. It's beyond theory and I like that.

Another reason I'm proud of this project is that we have taken the time to know the end users, shadowing them, interviewing them, and assembling survey data from all 5 boroughs. Often, in my experience, companies will provide lip service to this necessary initial step, perhaps creating a few personas around a meeting table, but will not take the time to truly understand potential end-users. This current project feels like it is being done correctly.

   
On a scale of 1-10 (1 being "no experience", 10 being "I'm an expert"), rate yourself on the following skills: JavaScript: DHTML: CSS:
JavaScript: 6 Typically I re-use existing JavaScript snippets.
DHTML: 5 I've used DHTML to create floating "stickies" to help guide clients through clickable prototypes
CSS: 7 I used .CSS to create the styles used in this site. In general I use .CSS for things like font-decoration and backgrounds. I cannot yet write a page in 30 lines of code using .CSS.
 
 
 

Roy Zornow MS Word version

IA / UX Designer

email: