User Centered

I was checking out Fog Creek’s copilot because I was interested in the documentary about the interns that built it (in 10 weeks), and I noticed some good user centered web app design I thought I’d share. I should add that I’m not too surprised to find good design on a Fog Creek app, since Joel Spolsky is someone I regulary read to get ideas from.

So, if you take a look at this text box on the copilot main page, you clearly see the “terms of service” checkbox there at the bottom:

I didn't check the box... and this is how they handled it on the next screen:

I like how they don’t bounce me back when they didn't need to. There’s not even an inkling that I did something wrong. I am, after all, the customer which means I’m legally bound to be always right, infallible and all that. I saw the box as the form was submitting (too late) but was surprised to not get thrown back. Frequently, we are bounced back to the previous page with a large error in red font saying “ERROR!... You screwed up, check the box!” (I’m paraphrasing..but just barely)

Of course, you’d HAVE to go back if you needed to retype something, and this is a simple example (just a name to fill out), but still, I think this was a nice way to keep the flow going, get the information that the website needs, all the while keeping the user happy by giving the illusion of progress (making them feel like they are kickin’ ass). This seems similar to google suggest- it doesn’t say “hey, you can’t spell! Fix it!” instead it takes what you gave it and tries to keep you on task instead of disrupting it.

I totally understand form validation and the need to bounce back to let users fix their crappy input- but this little touch sets apart a great user experience from a good user experience. With that in mind, here’s a couple of screenshots from around town showing different ways of handling this...

Other cool ways of handling the TOS option. I'd lump these next two websites with the copilot way; make it easy for the user:

Yahoo.com makes you accept (agree) to continue..

No other choice with Google.com- accept or go away.


The Bounce Backs- bounce you back to fix your clumsy mistakes. It's an ok way to handle things. Pretty much the norm here, but we get our first strong words: "you must":

Newsgator.com bounces back to...


blogger.com bounces back to...


The "Jarring" Bounce Backs Shields up! Red Alert! This is just an exaggerated form of the previous bounce back. They get your attention, but seem a bit jarring, using bright colors and strong words ("must", "error", "problems", "prohibited") in contrast to the go-with-the-flow of the google/yahoo/copilot examples...

backpackit.com (37signals) bounces back to...

I do fear biting the hand that feeds me; my.opera.com bounces me back to:


...anyway, this is just a sample of sites that were on my mind at the time of writing. I'm sure each designer has his or her reasons for doing it the way they did. From a humble user's perspective, I like feeling like I'm in control of my experience (even when I'm not) instead of feeling like I've done something wrong (even when I did).

For more on Terms of Service, see this article from UIE Brainsparks