Goes to zoomii
In my last post, I asked the question, “Show Me a Good User Interface Design.” I asked the question simply because of the length of time I have been in the software development business, sometimes you get so close to your work that you can’t see the forest for the trees. And I was certainly feeling that way. It is further exacerbated by the more you look at user interface designs the less objective you become – I needed a fresh perspective.
Thankfully, Breton commented on my blog about zoomii and as soon as I saw it, I knew I was back in business. As I commented to Breton, zoomii reminded me of a user interface design I was involved with back in 1994 working for a company that developed banking applications using the Smalltalk programming language (oh, how I miss that programming language and environment, but that is another story). We developed a visual (read: physical) representation of a banker’s desk (by banker’s role) where there were forms and files in desk drawers that could be pulled out, a calculator on the desk, calendar, etc., you get the idea.
What I remember the most about the user interface design was when we rolled it out to the bank employees and had a person sit down in front of the interface, she just started using it with no training! The bank person said, “oh, I get it, it’s just like my desk”, and proceeded to pull out on of the drawers and flip through the file folders and clicked on a form to be filled out. We were initially astonished by this as we had developed a training course to use the software, but the bank personnel did not need any training! It was amazing, pretty soon everyone wanted to try it out and was using it immediately, with no help from us.
Now the paradigm is back and even better. And what is that paradigm? I am sure there is a formal way of saying it that is probably in Jeff Raskin’s book, The Humane Interface, but for me it is dead simple, it is a model of the physical world designed and implemented in software as a zooming user interface.
Chris Thiessen, the one and only developer for zoomii, states on his web site, “…spending afternoons wandering the shelves. Happening across great books I didn't even know existed. But it's an experience I never found online.” It is so true. I used to frequent a computer bookstore in
Calgary Alberta that carried only computer books on its shelves. I would spend 2 to 4 hours on Saturday afternoons just browsing the shelves, picking up books and browsing through them and leaving the stores with a pile of books. Over a few years, I had accumulated over 80 books this way. Unfortunately, the bookstore succumbed to competition by the big box book store chains that moved into Calgary and is no longer. I sure miss it!
But it is back in zoomii! Let’s look at some of the user interface design elements. First of all, if you click on Categories, you get this view:
Note that as you hover the mouse cursor over the left hand categories, the right hand representation of category on the book shelves is highlighted (white in this case). Brilliant! Very quickly, I could easily discern where the Computer book "shelves" were, so when I went back to the shelves, I could easily navigate (pan by holding the left mouse button down and zooming in and out using the mouse wheel) to the computer books and get the view below in a matter of seconds and minimal mouse clicks/movements.
Then I can zoom into a shelf that is sorted by the author’s last name:
Notice the little left and right arrows on either side of the Computers name category. If you click on one of these, you navigate to the next shelf on the left or right.
When you find the book you want, you can click on it and get a detailed description of the book, plus the ability to look at what reviewers of the book had to say about it. Essentially, for the reviews, it takes you to Amazon.com and if you read zoomii's frequently asked questions, Chris tells us that he uses Amazon’s Associates Web Services to interact with Amazon’s data and refers the sales to them and gets a cut using . Brilliant business model.
Chris also states that the way he stocks his shelves is, by the top ranked 25,000 books. He does state that if he used subcategories that if could to 100,000 or more. Chris is considering an optional view that will shelve Amazon’s entire book inventory. I hope he does as I would be very interested in that – more books to browse!
I love the simple navigation of the site:
The basic navigation fits into the classic 7 +- 2 paradigm that our short term memory can handle, a far cry from the +60 clickable items navigation you get with "Office 2007 and the Killer Ribbon".
Clicking on the home button, produces this view:
Creating an account is dead simple, with no confusing user name versus email address. Simple, yet complete – something we truly lack in our software industry.
For the techies, if you right click and view source in your browser, you are presented with a minimalistic file that contains mostly CSS and a bit of JavaScript and the barest of HTML. If you look closely, you can see the JavaScript file Chris uses, and with a little know how, you can download his zoomii.js and pop it open in your favorite code editor to take a gander. It is some 10,000 lines of JavaScript code, but Chris appears to use no 3rd party AJAX frameworks, or Flex or Flash or Silverlight plug-ins, it is all his own work. Truly amazing!
Another feature is the unlimited undo. Clicking on the back button in the browser basically retraces all of the steps (zooms, clicks, everything!) that you performed from the time you entered the site.
The search capability is my only small quibble on the site. It is not as exact as I would like, but it is not Chris’ design, but rather the Amazon web service returning too many books that seemingly don’t match the search criteria. For example, when I type in, “Expert F#”, I get returned 29 matches, when there are only really 2 matches that should have shown up (ideally it should have been one match).
I am sure I am missing other features, and certainly will peruse Chris’ zommi.js more to understand how he put it all together, but for now I am enjoying myself more by simply using the interface then almost any other web based interface I have used or designed on my own.
As someone who develops ecommerce applications at work, I can see this user interface design making shopping at any “brick and mortar” store online a lot of fun and more so, exactly what the general public would want and enjoy, IMO. I can just image browsing through the “shelves” at Bestbuy or Costco or FutureShop or… I could see how it would be applied in a B2B supply chain relationship scenario as well for electronic parts or manufacturing for example. It would seem the applicability is universal.
Kudos to you Chris for designing a top notch user interface that brings the joy back for someone that used to browse computer books for fun many years ago. I am even more impressed that you did this all by yourself!
Which really begs the question for our software development industry, are we all doing it wrong and Chris is doing it right?