caitlin gannon » web design

Lightbox fatigue

Caitlin — Thu, 14 Aug 2008 00:21:21 +0000

Jacob Nielsen just proclaimed the lightbox the “interaction design technique of the year“:

In UI terms, a lightbox draws the user’s attention to a dialog box, error message, or other design element in the middle of the screen by dimming the rest of the screen.

Yes, the lightbox has some benefits. It shows you an Important Message within the context of the page you were just looking at. It doesn’t get blocked by popup killers. And it looks super-cool, especially when used as a slideshow.

But lightboxes are starting to crop up everywhere. In my Yahoo mail (I hope the developer got paid a lot for that), in half the applications I interact with, even in my own website (OK, I put it there, but that was 2 years ago when it was very cool and cutting edge).

Is anyone else starting to suffer from lightbox fatigue?

Hand-drawn UIs for the web

Caitlin — Fri, 27 Jun 2008 21:36:58 +0000

I came across an interesting article on hand-drawn interfaces here. Sometimes a Sharpie and good, strong paper tell the story better — and faster — than a fully fleshed out wireframe. (I must confess that ballpoint sketches on notebook paper don’t pack nearly the same punch.) So hang on to your paper napkin drawings, at least for posterity’s sake.

STC Berkeley writeup on Ajax/Web 2.0

Caitlin — Tue, 11 Dec 2007 02:53:52 +0000

The November/December 2007 of Ragged Left, the newsletter of the STC Berkeley Chapter, is now online.

The issue includes my summary of a talk given by Adaptive Path’s Sarah Nelson and David Verba, entitled “Lessons Learned from Web Applications and User Centered Design“.

In their talk, they defined Ajax and Web 2.0 and then offered insights into how these developments in web application design offer both opportunities and challenges in designing effective user experiences.

Using sliders to filter results

Caitlin — Tue, 06 Nov 2007 23:38:58 +0000

Sliders in web design are becoming as ubiquitous as the fading yellow highlight. They certainly offer a more interesting and sophisticated way of interacting with a lengthy data set (remember the old days: choose from a drop-down, click Submit, wait, look at new page, click Back button, get lost …).

Some sliders allow changes to the top and bottom of a range of values:

Movoto.com

Kayak.com

Other sliders are designed to help the user choose a value (especially useful when it’s a hard value to remember):

Yahoo! UI Library – RBG Slider Control

Some sliders even include sparklines (small data displays), a very data-rich approach:

Prisjakt.nu (via IXDA-Discuss):

Oakland CrimeSpotting

Other than the obvious cool factor, there are definite advantages to using sliders:

instant feedback allows the user to focus on the data itself, rather than on manipulating it
it’s much faster to modify a number of criteria at once (price, bedrooms, bathrooms) while keeping the cursor in one place (compared to a bunch of drop-down lists)
small changes to the chosen ranges display right away, allowing for faster decision making

There’s always a downside:

Sliders aren’t good for small adjustments or for choosing very specific values, because they require too much fine coordination (not everyone uses a mouse, and some of us have a lot of cat hair on the mouse’s infrared sensor, which makes it jump around a lot)
People who aren’t used to seeing sliders may not even notice it’s there, and get frustrated.

Nonetheless, sliders are a very useful design element, so get going and use one! Better yet, use one on every page!