7.18.2008

Unclickable "Buttons"

The Site

Last week, I was given the link to a new city guide website: PlanetEye

The homepage looks wonderful. It is easy to navigate, interactive, and eye-catching. Over on the right side of the screen, there are three buttons labeled discover, plan, and share. They are three distinct colors, and even with all the other eye-candy around the screen, I am drawn to click them. But instead of jumping right into those options, I first want to try searching for a city I know well. Regardless, I figure that I might as well take a look at the basic use-case. I hop over to the search area (inviting, and easy to find), type in "Boston," and am immediately taken to a map of Boston. Cool. I am beginning to like this place. But now back to those colored buttons.

Share looks like a good place to start. I am interested in the Web 2.0 features this site has to offer.

A screenshot highlighting those colored buttons

Uh-Oh

click. click. clickclickclickcLickcLicKCLickCLiCKCLICK. CLICK. CLICK.

Nothing. It turns out that those "buttons" aren't buttons at all. They are just informational boxes. This shouldn't be a big deal. It really shouldn't. But it drives me crazy. Why would you make those boxes look like that if I can't click them? Now, all I want to do is look at the Share options. But where do I do that?

Maybe you think I'm making something out of nothing. The problem is that a silly misunderstanding like a button that isn't really a button becomes a barrier to the user. It is annoying. And as ridiculous as it sounds, every time I visit PlanetEye, I want to click those "buttons." Every. Single. Time. When internet users have the same attention span as a caffeinated 5th grader in Chuckie Cheese's, creating a fake door can make them visit a different house.

The Solution

The worst part it? A fix is easy. Looking around the site, I realized what it was that convinced me a wall was a door. Everything clickable on the front page is colorful, with hard, defined edges (pictures, real buttons, etc.). Everything that isn't clickable is contained in soft, grey lines, generally surrounded by white space.

I would simply make white the dominant color of those containers, with blue, green, and brownish being secondary. I might even soften those edges just a tad.

"But it looks good the way it is now," you might say. And you could very well be right. But not by much. The new design would still look nice, fit in with the theme of the page, and not make me angry.

And let's be honest. Keeping me happy is what this is all about.



No comments: