Meeting user expectations: interacting with items

Monday, August 13, 2007 at 12:22 PM

Computer users learn all kinds of arbitrary conventions: blue underlined text is a hyperlink, an I-beam over text means you can select it, during an installation just click OK through all the dialogs ;) — whoops, that's not such a good one, but you get my point.

It's no different with gadgets. Most people first encounter Google Desktop gadgets by using the news gadget or some other item-based gadget. They learn the default way of interacting with gadgets from these first encounters. One of my themes when posting here will be how we, as gadget creators, should design our interfaces given a user's default training.

The News Gadget

In this post I'll discuss interacting with items. In the news gadget, a user sees lots of news stories, each of which is a content item. Here are the interactions people come to expect after interacting with the news gadget:
  1. Mousing over an item highlights that item: In the news gadget, the background color changes slightly to indicate which item has focus. (This may not be relevant if your gadget has only one item.)

  2. Single-click to open details view: The details view gives a larger view on an item's information.

  3. Double-click to fully open item (maybe in browser): In the news gadget, double-clicking opens the item in the user's default web browser.

  4. Single-click to close: If the user is looking at an item in the details view, clicking that item again in the gadget closes the item.
Unfortunately, many gadgets in our gallery do not yet meet these expectations. This may seem minor, but people do value consistency: not only is it pleasing, but it also makes the experience much easier and lets people focus on the truly new things a gadget does, rather than the gadget's odd behavior. Read this knowledge base article to learn how to get these behaviors in your gadget.


arivero said...

Hey, the double click also triggers two single clicks in the gadgets API! How is it?

Omar Khan said...

it should trigger 1 single click, and then 1 double click. This should only be a bit annoying if your UI element handles both single and double click
and performs different actions. in this case, you can set a timer to execute the single click action slightly later, which you can cancel if the double click comes in. If your element doesn't do anything special on single click but does on double click, then the single click will do a selection of the item, which is what you want.

As a comparison, in the native windows API a window gets 1 lbuttondown followed by lbuttondblclk, which
happens for the same reason.

hope this helps.