If we look at interfaces in operating systems, we’ll see that there is usually a set of unified interface elements that’s shared not only by the operating system’s own tools, but also by third party programs running on that operating system.
For example, Apple’s OS X had a UI called “Aqua” for quite a few years now that gave the buttons and other interface elements a certain look a feel — a liquid look for the buttons and a more metallic/plastic look for the texture of the windows themselves. They’re now moving towards a more aluminum look that will bring it closer to the look and feel of their hardware products.
Until OS X Leopard, there were actually several ‘branches’ of the UI spread around Aqua. There were the plastic windows, the brushes metal windows and the darker aluminum windows. Buttons looked different in each one of these ’styles’. Leopard, the latest release of OS X, has unified the look across the board.
The interface in OS X looks the same on (almost) every app
Why’s a unified interface important? The main argument is that people learn what each interface element looks like — what a button looks like, what a tab looks like, what a scrollbar looks like, and so on. With a unified interface you only need to learn this element once. If every other tool or third party app on the system then re-uses the same graphics and styles, the user can easily recall the function of that element. It also just looks good to have a consistent style across the board. It’s clear and orderly.
That’s the situation on the desktop OS at least — it’s mostly unified, with a few exceptions. On the web though, it’s a different story. CSS allows us to style interface elements displayed inside a browser — things like form input fields, buttons and navigation menus. Without any styling, these elements take on the look of the operating system the browser is running under — or even that of the custom styles provided by the browser itself.
A lot of web applications style their elements with CSS. A lot of others just leave them as they are. Using the same, un-styled, application then on different computers and on different browsers will give you a different experience. UI elements will look different each time. You might even get different fonts, depending on what fonts you have installed on that particular computer or device.
Using styled applications is another story. The interface remains consistent across different computers (more or less). Each styled application looks different from other styled applications though because the developers create their look themselves from scratch every time. There is no consistency — you have to learn the interface when you begin using the app.
This leads me to the question of the post: should there be a unified set of styles for web interfaces?
Just as Apple has consolidated their shattered OS look and feel in Tiger with their unified interface in Leopard, it’s possible to unify the look of interfaces of the web with CSS. Not just a framework — but a set of carefully crafted and good looking styles for forms, menus and windows that would remain consistent across devices and browsers. Such a stylesheet will give developers a strong foundation on which to design their app, and will provide a consistent experience for all the users of the apps sharing these styles.
Why now and how?
The reason why I bring up this topic is because an adoption of a certain technology is beginning to grow. That technology is CSS3. While CSS3 is still not fully supported by the browsers, all of the modern browsers support some of the common elements of it. These advanced styling properties allow for things like rounded corners, box shadows and text shadows, allowing the designer to create beautiful interface elements without resulting to many images (or indeed, any images).
More important, these advanced properties do away with useless markup bloat which was essential for things like rounded corners. With CSS3 you can style HTML elements without additional markup — just target each element directly and apply the advanced properties.
Here’s an example of two inputs, a text input and a submit input, that I’ve styled earlier. The markup for both elements is pure — no wrapping divs or custom classes — the CSS targets each by type — e.g. input[type=text]. This will look the same in all modern browsers across different operating systems (the font may differ slightly as it falls back to the next available one):
Text field and a submit button styled with CSS3
Text field and a submit button styled with CSS3 Now.. Internet Explorer 6 doesn’t support these kinds of type selectors — or any other advanced CSS3 properties for that matter. Newer Explorers support type selectors but won’t give you the fancy stuff like rounded corners or shadows (although this stuff should degrade gracefully because after all, sharp corners aren’t the end of the world as long as everything else functions properly).
The other modern browsers support enough right now to start styling buttons and other interface elements without additional markup though.
So it’s possible to make a comprehensive CSS that will provide attractive, and more importantly, unified styles to form elements and menubars (which will need minimal markup and classes, specified by the stylesheet) — but is this a good idea? This is a project I’d like to do but I’m wondering whether it’s worth it. I’d love to read your comments.
User Experience is Not Yet Mature, Based on the Lack of Usability Champions
Reading the User Experience Maturity Survey that HFI recently conducted is a lot like reading your 401k statement. Sure, the good news is you have money in there, but the bad news is it’s a lot less than you were hoping for. Likewise, the User Experience Maturity Survey has good news and bad news, most especially about Usability Champions.
Over 1,000 survey responses were received (1,123 to be exact) which is a nice surprise, as I didn’t realize there were so many companies out there with usability practitioners on-board who were willing to share their experiences in usability with the rest of the world. Hurray for us and for usability!
More good news! The majority of survey respondents reported that User Experience (aka UX) fit into their business for:
1 – Building web sites (excellent, usability in websites is very important)
2 – Creating Applications & Software (great, usability helps there too)
Conducting usability work on web sites and applications is like putting a nice warm fuzzy blanket around the web site and giving it the tender loving care it needs to truly be successful out there in the big cold world. Well, not really, but you get the idea.
Half of Us Don’t Have a Usability Champion
But now to the bad news, almost half (48% to be exact) of the survey respondents said their organization does not have a visible, committed Usability Champion supporting user experience design.
Let’s stop right there for a minute. Let’s you and me put down our Blackberrys for a second and focus.
Most of the people who responded to this survey are doing usability work, and they are doing usability work for important things like building websites and creating applications. But barely half have a usability champion! Why, that’s like NASCAR drivers without a Pit Crew! It’s like a horse race without Jockeys! It’s like your wedding without a piece of wedding cake you can mash into your Spouses face (even though you were warned NOT to do that).
Folks, without a usability champion it’s going to be very hard to have a clear and actionable usability practice that operates as one of the core business units for your company! You’ll be stuck doing last second usability testing as an after-thought on almost completed projects that someone is realizing only now is totally screwed up and needs some sort of help, any sort of help, for the life of your career at your company! That’s sad, it’s like having to live in Seattle and constantly be rained on.
Finding a Usability Champion
So, if you are one of those unlucky 48% of usability practitioners that don’t have a usability champion, or you live in Seattle, here’s 3 things you can do about that (um the usability part, for the Seattle part your on your own – just kidding all you Emerald City dwellers, I heart ‘ya and your City, especially the Space Needle, it’s cool):
1. Find a Usability Champion – Most marketing and sales VPs are looking for ways to get their bonus achieve their vision for making their ever increasing web site sales goals. If there was a way you could show them that by improving the usability of their eCommerce web site their sales would increase, then you would have an instant Usability Champion (and probably be invited to some of those cool “Marketing/Sales after work parties”). Try researching “usability roi case studies” on Google, you might come across some helpful ammo with which to approach your Marketing VP.
If you don’t have a sales or marketing VP (really? remind me again how your company sells things and makes money?) then you might have a Product or Product Development VP. Here to, if you can demonstrate that by improving the usability of the product more people will find the product easier to use, and that will help increase use (sales?) of the product, then you might have a new friend.
HINT: The product development VP is probably worried about getting their bonus achieving their vision based on delivering a product on time. You’re going to have to prove to a rather skeptical person that you won’t slow him or her down in getting that product out the door while conducting usability work. I provided some hints on how to do faster usability testing which might come in handy here.
2. Become a Usability Champion – Nature abhors a vacuum (so do I when my wife tells me it’s time to vacuum the stairs!) so here’s a chance for you to step in and fill that usability void. Push hard for usability projects to anyone who’ll listen (at your company, your mom already knows you’re the best usability person in the whole wide world – whatever the heck “usability” is).
If you’re brave, you might actually conduct your own usability evaluation of your web site or product and provide an executive summary to some well placed VPs – just for reading material the next time they have to fly somewhere. Try to make friends with the coders and developers of the web site or application and see if they’ll become “usability friendly” – try taking them to lunch, that might help.
Also, read the post I wrote on the 7 enterprise usability tips for ways you can apply usability projects beyond just a web site, if that avenue is closed to you. There’s lots of potential usability projects lurking at your Company, in many different divisions. Consider IVR messages, customer service web sites or applications or even internal applications that all employees have to use.
The point here is perception is reality, and if all you do is talk about usability and how it helps increase sales or interactions or whatever, eventually people will believe you are the Usability guru and champion.
By the way, it’s important that you are a usability Champion that can actually get usability projects approved. Being a usability champion without the authority to use the company pen to sign a company check to pay for a usability project means you don’t have the authority to make usability projects happen, and thus you’re probably not a usability champion. Some of your co-workers in your office might be calling you just a “usability nut,” the mean ones a “usability chump-ion” (ouch).
3. Leave the Company – Guess what? Sometimes an old, non usability friendly door must close before a new, usability friendly door can open. If the corporate culture is dragging you down, and you’ve tried everything you can (see numbers 1 and 2 above) to get a usability champion at your company, it might be time to leave and find a company that does have a usability champion.
Don’t think of it as failing, being a quitter or throwing in the towel. Think of it as your company is not able to incorporate usability as a part of it’s core function, and thus you must find a better environment where you can make a difference practicing usability. Those losers.
According to USNews & World Report, you, yes you, as a usability experience specialist are in one of the Best Careers of 2009. If your current lame unresponsive dimwitted ignorant company doesn’t truly value and support usability, more than likely there’s another company out there who will.
So dust off your resume, dry-clean your interview suit, shine up those shoes and hit the pavement you usability experience specialist you! You’ve got a whole new exciting opportunity just WAITING for you to get started! What are you waiting for? There’s a better opportunity for you and all you have to do is take that first step!
Conclusion – User Experience is Not Mature, Especially without a Usability Champion
According the results of HFI’s recent “Usability Experience Maturity Survey 2009” almost half of those of us who completed the survey are without a usability champion. Without a usability champion at your company it’s going to be very difficult to achieve usability maturity, and include usability as a core attribute of your company’s operations.
If you’re not comfortable trying to accomplish usability without a usability champion, you can either find one in your organization, become one, or worst case leave the organization and join one that does have a usability champion.
If we look at interfaces in operating systems, we’ll see that there is usually a set of unified interface elements that’s shared not only by the operating system’s own tools, but also by third party programs running on that operating system. 
The interface in OS X looks the same on (almost) every app
Text field and a submit button styled with CSS3
