Design

The Death of “Just in Case” Web Design

Ever since the first web browsers were created in the mid 1990’s people have been endlessly debating on how to design a web site. Or more specifically their companies’ site. At first it was left to a small group of people to make the decisions, because it was probably a fad and why spend time there. Once the fad thing became the next big thing everyone wanted in on the gold rush. Opinions were as common as… Well, you know.

To see how far we’ve come, check out Evolution of the Web an interactive site that shows the progression of Internet technology and human adoption and integration in their everyday lives.

Usability science came along, disciplines were created and the work was put into trained hands. The problem lies in the fact that most corporate web sites, especially ones that are C to C and have a significant traffic, must sometimes serve a dozen or more masters. That calls for scorecards, prioritization frameworks and, oh yes, a check back to what the objectives are.

I’ve sat in so many meetings where business partners want to put things in the interface “just in case” a user may be looking for it. They come up with all manner of wild use cases. They are very creative. Bring them back to reality. Search is what we use when we are looking for something. Navigation is for fast access to what you want or need to do during any given visit. Design is for connecting with a customer so they will want to know more.

The new design trend emerging, one of “Point Solution” is I think fantastic. It fills the digital canvas, is responsive to the device that beckons it to life and incorporates a storyscape of the functionality. It seamlessly combines high impact graphics, video, animation and interactive scrolling. When done well one doesn’t know if we are learning or accomplishing a task. And the doing becomes commerce, crossing an invisible line without being detected. It’s bulletproof for solving one or two use cases, but challenged when there are ten to twenty functions available for customers.

The “Just in Case” design is too broad and the “Point Solution” is too narrow. Designers with the help of business partners must find the middle way between the two. Uncovering the dark data hidden in the click stream married with back end analytics is critical. Start with eliminating all of the use cases that are remote, then progressively work your way toward the desired outcome. Oh yeah, you need really, really good designers.

It takes courage to avoid the “Just in Case” design trap and to stave it off you must have hard data showing it’s the right way to go. It’s best to be able to bring a design to life that has absolutely no hierarchy, only a flow of perfectly quilted content.

The poster child for “Point Design” is the Pencil 53 product site from the company Fifty-three. I love the site but loved the product even more. That helps. Their singular objective is to communicate everything about the Pencil 53. What it is, what it does, why it’s better. My review of the Pencil 53 is here.

Apple is great example of incorporating “Point Design” when they want to be bold about a product, then shifting to a more traditional design for product comparison, shopping and support. Sometimes you need to tell the story on a deeper level. For Apple’s 30th anniversary they created a time line of their products and the people behind them. They allowed a user to click on their first Mac and let Apple know what it meant to them. Emotive memories. They have always excelled at closing that last mile between a person and technology.

Microsoft is also getting in the game. They are simultaneously upgrading their product design as well as their sites. Their Surface experience is excellent and they are working hard to put the brand back on track after years of being completely lost.

Samsung has a very difficult design problem to crack. Parts of their site are absolutely on point while others appear archival but are probably effective at selling, so it may not matter. Remember the data. The Apps and Entertainment section is outstanding at showcasing a breadth of products and covers a lot of ground without being overwhelming.

We see people, read their stories, watch their videos and learn how technology works in their lives for convenience, efficiency and peace of mind.

Navigation and the Power of Purity

In the early days of the web we were so excited. Hyper-links were sexy and we would spend the day blanketing our pages with them. Those wonderful blue symbols underlined (also in blue). Spectacular. The job was to find offline content and convert it into HTML and connect it to one of these little blue bugs. Gray was a popular background choice, but mercifully web masters gave in and, for the most part, switched to white. Below is Yahoo’s home page on May 8, 1999.

As time went by content creators became more attuned to writing web copy, not traditional analog copy. This began to differentiate the internet content consuming experience, as writers put importance on the uniqueness of the medium at the forefront.

Copy flourished and with it graphics. Web safe colors limited designers so we saw a primary color palette that brought back grade school art class memories. Eventually browsers began to see more colors and monitors advanced, freeing creative types to polish and refine. Most images were hard edged and PowerPoint like inserts. Not very pleasing.

While designers designed, writers wrote. And of course functionality exploded. Self service, research and commerce grew at a mind boggling pace, completely overwhelming the navigation. Amazon was adding thousands of new products a week. Then lines of businesses. How in the world would one be able to find all this stuff on their site? The answer was of course “The Tab.”

These images are from Amazon’s site in 1999 and 2000. Tab mania infected the world wide web almost overnight. It was the answer we were all looking for and believe me, we jumped on it. This is about the time web site operators began to understand that labeling was one of the most important things they needed to get right. Sites were peppered with corporate tribal language and consumers were confused. Cute names were coined because you couldn’t just call something by its name could you. How pedestrian.

