DabbleDB / User Interface / User Experience | Dafacto

The personal website of Matt Henderson.

DabbleDB / User Interface / User Experience

19 June 2007

A while back, there was quite some chatter about DabbleDB, “a better web database to share, manage and explore your information.” The web application is apparently based on some impressive technology, at least based on a cursory exploration of the demos.

So today a friend of mine created an application at DabbleDB, and shortly thereafter an email arrived in my inbox inviting me to participate. I clicked the link, logged in, and was greeted by the following screen. I was left speechless. Regardless how good the technology is, in my humble opinion, the chances of this (or any product’s) success in the marketplace are severely handicapped by such disregard for the importance and critical roles that user interface and experience play.

Let’s just work our way down, top to bottom, keeping in mind the context: I am a first time visitor, recently invited by somebody to come join something I know nothing about, and this is the first thing I see after logging in:

  • "You are on day 1 of your free trial. Click here to upgrade now." What? I've just been invited by someone to come check out this application. What do you mean "day 1 of my free trail"? Upgrade to what? Do I have to pay to participate?
  • What's the little "House" icon next to "Contact List". Where would that take me? To be safe, I won't click that.
  • The UI would suggest that the "Contact List" context and scope are established with the light blue bar and right-side tab, residing below and to the right. So what would be the search context if I clicked "Search All"? Would I be searching outside the scope of this application?
  • By the same token, are "Applications, User Account, and Logout" within the scope of the "Contact List" application? (or do these refer to the DabbleDB context, in which case they should be outside the visual scope of the Contact application.)
  • Yellow bar, containing "Contact", "More..." (with a little tag icon) and "Import Data". The proximity cornerstone of design would suggest "More..." is related to "Contact", and that "Import Data" is not. Is that the case here? Who knows? I have a notion what "Import Data" might do, but I don't under why it's not somehow visually related to the "Export" icon I see below. I have no idea what might happen if I clicked "Contact" or "More..." (are they even links? One can't tell...)
  • New Entry. A plus sign with a box. Ok, I guess by clicking that, I'd be creating a new entry; most likely a "Contact". Am I allowed to do that?
  • "Let us know what you think!" Let who know what I think? Why is this located here in the middle of the application? Who would I be communicating to -- the application creator, or the Dabble DB people?
  • Box containing "Unsaved View" and other technical looking bits (with a disclosure arrow floating off to the left. Of course. :) So what in the world is an "Unsaved View", one wonders. The DabbleDB folks have anticipated this wonder, and conveniently included a "What is a view?" link for me. Given their anticipation of my confusion, I wonder why they didn't include "What is this disclosure arrow for?", "What is this tag icon for?" and "What the HECK is going on in this site?" links somewhere.
  • I see "Table", "Add Column" and "Export file to the World!" icons. Very technical looking. Are they meant for me? Will I mess up from friend's app by clicking on them? Could I find out by clicking "What is a view?" Who knows! Are we having fun yet?
  • "There are no [tag] Contact entries", so let's move on to the...
  • "Next step..." How about a First step, given I've just arrived here and not taken any yet. And why is this in red, which is universally understood as the "Alert! Houston, we have a problem!" color?
  • "Add entries to the tag contact category" Ah ha! We're getting somewhere. We've now established that the "tag Contact" is actually a category. A category of what!?!?
  • And finally, we're presented with two very prominent boxes, "Add an entry by hand" or "Import data from a spreadsheet or a web site." In the former, my entry (Is it not a "Contact"?) will have one field only, called "Name", and in the latter will create "columns" and "rows" from the imported data.
  • Again, IMHO, this is a textbook case of pretty bad UI design.

Time to click the close-window button. Goodbye DabbleDB.

Update: I realize that DabbleDB is pretty technically amazing. The point of this post isn’t to criticize the technology, but rather to argue that, again IMHO, amazing technology presented in a poor user experience won’t succeed. And I’m talking about usability and experience, not necessarily attractive design. Google’s aesthetic is, as everybody knows, about as minimal and simplistic as one can get, but it’s amazingly useful. (And Google clearly understand the importance of UI/UE; they hired Jeffrey Veen, one of the best around.)

Enjoy this article? — You can find similar content via the category and tag links below.

Questions or comments? — Feel free to email me using the contact form below, or reach out on Twitter.