Good usability is like housecleaning – you only notice if it’s not done. So I’d never thought much about my alarm clock – the same one I’ve had since I was around 13 (that’s well over half my life at this point). But then I came across a discussion of bad design in everyday objects and realized how lucky I was.

If you’re anything like me, you put enormous trust in your alarm clock. “Waking up naturally” and “not being chronically late” are not two ideas that can co-exist in my world. Most of my home electronics are strictly about convenience (microwave, coffee maker) or entertainment (music, television). Even my cell phone, while handy, is not that crucial to my everyday life. But without my alarm clock I’d be – well, I’d probably be home in bed. Which doesn’t sound so bad, actually; but it would certainly have an effect on my professional life. When I travel, I always have some degree of anxiety that I won’t wake up. If I’m in a hotel, I typically set the alarm clock, and also the alarm on my phone, and also request a wake-up call, just in case. How do I love my alarm clock, (and eye other, lesser models with suspicion)? Let me count the ways…

• It has two alarms. I don’t like setting my alarm on the weekends, but I inevitably have to. So I reserve Alarm 2 for weekend wakeups. This way I never really have to worry about if my “work” alarm is still set for the right time, since I rarely change it. The display tells me which alarm is currently on.
• It’s easy to set the alarm. The time setting controls are touch-panel buttons – fast and slow, forward and reverse. “Fast” in either direction moves the setting at the truly fast rate of about 15 minutes per second (actually, less than a second — I’ve done agility training with my fingers and that fast button, and I can’t get down to below 15 minutes per touch). “Slow” is about one minute per second. I don’t have to worry about going over my desired time, because I can always back up.
• It’s easy to NOT set the time. Both the alarms and the time set controls are slide switches. The time-set slide switch is on the side, far away from the alarm-set controls, which are on the front. Since the time setting function only works if the time-set switch is on “time set,” it’s almost impossible to change the time by mistake. If I do need to set the time, it’s just as easy as setting the alarm. Many alarm clocks require you to press two buttons simultaneously to set the time (or the alarm, for that matter). Time setting should not depend on timing, if you know what I mean.
• The snooze button is prominent and nowhere near the “off” button. All I have to do is slap the top of the alarm in my sleep-fogged haze, and I get 7 more minutes of blessed sleep time. I know some people don’t believe in snooze buttons, but I don’t understand those people.
• The snooze button obeys me, for as long as I tell it to. I’ve heard of some snoozes that simply stop working after an hour. I don’t often feel the need (or have the luxury) of snoozing for over an hour, but if it happens, I don’t want my snooze button to get distracted from its job.
• The alarm stays on for an hour. This was less lovely when I used the buzzer setting, but since I’ve discovered that I can actually wake up to the radio, it’s nice to then get ready for my day with the radio on. And if it turns itself off, I know I’m running late. I usually turn it off as I’m headed out the door, but if I forget, it will do it for me.
• I can turn the alarm off without un-setting it. I can also turn the radio on and off throughout the day without disturbing the alarm setting. The controls to do this are two wonderfully simple panel buttons – one says “On.” The other says “Off.”
• The display has two brightness settings. As I’ve gotten older and also developed the habit of keeping my alarm far, far away from the side of my bed, being able to set the display to “bright” has come in handy. The “dim” setting is appropriately dim, and the “bright” setting is appropriately bright.

Sadly, my alarm clock is also incredibly ugly. I didn’t realize just how ugly until I was photographing it for this article. Here it is in all its 20 year old glory:

It’s true that my alarm clock favors function over form. It was made in the 1980s, after all, and has been with me through 3 states and probably 10 residences (I moved around a lot in college). But for all its boxy brown dowdiness, I wouldn’t trade it for another model if you paid me. And I guess that betrays my design bias, too - first, make it usable. I promise, though, that nothing I design will be quite as ugly as my beloved alarm clock.

I’ve been playing around with the MooTools javascript library and just wanted to mention some of my thoughts on it.

What is MooTools?

