Here at eVOC, we spend the majority of our time focusing on online usability; whether it’s websites, products, or mobile apps, we consider ourselves experts in the customer experience online. And we’re really proud of that!

But when this passion of ours starts to seep into the world outside the Web, we officially morph from experts into…

USABILI-DWEEBS

It’s ironic that we can be considered dweeby as soon as we extend our craft away from the computer. After all, when you think of a dweeb, don’t you think of this guy, always at the computer? But the Internet has become such an integral part of doing business and getting things done, that our dweeby computer and web knowledge is now actually considered an advantage rather than an object of ridicule. And that’s OK with us – especially since “experts” sounds more professional than “dweebs.”

From “dweeb” to “expert”…who’s laughing now?

A few times a month, as your resident Usabili-Dweeb, I’ll give an example of a real-world usability problem that I’ve encountered outside the job. In each case, someone will be failing to adhere to basic design principles that apply to the real world in the same way that they apply to the Web. I hope these examples help steer you towards best practices that can be applied to your websites.

In this edition…

Week 1: Going Up?

Our office is on the 16th floor of a historic building in downtown San Francisco. Recently, they updated all of the lighting in the lobby, which included the fixtures next to and above the 8 elevator doors.

Before: Indicator light was mounted to the right of each elevator on one side, and to the left on the other Upper half turned white when it was going up Lower half turned red when it was going down One cause for confusion Did each light refer to the elevator on the left or the right? (Severity: Moderate)

After: Indicator light is mounted above each elevator Entire light turns white when it’s going up Entire light turns red when it’s going down Bright wall lights hang between each elevator (also white) 4 causes for confusion New elevator lights are very dim in comparison to wall lights and are hard to see (Severity: High) Dinging noise of arriving elevator is now quieter, making it more difficult to know which one to walk towards (Severity: High) All wall-mounted lights are the same color (white), causing a delay in figuring out which one is lit (Severity: High) For those new to the building, it is unclear whether the white indicator light signifies a direction, or just that the elevator is open (Severity: Low)

Bring in the Usabili-Dweebs

The changes they’ve made have really bothered us Usabili-Dweebs, so much so that we have mentioned it to the folks at the front desk (they hate us). We told them that the new design violates usability principles in the following 3 categories (shameless plug: these are some of the metrics upon which we evaluate websites when we do heuristic expert reviews).

1. Aesthetic Integrity
          Is there a clear visual hierarchy with graphic elements and visual cues to help users?
          – Nope.

2. Feedback
          Does the design keep users informed and indicate task progression?
          – Not very well.

3. Communication & Relevance
          Can users rely on recognition rather than recall?
          – Definitely not.

So how does this apply to a website?

Let’s run through the above 3 usability principles again.

Let’s start with aesthetic integrity: Just as it’s crucial for people to quickly access their desired floor in a building, you want to make sure that users click on a link, view a promotion, find information, or purchase something on your website. It is imperative that the visual cues are clear so that your site visitors are not lost or delayed. Because, unlike in the office building, they might get so frustrated they actually leave.

Feedback: People must be well informed of what happens during a process. A good example of this is online checkout: users want to know what step they’re on, how far they’ve come, and how far they have to go. Feedback also helps orient them on the site. When I’m standing in the lobby and I don’t know how long I have to wait or where I need to go, I get frustrated.

And communication: Any site has to be learned to some extent. But if users have to remember where things are, even after coming to the site time and time again, the site is not intuitive enough. Similarly, when I walk into my building and push the elevator button, I can’t easily recognize where the arriving elevator is, and it takes me a few seconds to figure it out every time.

In closing

Many of the guidelines we use to evaluate websites apply very well to real-world examples. Perhaps this isn’t such a surprise. After all, the online realm was created to mimic, simplify, and enhance our real-world experiences. So it’s only natural that we can apply so many of our web-based design and usability principles to our own lives.