The birth of web Personas and user-centered design helped immensely with navigation and labeling. There were two problems that Personas were great at solving. One was what to call something so a visitor to your site could recognize it, and secondly the density of content to be displayed on a page. It was a challenge to marketing and set up an epic battle between selling and goal accomplishment. Segments tell you how to sell, but Personas tell you how to satisfy. Of course there are many other benefits to using Personas, but these are the two watershed moments in making design better for the user.

Google came on the scene and made search work. I mean really work. The “White Box” began to show up in the upper right hand corner of sites that could organize their unstructured data and catalog content. That was, and remains today very powerful. So much so that on today’s Amazon’s home page not a tab can be found. Search runs across the top of the page and that’s how most people find what they’re looking.

Navigation became nested and included fly-outs, all of which are fine ways to solve for how you make multiple choices available to users without page clutter. But sites are overrun with content and suffer from the weight of an organization’s natural ability to “pile on.” I see this everyday and on so many sites. My advice to you if you control the customer experience on your site is to guard against content creep at all costs. Once something gets on a page it’s very difficult to get it off because high trafficked sites will find that all their links garner clicks. We just don’t know the motivation behind each click.

My favorite property is the property of subtraction. Addition is too easy and is fueled by likes or worse, an org chart. But subtraction. Now that’s an art form. A skill that requires constant honing fed by web analytics, data and real insights. So as you say, “Scalpel please,” many will scream that we can’t get rid of that content or drop that banner. We get x number of clicks from those links. When you look at the number of clicks and put that into the reality of percent of clicks on your entire site, the numbers have quite a few zeros after the decimal point. Not enough to move the stock price, and certainly no one would increase their business goals as a way to justify their existence. Now I will be the first to want to drive business and make money. So bring the data.

I have a theory that I believe would hold true on most if not all often visited web properties. If you take a high trafficked page and put 10 links on it you will get traffic to all 10 links in a given month. If you expand that to 20 links you’ll get the same outcome. All 20 links will be clicked. But this is not a justification for putting 30 or even more links on the page. I posit that if you reduce the number of links (excluding primary navigation elements) you will drive up traffic to the remaining links. Ten links in total will get as many clicks as the 20 in total, so you are distributing the traffic more evenly across the content. Put your business driving content behind those ten links and call it a day (exaggerating for effect).

Which brings me to the point of this post. Aim for purity in design and navigation. If you can do only one thing with something you will most likely get more people to do it and spontaneously return to do it again and again. Take Pinterest as an example. It made it to 11 million registered users and one billion page views a day in about a year. The fastest growth pace to date. Why? In a word purity. It’s all about one thing, images. when you click the main action button you can do one of three things. That’s right 3 things. Not 5, not 7, not 15. Add a pin, upload a pin or create a board.

That’s it! Simple, crystalline, pure. Anyone can pin and it’s a near perfect metaphor with the cork board and scrapbooking. Genius. Behind that simplicity lurks a lot of other things that will drive toward monetization and potentially commerce. The question is can they keep that behind a clean interface. If they can, then success is inevitable.

Keep it pure. As pure as the driven snow.

Working in the New Digital Design Landscape

You can pretty much break the web down into three phases. The first was Read, the second saw the emergence of Distribution & Commerce, with the third being Communication. Phase is not really the right word, dissolves may be better choice. The Internet has taken everything it was from the prior phase and brought it along into the next one, layering on new and exciting technologies and features. People who worked in interactive in the 1990’s through roughly 2003 essentially built one thing, web sites. Those sites evolved and became rich experiences, but despite the speed of those changes, we kept up pretty well because the content was well contained, neatly boxed-in by the browser, mounted on a stationary computer. Laptops certainly travel, but that’s about taking a smaller version of your stationary computer with you, as the browser, keyboard, and hard drive are identical to their desktop counterparts.

Certainly browser resolution, cookies, javascript, flash, etc. needed to be taken into consideration, but that was child’s play compared to what we have to think about today when designing digital experiences. Today content and experiences can be accessed on multiple devices (no standards) and in any situation, especially driving. And it’s not just point and click. It’s much more complicated. For example.

There’s endless discussion about how to prioritize projects and with them the designs and development of content. Designers today need to think harder about their customer and personas and consult the data more than ever before to avoid letting the shiny object get all the attention. Could be the wrong shiny object. I’ve put together this chart, which really helps me when planning work and making decisions about interfaces, devices and communications channels.

One of the most heated debates is whether tablets, like iPads, are desktops or mobile devices. I have drawn them in as overlaps, as I believe they need to be considered as both, at least for now. When I approach a project, I take out this chart and sketch out the entirety of the experience.