No, MooTools doesn’t refer to cattle-farming equipment. It’s a lightweight, object-oriented, modular, and cross-browser JavaScript framework that makes Ajax implementation easy and lets you throw in neat visual effects, and that’s just the beginning. You can check out their demos. Why is it called “MooTools” you ask? I have no clue. But coincidentally, the database book holding up my monitor has cows on the cover. Is there some relation between software development and bovines I’m not aware of?

Why MooTools?

Having worked with Prototype and Scriptaculous, I’ll say that MooTools feels quite similar to that venerable combination. Both Prototype and MooTools comes with function that allow for easy DOM manipulation and Ajax calls, but MooTools has got some things going for it that may make it a stronger library, depending on your needs. I’ll list some of those here:

• Lightweight
  The entire MooTools is only 44kb when compressed. Prototype can be compressed down to ~20kb. Scriptaculous is well over 100kb when uncompressed and has only been compressed with varying success.
• Documentation
  MooTools has great documentation with examples. Prototype’s API is decent but Scriptaculous is poorly documented as its wiki isn’t very helpful.
• Robust
  MooTools’ effects are superb and really allow developers to be creative, but I think its strength lies in its robustness. The MooTools development team did a great job making it stable. On more than one occasion, I’ve experienced buggy and choppy effects with Scriptaculous, not so with MooTools. Scriptaculous does seem to have some effects options that MooTools lacks, such as pulsate and shake.

I won’t say which one of these libraries is superior, especially when both are just getting better and better. I will say that if you are looking for a powerful, lightweight, and well documented javascript package, then MooTools is a solid choice.

When you’re knee deep in web technology as I am, you sometimes can’t help but think about how to bring innovation to the work you do. A lot of what the UD team does revolves around donation forms, giving forms, the “ask” string, membership renewals – and a few variations of the same thing. It’s age old problem: connecting with people and encouraging them to take the big step and pull out their wallet for your cause.

So what does the 2.0 of this look like? A lot of client/partners have leveraged things like social networking, widgets, Flash, and even a refrigerator metaphor! Aside from those innovative approaches, I think the basic donation form still has a few more miles on it. I think the best treatment of form design is Luke Wroblewski’s article on Web Application Form Design. Keeping the primary action clear can be quite a challenge on a form as things like premiums, sustained giving options, and other widgets require a user’s interaction. On top of that, throw in the wealth of personal information (and the corresponding labels) you need in order to process the donation, the challenges are numerous.

And these days, there’s a whole array of mobile platforms to design for. Treos, Blackberry, and iPhones, oh my! How can we balance function and minimalism?

Okay, that’s the problem, what are some best practices? Here are some factors I think can contribute to a great donation form:

• Left-aligned field labels - donation forms are more than just name and credit card number. We have a lot of non-standard labels like installment plans, payment levels, opt-in interests, etc. So, the goal here is to maximize scanning between label and widget. Left-aligned labels do that the best.
• You can always scroll – with everybody comfortable with the scroll wheel, having a design go past the fold a bit is ok now. Traditional web design dictated that everything important be above the fold. But with a continuous form, it’s now okay to bend the rule a little.
• Two-column design – this is the best way to get a donor to know the kind of information they need to provide. We like to put the basic information like name, address on the left, and things like the “ask” string and credit card information on the right.
• AJAX submission – I think submitting a form via AJAX makes more sense than doing inline AJAX validation. Often inline validation doesn’t work well for things like credit card numbers. It’s also easier to notice/fix things at a confirm step, such as a mistyped honoree name. Having to repost from the confirm page to make changes is painful. Instead, show the confirm page via AJAX, and give the user the ability to go back easily without having to fill out their form again.
• Dynamic display of elements – this came up on the discussion forums recently. You can display things like sustained giving, honor/memorials, gift membership, and such dynamically on a single form, rather than have separate forms. We really like that idea and are interested to hear what folks things about this approach.

Those are our thoughts. Chime in with your thoughts…we’re eager to hear what you think.