In the coming weeks, look for more real-world examples of common usability problems – from me, the Usabili-Dweeb! And if you happen to run into any dweebs out there, please do not take my lunch money.

Faster, Better, Cheaper. This has been the mantra of the Internet since the late 1990s to save us time and money by shopping online versus in-store. And for over a decade, this mantra has held true. Consumers are hooked on online shopping. Despite the economic downturn in 2008, and leading into 2009, sales among the Top 500 online retailers continued to grow - increasing 11.7% - while total in-store retail sales only grew 1.4% according to Internet Retailer. In addition, among 41 of the 50 biggest retail chains, e-commerce revenue increased, while in-store revenue declined.

While online retailers are not immune to the economic downturn, they are somewhat protected compared to their brick-and-mortar counterparts. The costs to maintain a Website are significantly lower than the costs to manage, stock, and staff a retail store. As a result, some retailers have not weathered the storm, most notably Circuit City who declared bankruptcy last year. However, savvy online retailers continue to survive.

Amazon.com reigns as the leading online retailer, showing a 30% increase in Web sales last year to $19.2 billion. Amazon is king because it continues to expand and add new retail categories year over year. Amazon also has the benefit of carrying and cross-selling multiple products and multiple brands. Amazon is the one-stop-shop e-tailer for you name it: books, clothing, electronics, sporting equipment, garden supplies, etc. Amazon represents products and brands in over 75 retail categories and is continuing to expand with its recent acquisition of Zappos.

Other brick-and-mortar retailers have been working every angle to increase Web sales through Internet exclusives, daily deals, 2-for-1 promotions, free shipping, and loyalty programs. While these perks may offer some short-term gains, they do not guarantee long-term stability. The retail leaders that will withstand the test of time are those that are thinking Faster, Better, Cheaper for a new generation.

Amazon is obviously on to something = one-stop-shopping. Are brick-and-mortar retailers up to the challenge? Who will survive in this marketplace and still deliver a Faster, Better, Cheaper Web experience for the next generation?

Gap Inc. has taken on this challenge. Internet shoppers are tired of multiple usernames, multiple passwords, multiple emails, and now multiple credit cards to avoid spam and identify theft when shopping online. Gap has responded to this pain and consolidated its Web presence across its 5 major brands, including Gap, Old Navy, BananaRepublic, Piperlime, and Atletica under one umbrella site, Gap.com. This consolidated Website not only allows users to browse all Gap Inc. brands within one single user session, but also leverages one global shopping cart for all brands. This offers a significant improvement for the customer experience by eliminating the need for multiple usernames and passwords, with one universal login, and offers a seemless checkout process with one flat shipping rate.

In addition, this consolidation offers a significant opportunity for Gap Inc. to diversify its audience and cross-sell brands to all visitors, for example introducing Old Navy to Banana Republic shoppers and vice versa. Moreover, the company can leverage cross-promotion of deals across brands, benefiting from larger transaction sizes, such as offering free shipping for all brands if a Piperlime product is added to the shopping cart.

With Gap Inc.’s e-commerce revenue increasing 15% in the first half of ‘09 to $491 million from $427 million in ‘08, while offline sales declined, Gap understands the power of online. Gap’s brick-and-mortar counterparts can benefit from this lesson on Website consolidation. Williams-Sonoma’s e-commerce revenue decreased by 21.9% in the first half of ‘09, from $507 million in ‘08 to $404 million in ‘09. Opportunity exists for Williams-Sonoma’s brands including Williams-Sonoma, PotteryBarn, PotteryBarn Kids, PB teens, and Williams-Sonoma Home, to follow Gap Inc.’s lead.

So Gap Inc. is on to something = consolidated-shopping (aka one-stop-shopping). This evolution may not become the new mantra for the Internet, but it will be the foundation for delivering a Faster, Better, Cheaper Web experience for both consumers and businesses alike in the next generation.

Contact us with questions!