recentlyconsumed.com

Improving CellarTracker’s User Experience

recently consumed

Cellar Tracker Redesign
idea: good design makes for good usability

tasting notes

I found myself getting into an interesting discussion the other day, after posting my plea to make CellarTracker “prettier”:

“The first thing a good interface designer learns is how to use design clues to help guide the user experience. Design can help tell a user what a site is, what’s important, where to go next. It isn’t just pretty for pretty sake.”

I thought it was worth reiterating in another blog posting, because I feel like we’ve come a long way in the world of web design in the past few years. With the launch of Web 2.0 came a need for new sorts of experts in the field. It is no longer purely information architects, designers, and engineers. There are information designers, experience designers, and interaction designers. There are experiential marketers, design thinkers, and experience strategists. As new technologies (AJAX, Flash) make the experience, on one hand, seemingly more holistic to users, but on the other hand, incredibly more complex to build, every person is having to become smarter about how design informs the user experience. And no matter what grumpy purists like Jakob Nielsen say, this has caused major improvement to the overall web experience.

How Web 2.0 Has Improved Design

1. A rich interface allows for a more natural web interaction

Drag and drop utilizes what cognitive psychologists would call an “affordance”, or a clue that communicates to users how to use an object. It’s natural. From the minute the users sees their cursor turn into an open hand, to when their mouse down causes that hand to grip an object, it feels more connected to real world behavior than endless amounts of up and down arrows.

Netflix

Many people are making a case for the physics of the iPhone as being a revolutionary step in incorporating more lifelike gestures into the browsing experience. With other technologies, such as Microsoft Surface, taking the hint and offering similar experiences, the future of physical gestures and computing is truly gaining forward momentum. Web 2.0 AJAX and Flash interaction is moving users in a more intuitive direction, getting them away from the past of “point and click” and pushing them towards the future of touch, pinch, and grab.

2. Design clues can communicate purpose

With Web 2.0 sites launching daily, each offering their new twist on a perceived audience need, the marketplace is and has been overrun and overloaded. The only way to gain traction against the competition is to position your site as a simple, yet powerful idea backed by an intuitive web experience. Design clues can help users understand the flavor of your site and how they are supposed to interact with it. It should give them simple direction and set them of running.

Judy's Book

3. Good design structure can organize and prioritize content

Successful social content sites (Yelp!, Travelocity, Flickr, etc) offer a wealth of valuable content. However, for a user the content is only as good as how it can be used. This is where good design and information architecture really pay off. By bucketing similar content under easy to understand headers, a user can skim the page, allowing them to understand the content landscape “at a glance” and decide what is important. Futhermore, by using color and icons, design can visually prioritize calls to action and common tasks.

Minti

Improving CellarTracker’s User Experience

Since this whole train of thought began with my wish for CellarTracker to take some clues from all those pretty faces in the Wine 2.0 world, I thought I would have a bit of fun and see if I couldn’t put together a slightly improved user experience. My point was not to try and create a gorgeous mock-up that uses AJAX technology and tons of graphics. Not only would that be hard for CellarTracker to implement, but I recognize that really isn’t the desire or need of their audience base. So, with my amateur design skills, I tried my hand at a very minor facelift.

Cellar Tracker RedesignCellar Tracker Redesign
Before / After (click for larger image)

I envision CellarTracker as becoming my portal into the wine web, much like NetVibes is my personal start page for all things web. To do this, the home page for logged in users would need to be more customizable. There should be an ability to turn on and off content. What is important to a wine newbie still learning and exploring is going to be very different than the wine auction aficionado who needs to keep tight tabs on his cellar. The main page should not try and make compromises between these audiences, and instead enable them to craft an experience that is optimized for their needs.

Similarly, I think that sort of philosophy should be applied to sidebar navigation. Certain tasks are more important than others, more frequently used. Right now, all the links carry the same weight and there doesn’t seem to be a logical organization scheme (although there probably is). Visual clues such as icons and more pronounced separation of tasks will empower users to browse more efficiently and more confidently. And as Kathy Sierra can attest, the faster users can get confident about what they are doing, the sooner they can “kick ass” and become passionate about the experience.

suggested pairings



2 Responses to “Improving CellarTracker’s User Experience”

  1. Tom Says:

    You bring up some excellent points here. I feel that nowadays it’s pretty unacceptable for any site to have a poorly designed or ugly interface. CellarTracker would be wise to take some hints from this post and start considering what they might be able to do to take their site to the next level.

  2. Greg Says:

    I agree that I’d love to see some more customisation on the front page of CellarTracker, creating more of a portal page to my ‘wine life’. The mockup facelift (above) is a good compromise, some minor improvements to colour and layout but keeping the site ‘hardcore’ enough for the ‘hardcore’ users. Perhaps an intermediate step is to have a go in Greasemonkey? (I’m not sure how this is done.)

Leave a Reply

You must be logged in to post a comment.

 
consumable goods consumed on
RECENT WINES
    twitter for wine : life


    follow me on twitter