Mobile = Shift For Designers and Consumers

Humans have always been obsessed with what they need to “take along” whether it’s going to work or play. The advances of mobile phones and apps has led many of us to shift activities we once did exclusively on a desktop/laptop to our smartphone. This is naturally followed by an increase in the number of places we carry out basic computing tasks; now in the car, at a restaurant, waiting for a flight, watching a child’s sporting event, etc. It’s growing quickly partly because people are relieved of trying to remember what they need to bring with. As long as you have your smartphone (Swiss army knife) you feel better prepared. I have been reading, debating and thinking deeply about mobile these last few months.

I attended two mobile sessions at the recent South by Southwest Interactive track (SxSW) in Austin. The first was entitled The UX of Mobile, with Barbara Ballard of Little Springs Design, Scott Jenson from Google, and Kyle Outlaw of Razorfish. I’ll cover the second panel called Time+Social+Location with Naveen Selvadurai from foursquare, Josh Babetski from MapQuest and Greg Cypes from AIM in a later post.

This post mashes together notes from those panel sessions with what’s been brewing inside my brain and recorded in my Moleskine since last fall. It all runs together which makes it hard on the attribution front. The shape of my thoughts was obviously influenced by what’s out on the web and what was shared at SxSW. Thank you to all mobile thinkers.

In The UX of Mobile, the moderator kicked it off by asking each panelist to define user experience:

Allow users to reach goals
Think about the whole system, SMS
It’s everything that causes a user to not want to use your product; scrolling, buttons, etc.

Mobile today is hyper-focused on apps because the mobile browser is lacking (and because of Apple). When the mobile browser catches up to the app experience, there will be a monumental shift away from apps. The mobile web will be where things will get interesting and play out. But simply trying to put the web onto the phone (miniaturization) is not where the value lies. Mobile screens are a new window into the Internet. It’s the closest thing we have right now to wearable computing and so designs needs to account for mobility as well as personal connection. Design for interoperability, take advantage of mobile cache and leverage the cloud. One should design for the “mobile moment.”

Design knowing that interruptions are inevitable (the waiter comes to take your order)
A phone in your pocket can also be useful (vibrate to signal when you need to turn right or left)
Don’t bring the web to the mobile phone, bring the browser (Safari with iPhone/iPad, Chrome)

Mobile demands that you design for the screen. A smartphone has many more features available to the user than a desktop. Barbara Ballard ticked off a great list of things to be considered when designing for the mobile experience. Notations after → are my additions.

Gestures → Human
Accelerometer → Framing
Bluetooth → Extension
Camera → Pictures
Microphone → Voice
Location → Mapping
Address Book → Social
Calendar → Schedule

The mobile phones of today are closer to traveling ecosystems than operating systems. As such, usability testing for the small screen becomes more critical than browser designs. Designers/developers need to test in context, including social context; in short the real world. For me real world testing will mean getting out of the lab and test in cars, libraries, retail stores, restaurants, sporting venues etc. Internet connections are fairly reliable now; always on and fast. The cell phone carriers are not there yet. It’s better than the 9600 baud days, but not yet comparable to the speed we enjoy with today’s modems. When 4G arrives, we will be a heartbeat away from moving everything the mobile device. That will be a watershed moment.

The iPad is a Roaming Device, Not a Mobile Device

Pick up the April 2010 Wired magazine (I’d include a link but the paper version gets to me before the digital version; go figure) and turn to page 75. There’s an extremely insightful article by Steven Levy, Why the New Generation of Table Computers Changes Everything. In it he talks about how Steve Jobs is “writing the obituary for the computing paradigm” and how desktops will vanish and laptops will be used “primarily as base stations for syncing our iPads.” While at SxSW I spent a lot of time with Ian Magnini, principle at MCD Partners in New York. We work closely on strategy, design and visioncasting. He turned to me and said.

The iPad will replace the magazine rack in your home. There will be one in the kitchen, one in the bathroom and one in the bedroom – Ian Magnani

I think he’s dead on. The iPad has a huge mobile drawback in that it can’t fit in your pocket or purse. So maybe it’s not cell phone mobile, but it could be the perfect “roaming device.” I can picture people using the iPad to read magazines, newspapers, books, then launch the browser to order groceries or do online banking all while sitting in a comfy Barcolounger. Battery life is 10 hours and taps return instantaneous responses. Keypad will be the big challenge.

As always, Jobs will ensure that the design experience will be outstanding. I have heard that there won’t be a calculator on the iPad at launch because he didn’t like the experience. It doesn’t matter. Once it’s right, it will be included in a future version.

Much more to come on Mobile.