Too Bad Reality Is Not As Easily Adjusted As the Web
I’ve recently paid more attention to things that I try to imitate on the web, but use in every day life. The thing that I find the most irksome and concerning is the lack of visual and/or physical interaction with a lot of buttons. The web, especially of late, has done a great job to emphasize the importance of this for user experience, conversion rate, and just general sense of accomplishment. But the real world, unfortunately, didn’t think that far ahead, or at least it didn’t always think with their users in mind.
Image from http://static.happyplace.com/assets/images/2011/11/4eca796a01161.jpg
Push, Push, Push, What The, Oh Wait, It Is Working
We’ve all had experiences with some sort of electronic device that has buttons on them. Elevators, coffee machines, computers, treadmills, etc. And for the most part, they do a good job of telling the user when they’ve been engaged — either by lighting up or by depressing inward/outward. But, I’ve run into a few examples, seemingly most exercise related, of late where the feedback is just entirely lacking. This is especially annoying when on some sort of moving equipment and you keep pushing a ’button’ but are not sure if it’s working or not, and are not sure if where you are pushing matters or not either. This happens with both physical areas of where buttons are supposed to be, as well as new touch screens which seem to be all the rage. These would be fine, if they followed the same good practices that web and mobile apps do of showing users that you’ve pushed a button, but the ones I’ve seen have missed this critical element: feedback.
Good Job Jefff, You Did It
Humans are simple and petty. We want to feel like we’ve done something, and we’ve done it well. Feedback and a sense of accomplishment is key to a lot of things in life, and even when it’s as simple as blinking or ’faux-depressing’ when a button is being pushed, we need some sort of instant feedback. The beauty of the web, and the ever forward pushing that is being done with it, is this concept has been fully embraced by a good amount of designers and developers. When pushing, er clicking, a button on the web, most often you will see a reverse of the gradient or shadow, or a different color for the background and the text, or the button will just move down the page a little bit. Whatever way it happens (some more successful at replicating real buttons), this provides (albeit minute) feedback to us and makes us feel like something is happening, or about to happen. The same thing happens on smart phones. And since I’m a Mac-fanboy, I’ll use the iPhone as an example. Even when it launched, Apple realized the power of ’showing’ us that when we hang up on a call, the button(s) need to look like and act like real buttons. And since the iPhone (& other smart phone OSs) has opened up to designers and developers, this interaction (for the most part) has only gotten better.
So, This Is Just Some Sort of Rant?
Seemingly so, yes. I had been noodling on this for a while and a recent tweet I saw by @blazepollard jogged my memory and got me to write this up.
Sometimes you don’t really need a “hover” state, it’s that “active” state that really makes the difference.— Blaze Pollard (@blazepollard) May 8, 2012
:hover state is definitely very important, especially for accessibility reasons, it’s the
:active state that really defines the interactivity of a [clickable] element on a web page.
Long Story Short
Attention manufacturers and product designers: take a tip from web designers (who are not perfect, still lots of room to grow for us all of course), visual feedback is key to successfully interacting with and enjoying a product. It seems simple enough of a concept, but often times things like this are overlooked, or taken for granted, in the real world—and this can lead to user confusion, and worse, user frustration.