The very way that we present content on the web is being reshaped by tablets and ye olde linear newsprint that they seek to mimic.  Just look at how Safari’s new Reader feature “removes annoying ads and other visual distractions” (ie. all the things the web’s good at, the very things publishers have placed on their page deliberately), paring articles down to their intrinsic text core. It’s like printing off the web as a PDF.

Laptop vs. Desktop:

• Screen sizes of 1280 by 800, 1440 by 900, and 1366 by 768 are indications the end user is most likely using a laptop.
• The 1200 by 800 is very popular among MacBooks, and the Sony laptop I’m on right now is 1366 by 768.

And something you probably haven’t thought of: laptops have outsold desktops for years.

For some sites, the majority of users may be using a laptop.

Forget screen resolutions for laying out the page, think about the indications of device type. Over 34 percent of my blog’s audience is the middle of target laptop screen resolutions. A few other sites I work with have percentages that fall in the 40 to 45 percent range. These percentages alone may be a more important number than browser audience. Seriously, who cares about the box model and CSS issues, when the user can’t figure out how to use the scroll bar?

The Bottom Line
Figure out who your audience is. A website that is aimed at developers (a desktop audience) should be designed differently than a website aimed at sales people (a laptop audience). Consider who they are, and what their environment is. For example consumers are now mostly laptop users and expert users at work use desktops, you want to design for whichever of these two fits your audience.

A lot of laptops are on old technology.

A friend of mine has this laptop that’s four years old.

That might not seem that long, but…

(pause)

(pause)

(pause)

It takes ten minutes to boot-up.

Watching that laptop trying to crank through a Flash movie or a website that’s shipping 800k down the pipe for the homepage is a painful experience. There are millions of laptops and underpowered netbooks out there in the real world, many of them held by consumers that don’t want to migrate their files to a new computer, even if they can afford it.

So they stick with their old, trusty laptop until it dies.

Some of the web analysis reports I’ve seen have shown that 75 percent of the user base is still using Windows XP, which was discontinued two years ago.

That alone shows two points:

• There are a lot of people unwilling to upgrade.
• There are a lot of people on slow computers.

The Bottom Line
Bells and whistles might not be a good thing, when considering your audience. A website that works on a web designer’s souped up MacBook Pro might not be working on an end user’s laptop with 1GB of RAM.

Using a laptop means a different user experience.

That doesn’t mean that they are always using the laptop screen, but what it does mean is they are definately using the laptop as a web surfing device. This dramatically changes their user experience. Instead of sitting up in their chair, they are looking down at their laptop, typing and using a trackpad.

I had a long conversation with a game developer about the iPad, how people use it as a window because they are looking down. Laptops are much the same way. They have to be judged within their environment, whether it is a Starbucks, an airport, or a cubicle when the user is on the run.

Home users might be watching a television show or chatting with friends on Skype, but whatever they are doing, they could be performing multiple actions in an environment that’s not sitting at a desk. Four to seven different application windows may be open, and the browser window will not be expanded.

The margin of 700 pixels becomes 600 pixels. That email you are sending for marketing purposes might only be 300 pixels wide by 600 pixels high.

Another consideration: many popup windows and dialog boxes are designed to be 700 pixels high, which are unusable on netbooks that are 1024 pixels wide by 600 pixels high.

The Bottom Line
Designing for the top left corner of a page is more important than ever before. We might have to rethink always having that branding logo there.

Certain actions are difficult on a laptop.

Get on a laptop. Then try using it without a mouse.

Certain actions are assumed to work, like using the arrow keys to scroll through a web page. This is because browser designers have built their applications to work this way. But, there are other actions that are difficult at best and impossible at worst, most of them require holding a button on a mouse — re-size a window, scroll through an editing text area, and perform a multi-select action. These actions require two hands: using the trackpad to scroll while pressing the left trackpad button. Some laptops are missing things. A lot of laptops don’t have page up, page down keys, so the users have to use two keys to scroll down.

In fact, a study performed in 2002 found that not only was scrolling 23 percent faster using a mouse versus a trackpad, the error rate for hitting the target was three times higher with the trackpad.

Trackpads change user behavior. Many laptop users, like myself, are experts at hotkeys — so much so that when I’m using a laptop, I use the keyboard more than the mouse. Actions, such as tabbing through a web form, have to work well or it’s useless. Like most gestural interfaces, if you are depending on mouseovers to indicate status, laptop users are going to be missing out on a lot of feedback, because they are trying to perform an action as quickly as possible.

The Bottom Line
Ironically, many of the same concepts around Section 508 compliance also work well for designing for laptop users. Design it so it’s closer to a keyboard-driven application versus mouse-driven application.

Consider Fitts’ law when designing for interactions.

The size of the target, when using a trackpad, makes navigation on certain sites and, more importantly, performing precise actions, hard. To drag-and-drop in a precise manner is impossible using a trackpad. Try navigating Photoshop using one. I guarantee you’ll be be tearing your hair out in five minutes.

Scroll twice, and hit a target the size of a postage stamp to sign in for personalization — that’s the challenge on CNN.com.

Targets have to be sizable, and dragging the pointer long distances is worse using a trackpad than a mouse. For example, when using a trackpad to go from one end of my screen to another, I have to scroll two separate times from the top left to bottom right corner of my screen. The same works for any direction on the screen for my laptop.

The Bottom Line
Consider distance to take an action and what that action is (for example, a social sign in, which drives a lot of traffic), when designing the page.

I had to have one.

Sure, it’s over priced (well, not compared to the Kindle).

Sure, it looks like a toy.

But I’m telling you, Apple and the developers that are building applications for this device are going to change the world in a way that we can’t even dream of. I can’t even dream of all the possibilities, and I do software design for a living.

Here are my thoughts.

What the iPad is great at

Surfing the Web

Flash aside, if you want something to read web pages, the iPad is wonderful. Pages load fast, clean, and re-size to the direction you reading. The display is crisp and clear and totally makes users rethink the limitations of resolution. As much as Adobe likes to tell everyone how much content is Flash-based, I didn’t miss Flash at all.

A lot of sites now have HTML5 videos (YouTube, for one), and once site owners see how many of their users are using iPads to access their content, Flash will become less and less the only game in town.

Watching videos and listening to music

The iPod is a great portable device, but if you spend a lot of time on planes, buses or any other mode of transport where you can access the Web, this is a wonderful time waster. Netflix and MLB.tv play at such a high quality, you forget that you’re watching it over WiFi.

I bought it pretty much for time spent on airplanes. In about one week, I’m going to find a new home for my netbook, because my iPad is replacing it.

Frankly, this is the device I would have bought first before the iPod, because it’s the perfect home entertainment device. Some enterprising young engineer, or company, is going to figure out how to make this the hub of your home entertainment system, and that person will make obscene amounts of money.

Reading anything in “print.”

The NYTimes application is similar to the application they built for Silverlight with Microsoft a few years ago. Depending on the direction you’re reading the article, the page repaginates in the new direction. “Print” publishers should look at this as a completely new channel that’s not only going to extend the life of their content, but allow them to do interesting new things with that content, like include multimedia — something they would have never thought of with a strictly paper product.

I’ll make this prediction: this is the device print publishing companies so desperately needed for a subscription/advertising model, and yet they’re going to miss the opportunity because they’re more focused on losing classified ad share to Craigslist.

What it’s not so great at

Actual work

Sure, it’s a great device to take to meetings and conferences. You can take notes without a lot of effort, and the battery life fits in perfectly with an all-day conference. But it definitely lacks many things, like a mouse. The inability to make precise movements, needed for applications like Omnigraffle and Adobe Photoshop, make this a poor device for repetitive tasks required by most jobs. However, this is a great second device to take if you have a primary device like a laptop. Leave the computer at home, and show the broad strokes at meetings.

Think shiny demos, not boring presentations. For some sales professionals, this will replace the projector.

Replying to emails or any other action that requires a lot of typing

This isn’t necessarily a bad thing.

Many iPhone users that were frequent texters developed carpal tunnel symptoms using Blackberry’s and other smart phones, mainly because the phones were keyboard-driven devices. Once the users moved over to the iPhone, the limited feedback of the “keyboard” forced users to be more economical with their typing because it took much longer. Their symptoms disappeared. The same should happen with the iPad; users will adapt and type less because the device wasn’t designed for that.

How the iPad is going to change the Web

A lot of interactions that work best with a mouse and/or keyboard are pointless in a gestural environment

Mouseovers?

Gone.

Interfaces that require a lot of typing.

Gone.

Interfaces that utilize drag and drop (think Microsoft Surface) become wonderful ways of navigating sites using the iPad, much more so than point and click methods. How many sites really use drag and drop geared toward mouses? Many applications will have to be re-thought in a way that’s going to be a harder transition than moving from command line to point and click.

Cutting out all necessary steps to sign in and personalize content will be important

A lot of websites still have long registration processes that require several steps and lots of keystrokes to maximize site content. Services like Facebook Connect, Messenger Connect, Twitter login or another other social way of registration without full registration will be very important in significant user adoption by iPad users.

If I were running a social site (Hey, MySpace, you listening?), I would figure out a way of designing an interface optimized for the iPad. That includes drag and drop, gestural interfaces that allow users to be creative in a space that’s totally different than the web. Sure, it’s a lot of work, but this is the Wild Wild West! The first website to do this is going to make a huge splash.

Saving content locally will become necessary for iPad users

I’m not the lucky few that owns an iPad that has 3G (read: Ambrose Little), and I couldn’t stomach the thought of yet another Internet service on my already expensive AT&T bill. Applications that download and cache content is something myself and millions of iPad users will be very interested in.

Applications that store a lot of content locally so users can read offline will be all the rage as the iTunes store carries more and more applications. Follow the lead of the NYTimes, for instance.

Over the weekend we had a chance to highlight Graphic.ly – a company that opted to release early (and imperfectly) in exchange for valuable user feedback. As companies look to their peers and audiences to help define product features, there’s a greater need for scalable testing platforms. Here’s a summary of 8 useful services that will help put you on the path to product greatness.

Read on…

The joke was, “so how do you increase conversion?”

“Red Buttons.”

I’m sure Red Buttons the comedian didn’t know he was going to be the punchline for a user experience jokes. “I’m here on Tuesdays, tip your waitress, next up They Might Be Giants…”

But…

That’s not always the case, as stated in this great tool that’s been around for a year, Which Test Won.

Which Test Won is a great little site that does what we all want: publish the results of A/B tests for ideas of better site conversion.

In the red button/grey button test, Verizon tried two versions of a home page, one with red buttons everywhere, and one with a single red button. The main call to action was a gray button.

Can you guess which one won? Go to the site to see.

This is such an inexact science, because anyone can figure out your email address. We receive so much spam and other garbage through email accounts (is a shopping site really my friend?) and there are conversations you want private. Those connections are now public by default, as Gizmodo points out:

• A girl you slept with in college sends you a message on Gchat, to tell you she has five beautiful children now, and she doesn’t ever think about you, ever. Ok!
• You exchange some messages and a couple of emails to be polite. You defuse the situation. You don’t mention it to your current girlfriend, because that would be weird.
• Coincidentally, you enable Google Buzz, which adds both your current girlfriend and this lady who you politely deflected.
• Your girlfriend checks out your Google profile, sees your friends list and asks you who that lady is.
• You clumsily try to explain, “Oh, it just adds people you talk to automatically,” which only makes things worse.
• Fight!
• You break up, which was probably a good thing anyway, because your relationship sounded really unhealthy. But you get the point, right?

The situation is so bad, some sites, like Lifehacker, are showing ways to turn off the contact list. Think about it, do you want every telemarketer to be your friend? Facebook has one important filter: you can deny friend requests.

It’s never, ever a good idea to create a social graph the way Google did. That’s why most of the IM clients do the double opt-in approach. The follower model is killing Twitter.

Google Buzz reinforces the power law online, which means you’ll get to see 100 photos of Jason Calacanis’s dog or promoting how he pays more than some services, but less than About.com for content

The people you want to talk to automatically become long-tail, yet the people who are endlessly self promoting always bubble to the top because they have 11,000 followers. Someone’s always going to make a comment.

Social Customer points out Buzz does two things that will simply make it unusable.

1. It shows threaded conversations and strongly highlights the initiator of those conversations and makes the comments subservient to the initial post.
2. It takes posts that have “new” comments and immediately bumps those posts to the topmost position of the viewing window.

This interface will greatly reinforce the existing power law relationships online and have the effect of greatly reducing the serendipity and interest in things like the current Twitter and Facebook interfaces.

Not that many people use Gmail and most who do are the digerati.

From twittercism:

This is also the first time I’ve noticed how few of my friends actually use Gmail. I love Gmail and recommend it to everybody, but people are often quite set in their ways and prefer to stay with Hotmail or Yahoo, irrespective of the lack of features. Looking at my address book, I’m guessing probably less than 20% of my friends have a Gmail address or even a Google account, for that matter.

Yeah, it’s mad, but it also means Buzz is already limiting my network.

Social networking is an all or nothing game; and if you only have 20 percent of your friends, do you really think the other 50 percent or so are going to create a Gmail account to see Google Buzz?

I think not.

What’s the take away? Not ready for primetime.

I agree with twittercism:

My gut feeling? Unless they make some major changes and improvements to Buzz soon, and that includes addressing those privacy issues, it’s never going to be a threat to Twitter or Facebook. It’s just another aggregator, and a bad one at that.

Everyone sees Facebook as the center of their social graph. They also see Google as the place that wants your information, which is why people won’t trust them with their social graph.

What do you think?

“Use red asterisks — they’re the standard for showing required fields.”

Standards are wonderful; but if I asked my mom what is the international symbol for a required field, she would look at me like I was on drugs (not much different than today, but still).

This was something even the great Jared Spool mentioned as gospel at an event and showed an example in his PowerPoint, which I still haven’t received – but that’s another blog post. He was explaining how another client had used asterisks to show optional fields.

Here’s a few truths about form design that I’ve discovered in my time by testing actual users.

Most forms are hard to read.

Does anyone find it interesting the note for required fields is after the fields?

There have been a few books and web posts, but for the most part, web form design hasn’t changed that much since 1996. Form fields are left on a white background with a grey line around them. Some sites, like this WordPress blog software I’m using, have a lighter grey line around the form fields for design purposes.

On other sites, form fields are in columns so that they’re next to each other, making the user to really have to work at it.

Given eight form fields, users will fill out all eight.

I’ve run countless of tests and the result in most of them is that users will try to fill out every single form field. This includes the second address field we all know so well even if they don’t have a second address.

Form fields are one of those things that users expect to fill out every single field, because they don’t want to have to figure out error messages when they are wrong. They have been trained that most web forms are ineffective, they do as much work as possible (bad solution number 1) or walk away (worse solution number 2), leaving either a frustrated user, a lost sale or both.

The red asterisk and even the explanation text that reads “Required Fields” are marked as (*). No one’s going to read it.

It’s usually at the top of the form, in line, and all users skip it to dig right in. Users rarely read instruction text, and because most form design is so poorly thought out, users rush through it to make it as painless as possible. Users need visual cues next to the field or at the field they are working on, not 300 pixels, at least, away.

Additionally, the “Required Field” line is usually small and hard to read (read: Designers License), so in the grand scheme of watching users browse the site, they skip right over it.

Solutions to the required field paradox

Disney Shopping

This was a solution we used at Disney Shopping: the word Optional was placed to the right of the field and required fields were colored yellow so users could spot them.

I’m using this particular design pattern on other sites, because at Disney Shopping and a few other sites I’ve worked on, this is the design pattern I’ve enforced. It’s doesn’t interfere with the form because the error messages are usually below the form field, and it’s easy to scan for it.

Why am I enforcing it?

Because, changing Required Fields from the asterisk to this example increases form completions across the board. We’ve tested it, and it works.

Any questions?

Enter Attention Wizard. Attention Wizard is a tool that shows possible eye tracking without the human part. The smart folks over at Site Tuners (Thanks Tim, for the invite) have written an algorithm that produces an “attention heatmap”, a way of saying here’s some possible areas that the users are paying attention to based on color and Gestalt theory. All you have to do is upload a screen shot, and in five minutes, it gives you results of what it could look like.

I did it with Online Marketing Summit (click on the thumbnail) to show you what one of their results are.

Their sales points

• Can be used with actual screenshots or page design mock-ups
• Instant results – no eye-movement or mouse-tracking data collection needed
• Tells you what people are paying attention to, and what they ignore
• Easily identify landing page problems & increase your conversion rates

Our take aways

• People’s eyes go right to the schedule tab, which is a good thing.
• We have this photo image in the first paragraph of text that does nothing. It’s providing no value to the user while attracting a lot of attention.
• The testimonials are getting a lot of attention.
• I think Attention Wizard is giving too much weight to the photo.
• Overall, the eye is scanning the page well.

We’re going to make more changes, but the goal is to get results quickly and increase conversion rate on the site, and that’s what we got with Attention Wizard.

My honest opinion about Attention Wizard?

I wouldn’t take this as gospel science (is eye tracking that now, anyways?), but it’s a good first cut at “well, let’s see what we have.” They claim a 75 percent rate of matching eye and mouse tracking, and that’s good enough for me. It’s much better to do several tests with this tool (which would be great as a subscription model site) than spending $5,000 for an eye tracking system that no one’s going use because, well, it’s hard to use.

It’s a great tool that’s only going to get better once they work out the kinks.

Smashing Magazine conducted a detailed survey of 50 popular websites to see answer questions like Serif or sans-serif? Large or small font? Light or dark background? and more.

Though the findings aren’t scientific, the study shows a clear set of common practices and guidelines for setting type in Web design. Granted, these points should serve only as rough guidelines (not hard and fast rules):

1. Either serif or sans-serif fonts are fine for body copy and headings, but sans-serif fonts are still more popular for both.
2. Common choices for headlines are Georgia, Arial and Helvetica.
3. Common choices for body copy are Georgia, Arial, Verdana and Lucida Grande.
4. The most popular font size for headings is a range between 18 and 29 pixels.
5. The most popular font size for body copy is a range between 12 and 14 pixels.
6. Header font size ÷ Body copy font size = 1.96.
7. Line height (pixels) ÷ body copy font size (pixels) = 1.48.
8. Line length (pixels) ÷ line height (pixels) = 27.8.
9. Space between paragraphs (pixels) ÷ line height (pixels) = 0.754.
10. The optimal number of characters per line is between 55 and 75, but between 75 and 85 characters per line is more popular,
11. Body text is left-aligned, image replacement is rarely used and links are either underlined or highlighted with bold or color.

Of course, every website is unique, and few people want their sites to look like everyone else’s sites. But it’s always great to keep in mind that following these guidelines could make your website feel more familiar to your readers. (If you are a data and spreadsheet nerd like I am, check out the spreadsheet of the study and export its data for further analysis.)

Make it Easy to Scan

People don’t want to wade through what appears to be a short novel. If the mere site of your written piece overwhelms the reader, you can bet he or she will quickly move on to something else.

• Recommendation: Put your headings and subheads in bold type, use bullet points, left justify your text (don’t center everything) and break things down into short, easy-to-manage paragraphs.

Avoid Giving Readers a Headache

Have you noticed that an increasing number of websites are composed of tiny little white letters set against a black background? Ugh! Instant eyestrain.

• Recommendation: For maximum readability of any written piece (not just websites) stick with dark type on a light background, and don’t use anything smaller than a 10-point font.

Think about Your Font Formats

Sometimes it works to use special formatting to call attention to particular words, but if you’re not careful you’ll end up making those important words difficult to read.

• Recommendation: Go easy on your use of ALL CAPS, italics, underlines, Initial Caps, and other special formats. These all work well on headlines and brief items, but should generally be avoided on longer passages.

Remember, if your letter, website, brochure, or other written piece isn’t formatted for maximum readability, there’s a good chance it won’t get read at all.

What a wonderful little diagram.

Launched this weekend was the mobile version of UsabilityCounts.com. The home page viewable at mobile.usabilitycounts.com, and i’m working on enabling the whole site at that URL. Most mobile devices should automatically detected and show the right version.

Twitter users that view the site on the iPhone, cheers, and enjoy.

Here’s what I did:

A unique design depending on the device

You can use CSS to handle a different display, but you should do it using server-side technologies, because the whole point of a mobile device is to deliver an experience that has less graphics but is still functional. Delivering a site that is 200k on a limited device with lower than DSL bandwidth doesn’t make sense. To do this, I’ve been slowing ripping apart the TypoXP theme of WordPress for purposes of simplication (most WordPress blogs are overcomplicated in their usage of CSS).

When the site loads, it does an initial detection of the User Agent: Blackberry, Android, iPhone and iPod are the currently supported devices, and you can see a  list at Wikipedia. The pages load different content for mobile devices — the web version is heavier, where as the mobile version contains just HTML and a couple of backgrounds and icons for navigation only. WordPress has a set of function calls that makes it easy to show different content depending on how you want it triggered.

I also added the following HTML tag:

<meta name=”viewport” content=”width=480; initial-scale=0.63; maximum-scale=1; user-scalable=0;” />

The iPhone assumes the screen is 960 pixels wide, so there is the new META tag specified called viewport for mobile devices. The iPhone technically is 320 wide by 280 tall in portrait mode, but I set it to 480 pixels wide and adjusted the initial scale to preserve current content. More on that later in the post.

I used CSS style sheet but did not declare it as a mobile style sheet.  I would I like to think device manufacturers properly identify their devices, but I know better because I’ve been doing this for too long (and don’t even get me started on Netscape 4.72).

Keep It Simple, Stupid

I did research using other content sites, like the NYTimes application for the iPhone, which I think is one of the best applications on the market. I selected a very similar design approach: allowed for the display of 30 articles at a time, and enabled paging of those articles, and designed around a single column of content.

I figured people were getting very used to scrolling on the iPhone, and designed with that in mind. Common use cases I could see someone reading the site would be while using mass transit or eating lunch.

Once a user was within an article, I kept the same format without the Twitter feed links. Below the article the user could see other recent articles, encouraging browsing of the site. In the future, I’m going to be adding pages where users can view lists of articles by tag.

For the CSS, I avoided a lot of the tricks like hover because they seem pointless in a mobile environment. I figured users would be most appreciative of a simple interface without all the bells and whistles that are reserved for web displays.

Adjust appropriately to use existing content

I planned for a 480 pixel wide maximum width of the content originally for the blog (by no mistake). To make it look good on the mobile device, I had to add 10 pixels of padding around the content. This required adjustment of the viewport values to handle the YouTube and other video content I post in the site.

The values I picked are listed below:

<meta name=”viewport” content=”width=480; initial-scale=0.63; maximum-scale=0.63; user-scalable=0;” />

Initial scale was set below two-thirds because I wanted the videos and image content to scale within the window. YouTube supports the iPhone well. When you select one of the videos, the site is automatically launched. The CSS type is set bigger to account for the initial scale, thus I can use all of the existing content without changing it for those using web browsers.

Make targets big

Dan Saffer writes about this in the book Designing Gestural Interfaces, but I’ll explain it in English: Most people have fat fingers, so it’s a good idea to have fat targets.

Dan advocates the target area be at least one centimeter square, so I adjusted the UI appropriately, including larger than normal search boxes, comment boxes, and the links to the articles are quite a big larger than most websites.

Test on the official manufacturer simulators

The good news is that Apple and Blackberry have applications to test the emulators on. The bad news is that you have to sign up for their programs (which you can do for free) to download the simulators. The Apple iPhone Simulator comes part of the xCode package, so it’s quite a download. Once you have installed it, it’s great at simulating the experience of a website on an iPhone.

Most of the “free” simulators aren’t very effective and don’t give a true experience, so I limited it to using the official iPhone application. I also tested the site on my iPhone, and there was no difference.

Once I get the Blackberry simulator installed, I’ll give you the results. I’m still having difficulties.

1. “Why we want a new website? We don’t like the old one anymore.”
2. “Interactivity is very important to us.”
3. “We know what we want. Our web team has had a brainstorm session about it.”
4. “We’d like a big visual at the top of every page.”
5. “We’ve already chosen the technical system. Now all we have to do is get the content in there.”
6. “Our advertising agency has already made the lay-out. All you have to do is make the tree structure.”
7. “Where in the menu is the procurement division?”
8. “That’s a very sensitive issue in our company.”
9. “Prices on our website? No way.”
10. “We really think we need a news section.”
11. “We’ve positioned the product like that for 10 years. We’re not going to change it.”
12. “That word doesn’t really fit our corporate image. We don’t want to use it on our website.”
13. “Our web builder/ IT department says that isn’t possible.”

Even if the headline reads, “The Top Ten Reasons I Would Design My Site In Baker, California.” Users see “Top”, assumes David Letterman had some part in it, and click.

Voila, instant traffic!

Top lists are lazy writing

Whenever writers are low on ideas, the always lean on Top Ten lists — they are easy, and readers loved them. They’re also lazy, because they require very little real work requiring research, just opinion.

All you have to do is come up with some ideas of what the top items are, and write them. Unfortunately, most of the top lists have no attribution to studies nor have data to support them. Just one author pointing out what they think should be a top item on a list.

Top lists have no context

Smashing Magazine, which has nearly 120,000 readers of their RSS feed, publishes articles like 30 Free High Quality WordPress Themes. That’s wonderful, but for what?

Everyone does this. Jacob Nielsen does this (Top 10 IA Mistakes). Mashable does it. Jared Spool does it (Ten Ways To Kill Good Design). We do it, alot.

There’s no context what the lists are for. Can those WordPress themes be used for a personal site? A corporate site? A sports site? IA of what? All IA? Does some of it really cover interaction design?

For a field that uses “it depends” a lot when talking to clients, we sure have some absolutes, especially without context.

Top lists are usually a bunch of screen shots

Many of the top lists are great to do because they are a bunch of screen shots, but frequently we get no analysis of why they are great. It’s more of, “Here they are, they look cool, go get them.”

That’s wonderful, but for the multitudes of designers out there that are a designer only because they read Smashing Magazine, opened up Photoshop and started charging $50 an hour, the top lists may be the only articles they read.

There should be some kind of explanation why it belongs on the list. It might even be better to show poor design, and explain why it’s poor other than “it just is!”

Top lists only encapsulate what they have seen

There’s no way some of the people listed above have seen every website, talked to every IA, visited through every social media application, and documented every design mistake to make up the list. For example, it really should be Ten Out Of A Thousand Ways To Kill Good Design.

Our view of the world is very narrow, and it’s because we can’t process every piece of information of what we’ve seen, much less what we haven’t seen. (And in many cases, it’s up to us to provide filters for our readers, but with an explanation that we aren’t Moses coming down the hill with the Ten Commandments.) There’s just too much data out there, and that’s why we make generalizations based on our experiences and knowledge. Thus, we make judgment calls.

And publish top lists.

You’ll get your answer soon enough.

Meet Dustin Curtis. He’s a designer that took it upon himself to redesign the American Airlines site and post it on the web.

And he got a response. Here are some selected quotes from an anonymous UX Designer at American Airlines:

First, an introduction. I’m Mr X, and I work here at AA.com. I’ve been doing UX design and development for about 10 years with a variety of companies in a variety of industries, and I work with a team of other UX specialists on AA.com. I like to think I’m decent at what I do, and I know the others I work with here are all pretty good. The problem with the design of AA.com, however, lies less in our competency (or lack thereof, as you pointed out in your post) and more with the culture and processes employed here at American Airlines. … AA.com is a huge corporate undertaking with a lot of tentacles that reach into a lot of interests. It’s not small, by any means.

…

But—and I guess here’s the thing I most wanted to get across—simply doing a home page redesign is a piece of cake. … But doing the design isn’t the hard part, and I think that’s what a lot of outsiders don’t really get, probably because many of them actually do belong to small, just-get-it-done organizations. But those of us who work in enterprise-level situations realize the momentum even a simple redesign must overcome, and not many, I’ll bet, are jumping on this same bandwagon. They know what it’s like.

…

So, since it won’t all get done overnight, don’t give us a bad grade if you don’t see it happening fast enough for your taste. Even a large organization can effect change; it just takes a different approach than the methods found in smaller shops. But it’ll happen because it has to, and we know that. And we’ll keep on keepin’ on, even if most of us really and truly would prefer to throw it all away and start over.

For large companies, redesigning something as simple as the home page is like moving the Titanic on a dime, and redesigning a complete site could take a year, because at some large companies,the number of stakeholders could reach over 100. Not kidding.

And that’s not necessarily a bad thing. Big companies are sometimes slow to move because they make changes that could kill the revenue stream (eBay is a great example), and sometimes it’s because not just User Experience has a voice: add in Product Management, Quality Assurance, Customer Service, the guy from Accounting, some gal in Shipping, and the three people who are relatives of the CEO, and pretty soon, you have a site that’s nowhere close the original design.

That’s what all User Experience folks go through working with multiple stakeholders, right?

…after one of those sessions, I had dinner with friends, and they started talking about was an online shopping experience. The exact feature set the developer wanted to add, my friends basically said it over complicated the process, and made it hard to complete the purchase (I’m going to hide the name to protect the innocent, but it spelled close to Mike, and they sell, uh, shoes).

Note that my friends use technology all the time, but aren’t experts. They are, however, are consumers and are am important part of the new economy. They are typical users that make user experience experts a need. The one site example is cited a lot (well, Amazon does it), but in very few instances does one site make a competitive analysis across sites in the target audience.

So what do users really want?

User experience and development professionals aren’t the ones that should be suggesting all the bells and whistles, so here’s a list I’ve compiled in my head of what I thought users wanted.

Users want the message to be clear

So many websites try to be clever and cute with the tagline, mission statement and other information that they are never clear why the website is up. The best approach is to have a name that is clear and concise, or to create your own brand (Amazon, Google) so you’re name can show up in a dictionary.

For the rest of us struggling to find a website URL that fits our business model, the other approach is to make it clear on the home page what the website is about. Put plenty of hints (like better copy that the outsource website designer can write) so your users have no question about your service or site goals.

Is it an ecommerce site?

Do you provide services?

Are you trying to get people to sign up for something, so you can contact them?

Then state it! Make no bones about what the site is about.

Users want context to see if they fit

Once the user gets to the site and reads the message, they’ll get a better idea if the site or service is for them. Do you patronize a doctor when you have an eye problem? No. So those customers lost are a good thing, because that means that your resources won’t be tied up answering their questions.

How users evaluate a website after making sense of it:

• Is this a service I need?
• Do I see enough value in it (time, money) to use it?

That’s it. If you provide them with enough context to make those two decisions, you’re golden. In the end, users are a pretty simple bunch.

Users want consistency

One of the general rules about user interface design is that a consistently bad interface is better than an inconsistently good interface, because at least users know what to expect. That’s the theory of user interface patterns: use generally accepted methods of navigation (except when you know when to break them), and users will implicly recognize what you’re doing without knowing the science behind it.

That said, users don’t care about user interface patterns. They aren’t going to scream about your use of radio buttons versus tabs, they’re aren’t going to leave the site because you used a checkbox wrong. They will leave the site if the navigation moves around and appears in different places on the page, or get frustrated because they can’t find something.

Users want to be heard without having to shout

The 2 or so million Facebook users that complained about the new user interface were a vocal bunch, but they probably aren’t the most important group. When most people are unhappy about a service, they don’t join groups and send messages like that, because most people have don’t have that much free time. Sometimes the squeaky wheel is the wrong wheel.

They do the obvious thing — they leave the site. (Note MySpace’s leveling off of traffic — that’s the best example I’ve seen in a long time of a site not working for its users).

Happy users return. Sad users leave. Get it?

Users don’t want the shiny (unless it’s in context)

That e-commerce website I was talking about used a heavy amount of Javascript, Flash and other Web 2.0 technologies that translate into a richer experience. However, even on my megafast download of a pipe (I think I’m geting 20 down on a regular, sustained basis), the site is slow. Very slow.

Slow translates into lost sales.

Shiny is great, especially if it’s in context — YouTube and some of the music sites are great examples — but they are also barriers for users. They might not have the right plug in installed. They might be on a slow connection. They might have a computer that belongs in the Smithsonian Institution. More often than not, there’s a reason not to use heavy Javascript, Flash and SilverLight than to use it. The shiny is cool, but only when it makes sense.

Users want to be guided (without being guided)

One of the general rules about website usability tests is that you almost never listen to what users say, it’s always what they do. That said, I can’t tell you how many times I’ve been through a test where the user absolutely felt stupid using the service or product, mainly because the site wasn’t intuitive enough

Help text generally doesn’t work. Big long Flash introductions don’t work. Dancing flash people don’t work.

What does work are sites are are intuitive enough and forward thinking enough to provide a path for the user to go. The elements of user experience should be defined enough so the site acts the way the user thinks it should act i.e. the user shouldn’t have to learn it, especially for consumer facing sites. It’s about predictive user experience.

I’ve actually held a position called Program Manager in the Microsoft model, and it was great: I got to work with great developers, and I gained a lot of knowledge about the technology I was working in. Personally, I would love to do that job again.

Back to the UX folks and their comments about the article.

Their opinion was slightly irritable (them being a bunch of cantankerous UX people like me, and I can be even more cantankerous at times). The way I look at it, Joel handed us a gift horse in the mouth. Here’s a well respected member of the software community saying emphatically that user experience matters.

He established:

• The most important function of a program manager is to design the user interface. Sure, we should know a bit about programming, but our job is to show through out experience and knowledge what an effective user interface is, and to help developers implement it.
• He established the value of functional requirements in some form as a deliverable that’s important to the process. That is more than, as he so rightly pointed out, 37signals has done over the years. 37signals is some kind of darling of the web community, and while they do some good stuff when if comes user testing, functional requirements is something they say not to do.
• He set the ratio of program managers to developers at about one program manager to four developers, exactly or close to what I preach. That, my folks, is job security. When I worked as  a product manager, that was a well oiled team. We produced a lot of good code, and I felt I could handle enough of the workload without working too many more hours.
• He also set that discourse and communication is important to great user interfaces. This includes conflict, iterations, data, testing and all the other fun methods that we do to get where we need to go. He basically established that there was value to that last mile.

Frankly, that was one of the better posts I’ve read for a while on any blog.

Great, you say. He didn’t say kind enough words about us UX folks, saying that anyone out of college could do it. Well, not completely true, but we do have to listen to him.

Why?

• He’s very well respected in the software development community.
• He has a company that’s very profitable based around a subscription model product that might not be the best looking product in the world, but developers love using it because of it’s ease of use and simplicity (try saying that about Bugzilla).
• He has a blog that gets a lot of traffic.

That said, there’s points in his blog post that could generate some disagreement; it’s up to user experience professionals to build bridges of understanding because, frankly, we’ve done a piss-poor job of explaining who we are, and what our value is.

On to the disagreements.

He did say that someone right out of college could do the job; I disagree with that.

Being an advocate for the user and the business takes training and/or experience, and isn’t something you can just learn from the programmers you are working with — they know less about user experience than you might — in the same way that a web or print designer needs seasoning even when right out of school.

They can’t learn typography to an adequate level unless they use it, motion design doesn’t just come to you, and more importantly, some of this field is something you can’t teach. You just have to have the skills and mindset for not only understanding the user but also understanding the business. That takes experience in design, domain knowledge, an understanding of what you don’t know, and where to go find it. They have to learn to fail, and learn from their failings so they can succeed.

To get to where I’m at, I’ve been working the web for almost 15 years (something that few can say), and I draw from all my unique experiences to develop user interfaces for my clients. That experience includes a background in writing, design, business and software development. As we all know, sometimes the greatest failings of people without the knowledge they need think they know more than they do; only as we get older do we realize how much we don’t know.

Great software architects architects are made, not born.

Joel, because of the peers he worked with Microsoft, learned wisdom far beyond what most program managers and user experience professionals would ever hope to, and he has used to it to advance software development. But this does color his view of the world, and it’s up to us to talk about where we have come from, so we can advance from all fronts, not just by being lucky enough to work at a company that at least was trying a process.

As the user experience field grows, it’s great to have other respected voices establish benchmarks that there is a need for user experience. Now we just have to work with them for everyone’s benefit.

The simple answer is not meeting the expectations of your users and/or potential customers. A users expectations are the threads that make up the fabric of the user experience. Knowing who your customers (current and prospective) is the key to meeting those controllable expectations. Through surveys, user-testing, personas, and ethnographic research we can get a good idea of who our customers is and what they want or expect. (I want it fast. I want it easy. I want to know what I am getting upfront. I don’t know what I want, but I know I want something.)

There are any number of factors that could stop a user from becoming a customer, (not finding what they are looking for, price, and indecisiveness come to mind), but your web site shouldn’t be the deterrent.

Ask yourself these questions:

• Is my site/app useful?
  (An essential user need is met… pay a bill, buy an item, etc…)
• Is it Usable?
  (Easy to use)
• Is it desirable?
  (Emotional needs are met through image, color, branding, etc…)
• Is it findable?
  (Can easily navigate through your site and find what they are looking for)
• Is it accessible?
  (All users are welcome, even those with disabilities)
• Is it credible?
  (Promotes trust and believability)
• Is it valuable?
  (Delivers value, improves customer satisfaction and/or advances the mission)

By utilizing the basic principles of usability and user experience strategy you will at least give yourself a fighting chance and offer your user a better experience.

I write here, but I don’t claim to be a great writer. I do, however, understand the value.

Occasionally I write a catchy headline, but most of my work is long, verbose, and is sometimes off mark. That’s mostly because I write technical documentation and complex use cases, but I have a secret desire to fulfill my Nathaniel Hawthorne fetish with 798 854 949 word blog novels chock full of grammatical mistakes and typos.

Good writing is important not only to usability, but also to telling the story of social media: the best storytellers on the web like Seth Godin have turned those stories into real value, and they spread like wildfire. It’s about catching the reader’s attention, which is even harder on the web because sometimes all you have is a headline’s time to do so. Three seconds and you’re done. Period.

Not only do you use social media to talk to your customers, you use it so your customers tell your story for you. That only comes with a well crafted message that takes real time and real money.

And the next few statements will illustrate why the friends I have who initially chose writing as their profession now reside in other, much better paying careers.

I’m going to quote liberally from her blog because it’s part of my rant:

The first, a woman who uses elance to outsource writing work to folks in India. I was, she explained, overqualified for the kind of work (and pay) she was offering. I did the math. It was pennies a word. She said I was overqualified. I have to think she’s right.

The next was a social media blogging gig, two posts per day minimum, with pay of $200/month, preceded by a testing period where hundreds of interested applicants would compete to get this primo gig. To the company’s credit, they offered $100 for the testing period.

Next I tried another online micro-job site that posts small jobs requiring a tiny bit (and nothing more) of human intelligence. Sample writing work there? 1000+ word product guides. Pay: $5.00. In 1986 I would have made about $1,000 for that job. In 1999 I would have made $3,000 for that job. Today, some one will do it — maybe not well, but they’ll do it and search optimize it — for five bucks.

In several conversations that I’ve had with the resident writer on this site, Linda Coss, good writing means more money. How do I know this? Lately, I’ve been sending out my resume with a spiffy marketing pitch at the very start, and low and behold, I get hits. Lots of hits. Not all of them turn into closed deals (or some go on for months), but they get my foot in the door at consulting gigs that turn into real dollars.

I’ve worked with clients where we would obsess over three separate messages for over a week, and that included A/B testing of the message to see which had the higher conversion rate. When you are working with a company that is dropping close to $4 million a year in Google ad marketing dollars, even the lowest common denominator ad campaign gets attention.

I’ve also spent time as a product manager where the time we spent rewriting help text and marketing emails translated into a very real drop of overtime (to zero); thus, I’ve spend very real time showing very real value for words that we pulled out of thin air.

Back to Linda. I paid her real money (not a lot, but enough to establish the value of her ability to write great marketing copy), we got the message, and it works. I can track a very real return on investment for the money I spent and the leads I generated with that content.

I’ve found it puzzling that no one questions the return on investment of software developer when 70 percent of all software projects go down in flames, most of them because of feature creep or lack of market insight, but if the rate is too high for a writer, suddenly the intern is given a laptop and told it’s time to go to town.

The web is this vast wasteland of content not worth the blog, er, paper it’s written on. I can’t tell you how many times I’ve worked with a client that thought cutting the content budget was okay in favor of that “shiny new feature.” Or, just because there’s more people on Yelp (not that I don’t like Yelp, I think it’s a hoot) does it mean that real reviews should go by the wayside. They shouldn’t. The reality is that we need better filters more than ever.

Users don’t care about the shiny new feature.

They do care about brands reflecting a certain quality, and I’m not talking User Generated Content like You Tube or MySpace, because UGC is their target audience’s wants and needs. I’m talking about million dollar deals with Fortune 500 companies where the firms in question ask the marketing intern to write the copy because he happens to have Microsoft Word and barely passed American Literature.

Users want precisely the message of why I should should use this product or complete this offer, what makes them stand out. That message takes time, money, and hits the bottom line.

Now if that message were only clear.

Long load times.

I can’t stress how often I’ve seen sites with great design and seemingly great functionality get less than stellar results simply because they didn’t look at the load times as a part of how functional the site was.

The one that has the most weight in my mind is a poorly designed landing page: a page without one clear objective is a waste and limits conversions.  Each page in the site has to have at least one single clear objective. The objective should be whatever task is necessary to facilitate a sale or an inquiry.

Things that kill conversion are few, the biggest issue is creating a need for registration.

What Kills Site Conversion

• There’s more than one page for registration
• The site asks for data during the initial registration that isn’t crucial for setting up an account
• There’s an initial asking for any sort of payment method, even if not charged at the time

What Improves Site Conversion

• The use of an in-situation registration (not taking user to new page) using AJAX or lightboxes
• Pre-populating data fields based on known user attributes, like location
• An SSL-secured registration page for ecommerce sitee
• Stating clearly the benefits of registration i.e. if you register, you will be able to access more areas of the site
• A clear reason to convert, which should be spelled out in the context of a page for a new user. “If you want to this, just sign up here. You’ll also be able to other features”. The initial request should have a clear benefit to the user.

Stolen from xkcd.

Here’s a few of my favorites:

• When you see the project budget, you realize that over half of it was spent on a Web designer to create a Photoshop mock-up of the home page—with no regard to whether that design is feasible. Or with any attention to the thousands of pages of content that will exist underneath that home page.
• It is a big project and is named Project Iceberg. Or it’s the third time the company is trying to pull this off, and the project is code-named “Phoenix.” Somehow, you don’t believe this one can spring from the ashes.
• The manager of your mission-critical project (handling 80 percent of the company’s revenue) has three months exposure to the technology of choice, and is training four brand-new developers at once. The manager is given a three-month project deadline.
• Management decides to spend a million dollars on a $20,000 project. Then the managers start agreeing with computer company salespeople that the $1 million in software requires $2 million of hardware. Meanwhile, a secretary purchases an off-the-shelf PC and a shrink wrapped CD containing some new office automation packages. She implements the project during her lunch break. (Arguably, we should count this one as a success.)

A lot of information architects think the first step of doing a user experience project is going straight to doing the wireframes. I counter that it’s fairly far down the path after doing user research and establishing the use cases, and that wireframes really establish the spirit and intent of a web application; they are the visual framework from which the developers use to build the application.

Wireframes are never seemingly done: I can’t tell you how many projects I’ve been on where at one point or another, we abandoned the wireframes and communicated directly with the developers. Wireframes are a starting point for development and a tool that should be used as such.

What Is A Wireframe?

A wireframe is a visual representation of a single page or screen, and the elements for that page. It is used as a communication tool with developers, designers and the client, and some agencies use them to get signoff from the client. Wireframes contain all kinds of annotations and notes what each element means, and are usually paired with use cases so they are a meaningful guide for software or web development.

Is it possible to illustrate every single step in a wireframe? Yes and no. You can spend the time to do it, but I’ll contend that most developers won’t read the wireframes closely, so when I do them, I usually do just enough detail to get development started but not too much as to overwhelm the developers. Talk to the developers to get an idea of how much detail they need, and refine based on feedback.

Why Wireframes?

The last thing you want to do is let a developer decide the placement of a submit button.

Seriously.

Wireframes are good for two reasons:

• Placement of elements and the visual pattern of the application are important, because they affect the usability and profitability of the application
• Wireframes make great lo-fi prototypes to test your assumptions with users, albeit in an artificial environment

On to the first point: When developing an application, there’s always a process of “does this actually work,” and the best way to develop that visual pattern is to go through the process of making wireframes. Eighty percent of what you are trying to do should fit nicely into some kind of page architecture, and if the elements aren’t working, doing the wireframes will help discover this.

From the wireframes you’ll be able to see design patterns from templates, common navigational needs, and overall site structure. After seeing the forest, you’ll be able to place the trees better. Many times when working with a client, I’ll tape the screens to the wall so I can see the flow of the application and walk clients, programmers and clients throw that flow. When walking through that flow, you’ll find issues that aren’t discovered in simple requirements gathering, and sometimes use cases ill need to be adjusted to fit.

The second point: Once you are done with the wireframes, you can take those wireframes (hide the annotations) to users, and ask them, “so what do you think this button does?”

I’m still on the fence about using wireframes this way, because I think they react much more positively to a clickthrough that involves a screen, but sometimes I take those wireframes and do the lo-fidelity testing, either sitting down or taping it to a wall.

If the users can’t explain what’s going to happen next, it’s probably not obvious enough.

How Detailed Should The Wireframes Be?

It depends.

If you are working closely with a development team, the wireframes don’t have to be very detailed at all, and may or may not include annotations of user interactions. Some development methodoligies like XP don’t even suggest much requirements gathering at all other than writing stories with hand-drawn wireframes as the artifacts.

If the team is outsourced, overseas and 10 hours behind you, you might consider adding as much detail as possible. That includes full annotations, written use cases, process flows and all of the nifty requirements documents to provide the developers as much detail as possible, because they aren’t sitting next to you to ask, “So what does this button do?”

The amount of direction and literal usage to the wireframe depends on the team: sometimes the designers took the wireframes as a literal guide, and in other environments, designers and developers were given some flexibility on how to redesign the screens based on the elements needed.

What Tool Should I Use To Do Wireframes?

The tool used to do the wireframes should be important (Visio, Omnigraffle, Azure, PowerPoint and InDesign all come to mind of past projects I’ve done), but it’s how the communication is carried out. For all intents and purposes, hand-drawn wireframes are effective.

The tools I like are:

• Visio
• Omnigraffle
• InDesign

Now that I’m consulting again, Omnigraffle will probably be the tool I use most often. I’m been contemplating using InDesign, but on the PC side, I’ve found that Visio is portable enough for most environments.

It really comes down to what’s the quickest way to illustrate a concept. Use what you are comfortable with — nothing else.

Make your call to actions clear, obvious and in your face

I live what’s turning into a Verizon FIOS neighborhood, and for the unitiated, FIOS is fiber into the home: blazing fast speed that will eventually displace cable modems as the fastest cars on the web access market. Verizon is the leader in the space, and they have a website that illustrates the service.

We know it’s fast. We know it’s digital, How do we check if we can get it?

Their call to action is in the lower right corner of the page, barely obvious enough to actually do something. I highlighted it in yellow because I didn’t think anyone would find it.

A lot of us don’t have Verizon so we have to enter an address on a separate screen. Never mind that when you enter your address, there’s an error page that says the address check isn’t working, but that’s a separate usability issue.

If there’s a call to action for your website — and most of them have one — make it obvious, because that’s your conversion point. Small type isn’t obvious, no headline isn’t obvious, a single red button with some text entry fields isn’t obvious. It should be absolutely clear the user knows where to go. Here, it isn’t.

A good test is to stand about five to seven feet away from the screen: if you can spot the call to action from there, it’ll work for end users.

For the end user, what’s at the other end of the internet connection really doesn’t mean much. Users want the applications that work and are easy to use. Scallability, system architecture and configurations don’t mean much when all you want to do is buy a book.

Cloud computing is the hot new topic that’s going to revolutionize how we look and implement applications. Because of this, the responsibilities of User Experence Architects and Information Architects is going to drastically change, and cloud computing services is like Windows Azure are going to enable this revolution.

The opportunity to develop new applications is going to explode

Cloud computing has a completely different model than traditional hosting: pay for what you use. That means the cost of employing system administrators, buying servers, and all of the overhead associated with developing applications is gone; now developers can order a server to be spun up, and the service provider provides all the VPN interfaces to connect to the server.

How quick is the setup? You could have a whole farm of servers ready to go in minutes, complete with database software installed. Complete scalability with a bit of architecture planning and a credit card.

The choice of buy versus build is going to dramatically change 

With lower costs in one of area of software development, companies are going to look for other areas to optimize their technology spend, and so software platforms like SharePoint are going to get a second look, and a third look. And the job of the User Experience Architect to find the right tool for the job.

No tool will fit your client’s needs 100 percent of the time, but most applications (like a Microsoft CRM or a Sales Force) will fit 80 percent of your client’s requirements, and many of these packages are also going to be easily available through the cloud.

User Experience and Information Architects will be in the position of guiding the client or stackholder to a solution that not only fits most of the user needs, but saves time, money and fits within a platform.

Think of it: your client wants an intranet, and instead of collecting requirements, you can get a test drive of an application in the cloud environment 30 minutes later. Within a day or two, you are doing interative development building applications they want or need.

Custom development isn’t going to go away, but companies will look more to what’s already there versus what to build, or customizing platforms. This means that from a development standpoint, applications will be better tested and in the long run quicker to market. The hope is these applications also will have better usability based on industry standard design patterns, therefore supporting cloud computing even further.

The pricing model for for these applications of going to be more palitable for a larger range of clients

The massive licensing needs of an Oracle or SAP isn’t going to go away: those applications are mission critical that have extensive security and governance requirements. Companies that have those needs are going to keep the applications internal to their networks for business needs, mainly because exposing that data in a virtual cloud has all kinds of security consequences.

What about that client that has extensive CRM needs, but only a company of ten people?

The pay as you go pricing model is perfect for them: they are going to get the functionality they need to run their business at a higher level, but only pay for what they use. Gone are the days of having a huge IT department; here are the days of consultants that can drop in and provide expertise on meeting exactly the client needs. Providing more value without the overhead of repetitve tasks, the costs of this isn’t going to require 15 signatures just to get started.

Think of it as instead of not needing a mechanic to ride with you at all times while driving, and only needing repair exactly when your car breaks down. 

It’s happening now with some open source applications, and it’s only going to accelerate with cloud computing.

How long is this going to take?

Like all marketing concepts (Web 2.0, Social Networking, etc.), it’ll take a while to take hold. But when you look at some of the advantages, there’s never been a better time to be a User Experience Architect. This could be the one thing that enables the technology sector to survive this recession and even grow through it. Cloud computing provides real value with cutting costs, and that’s music to companies’ ears.

Embrace change, because the future’s never been sunnier.

So, in my heart I’ve always had a special place political sites.

And let me tell you, Barack Obama’s web initiatives reflected exactly what they did in the campaign: they stayed on message, they stayed at a high level, and it was classic effective direct marketing. Advertising executives should take note, because when we look about at campaigning on the internet, the year it really arrived was 2008. 

They really knocked it out of the park, and they can attribute a lot of their success to web fundraising.

Following that, impost disects their Obama web initiatives in a very detailed post. Read on…

The world isn’t only wireframes, little grasshopper.

What we are going to talk about is use cases. I write a lot of high level use cases in responding not only to request for proposals, but also for determining user needs when constructing the wireframes. Whether I do wireframes first or use cases first really depends on my mood of the day, what kind of project it is, and how complex the project is. In other words, it depends.

Sometimes I do the wireframe first to determine what the detailed use case is, or to spot any branches or scenarios I might miss. However, wireframes are time consuming (and I do them because I don’t like doing Photoshop mockups even more), and I think in bulleted lists, which is how I usually do use cases.

What’s A Use Case?

A use case is a set of five requirements for a task or set of tasks:

• A description of interactions between the user (normally referred to as the actor)
• The system the user is interacting with
• The scope of the interaction
• Dependencies associated with the interaction
• The goal

The use case covers branches, error messages and edge conditions; the main reason for use cases is they are used as a communication tool with developers so they know exactly what’s going on with the system, and how the system should react. The use case will also list dependencies like “user must be signed in.”

When you describe a use case, use active tone i.e. Register as a user, Pay for merchandise, Read mail are typical examples of how I would describe a task the user would take, and I may describe every interaction that user would make in completing that task.

Paying for merchandise may include error messages like:

• Invalid credit card
• Address doesn’t match credit card
• Name doesn’t match credit card
• Expiration date isn’t valid

A good detailed use case will cover every interaction and what to present to the user.

Why Use Cases?

Use cases are tied to personas in that they should describe what the system has to do and how it meets the needs of the target audience. Use cases also ferret out new needs and opportunities that may expand or control the scope of the application.

Detailed use cases are also used as a communication tool with developers: if the team is close knit, information architects and developers discuss the use cases and do a walkthrough so the interactions can be discussed in context with the rest of the website or application. Sometimes, the use case discovers technology barriers that require rethinking the use case or changing the use case to meet system requirements.

As much as we would like to think it’s the case, we can’t design in a black box: something always works not the way as we thought it was going to.

Use cases don’t talk about specific technologies, but they do talk about what the interactions have to do, so technology needs are a very important component of describing the requirements and scope of a use case.

Well documented use cases translate to excellent test plans because they cover every interaction, and are also useful for writing unit tests, which is what developers use to test their code before it’s complete. Good documentation and communication leads to less misunderstandings of what needs to be built.

Use cases that are well written are very effective tools for considering every situation the user or actor may run into, and limit development time because more communication means less question about what has to be built, and what quality assurance will find upon testing the website or application.

Should You Write A High Level or Detailed Use Case?

That depends.

Sometimes.

Not Always.

If the system you developing for is a platform and has a bunch of functionality already defined, listing out the high level use cases may be sufficient. Where I work at, we do a lot of SharePoint implementations, so we use high level use cases to make sure we’ve covered all the needed content in a website. SharePoint (as with a lot of software platforms) has a lot of functionality out of the box, so describing a use case at a high level is usually enough to get the developer started in development and figure what tool or component to use to satisfy the use case.

Detailed use cases are very useful if there’s a lot of custom development that needs to be done, because the last thing you want to leave to software developers is for them to determine the user experience. Detailed use cases also expose flaws the design patterns or technology that may require workarounds or alternate solutions.

What Tools Should I Use To Create Use Cases?

I know there’s a lot of people out there that spend a ton of time creating use cases using Unified Modeling Language — all the power to them — but the tool I use most often is Microsoft Word.

I hate stick figures. I dislike stick figures. I hate stick figures.

I’ve thought about using or creating another tool using PHP and web-based applications, because use cases are fairly repeatable, but I’m just lazy. I write my use cases out in bulleted or detailed form, depending on my needs, and one of the best books I’ve purchased for serious analysts is Writing Effective Use Cases (Agile Software Development Series). Seriously, Allstair Cockburn is a god in my eyes, because he hasn’t sold himself to the devil like Jacob Nielsen or Jesse James Garrett, and he’s provided a useful publication to boot.

Look at your organization and decide what kind of tool is best for communicating to your developers: some of them work best with wireframes, others with written documentation, even more with a white board and sticky notes. A few that I’ve worked at loved HTML click throughs or Azure mockups, because the use cases could be walked through from a user perspective. Most imporantly, if it’s agile and prevents rework, you’re doing the right thing.

Other Resources

• A List Apart’s article on use cases
• Rizwan has an effective, if organized, list of tips on writing use cases.
• This is a great post on Use Cases for User Assistance Writers.

Sometime on Thursday, I’m going to be on a panel at Microsoft’s Tech Days in Costa Mesa, California, and one of the topics thrown around for discussion was, “How do you think Web 2.0 affects your business?”

I’m so far from an early adopter, it’s ridiculous. I have a 9 year old laser printer and 5 year old color laser printer on my desk, and I still believe in using a land line even though it’s VOIP because it sounds better than the cell phone, and it has a decent speakerphone. That MacBook I have is almost two years old, and I can’t dream of replacing it, other than Photoshop’s a bit sluggish.

I don’t believe in adopting stuff just because, and outside of the iPod Touch I have (and I still can’t around to buying an iPhone), I use what works.

That’s why I still don’t believe the hype of Web 2.0.

For most users, they don’t care, seriously. Walk out on the streets and ask any random person these questions:

• How does Web 2.0 affect your life?
• Do you tweet?
• How many RSS feeds do you subscribe to?
• Are you on MySpace, Facebook, Ning, and Digg?
• Do you contribute to Mahalo?

After the first twenty or so quizical looks, you might get an answer to one of those questions. In these times, people just want their problems solved. They want more time, more money, more value. Not more jargon sold to them as snake oil.

Web 2.0 is only important to technology people because:

• We are making money off of selling it.
• We are immersed in it.

For the other 90 percent of the population, Web 2.0 doesn’t mean anything to them, but connecting with their friends on Facebook and MySpace does.

Commenting on articles has existed on the Web for a very long time; blogs just give it a structured form that can be branded. Branding technology with names and explanations makes it easier to sell, but doesn’t diminish the fact that some of these technologies have been for a very long time (Or, ask Jesse James Garrett to explain to Dave Winer how AJAX is different than SOAP). Of course some of the approaches of connecting people to create network effects is important, but it was happening anyways.

Does Web 2.0 have any value? Look at the Wikipedia entry:

Tim Berners-Lee, inventor of the World Wide Web, has questioned whether one can use the term in any meaningful way, since many of the technology components of Web 2.0 have existed since the early days of the Web

The point?

In times like this, it’s good to demonstrate real return on investment like, “it’s going to connect your employees and make it easier to find documents” or “your business is going to make or save $20 million a year”. Talking in buzzwords just confuses people. Explain concisely and directly the value of what you are trying to do, like “more sales” or “less costs”. Target what end users need without worrying about the technology, or explaining that the technology that you are using is somehow new when it’s really just improved.

Keep it simple.

Keep it direct.

Keep it with value.

If I’m working with a client who has an idea for a site or application but he/she can’t identify the target audience (i.e. users of the site), I sit the client down and ask, “So who are these people that you want to make money off of?” The client usually doesn’t know. In an effort to define that audience, I do so with personae.

How important are they?

Your target audience affects almost every decision you may make for a website or application.

This includes technology selection, look and feel, interface design patterns to use, and the tone of voice the content may take. Personae are used by the business owners to define their target audience and can be used for understanding the application. It gets everyone up to speed from designers, information architects and developers to business users.

The personae may even affect whether or not you do the project at all. If your web application can’t meet the needs of the personae, is it really worth spending money at all?

Personae are used to enforce the spirit and direction of the application; and more often than not, are the foundation of a website or an application design.

What Is a Persona?

A persona describes a fictional character, or who your target audience is. Usually, personae describe five typical actors that cover 80 percent of the site audience based on demographics that can be ascertained from what the site is or what the competition already has. Sometimes that can be hard, especially if you are starting service that no one’s ever seen before or are defining a new market segment. For other projects, the personae are easy to define.

Take the Apple iPhone versus Google’s Android G1, for example. Who are using these phones? Does open source or cost of applications affect the customers’ buying decisions? Do they need or not need keys on their phone? So they like slick versus ease of use? All of these details would be used to describe the consumers that may, or may not, fit the personae required for your project.

Why You Should Create Personae For Every Project?

The biggest issue I’ve seen with many of the consulting and internal projects that I’ve worked on is that we didn’t have a single document describing the target audience for the website or application, because the client hadn’t done any market research. Usually, the client or the company wanted a website, and we built it regardless of whether or not it fit the target audience.

In absence of studies and other detailed information about target audience, personae are the first attempt to define a target audience and, thereby, any decisions made about features and functionality. In a few cases, the personae further defined the project that we were working on and those definitions radically changed the direction of the application or website. As a result, the feature set changed drastically.

Clients forget their audience shouldn’t be everyone, because an application designed for everyone fits precisely no-one. Think about it. Just how many 90 pound children like wearing an XXL t-shirt? Now, imagine telling your client this approach wasn’t going to work at all. That’s a fun conversation to have.

Personae not only define how the target audience should be approached in human to computer interactions but the complete brand experience. How you speak to a person with limited computer knowledge versus an expert is very important, even in email and customer service communications.

The personae can be written by the client, the web designer or the programmer. Usually, they are constructed by the information architect or business analyst. Most importantly, personae should be created by a key figure who has an intimate knowledge of who the design is targeted toward and can communicate each persona to other team members.

Who Should the Personae Describe?

Once we have five typical users selected, describe them in semi-fictional detail:

• General Information:
  • Age
  • Ethnic Background
  • Occupation
  • Education
  • Home Life
  • Lifestyle
  • Activities
• Web Usage:
  • Web Competency
  • Frustrations with the Web
  • What kind of information is hard to find
  • Frequent sources of information
  • How they find the website
• Why/How Barriers
• Typical Use Cases

It seems like overkill; but typically, we are able to fit this into one page. The amount of information to include should be enough to be intimately familiar with the personae as friends but not too much to overly define them (like, do they drink Coke vs. Pepsi?). For fun, attach pictures. Your co-workers and clients will identify with them as a target audience easier with a visual representation.

I like injecting a bit of humor here, because people inherently have a sense of humor. One project I worked on, we named the personae Jim Coder and Johnny Bedroom. After a few weeks, the personae became so ingrained that the developers used them in conversations. This approach defused a very stressful situation and made the project more fun.

If you can get each persona on one page, post it on the wall — everywhere!

Even the smallest websites benefit from at least sketching out who the typical users are.

Another project I worked on was a shopping cart for niche aftermarket automotive parts. The products covered six years of a specific make and model manufactured by an American automotive company, and the site was targeted as such. This is a potential audience of no more than 100,000 people, but very targeted. The result? The site had a mailing list of 6,000 members, and the owners sold the company for a huge profit.

Where Can You Find Information for the Personae?

One of my clients had the information needed to start detailed personae. The client provided us with reams and reams of reports based on focus groups that the company had done on their audience. Their target audience was a few hundred thousand people. Additionally, there were resources online that further defined who the client was targeting. The research did not extend to psychographics, but it was sufficient enough to affect project approach and design.

The result: detailed personae that the team could use to match just about any user. This included being able to walk into any bar or restaurant in the website’s targeted location and identify if patrons were the target audience and which persona they fit.

For most projects, this is not the case. The best way to go about creating personae is to sit down with the stakeholders and ask them, “So, who’s going to use this application?” After defining a target, use anything you can find such as web reports, similar applications and market research to further categorize personae.

If you are really lucky, meaning the client has money to pay for this, you get to do contextual interviews such as watching in the target market in its native audience. This can be everything from watching for just an hour to diaries full of daily activities. Most imporantly, figure out what the target market is doing, not what it is saying, by watching its tasks.

I usually research websites that are close to the feature set but don’t completely match what they are developing. For internal projects, we model websites after some stakeholders who we met in face-to-face meetings, changing the names and ages of the personae to protect the innocent.

What Happens If Personae Aren’t Defined?

Good question. What happens if you don’t know what the target audience is, and the application built doesn’t meet their needs?

There are studies about the failures of software projects and not all of them are due to inability to meet the target audience; but if ten percent of them are, how much money are we talking about? Millions? Billions?

I’ve been involved with a lot of software projects, and there’s nothing more frustrating than a project that goes off the rails and doesn’t meet the needs of the user. Money is wasted, time is lost, and we’re non-the-better for it, other than surviving another frustrating experience. We do learn from our failures, but we should have more successes.

But here is a better metric to use. A Standish Group survey found that the number one reason IS projects succeed is because of user involvement, stolen from Classic Mistakes Enumerated. That’s an old study, but think about it. If the target audience gets involved, projects succeed.

Number one reason.

End of story.

So, just how important is that target audience again?

Other Resources

• I’ve included a template persona to start from. Download it here.
• Our tax dollars have gone to a really good resource over at Usability.gov.
• George Olsen has a good article on Boxes and Arrows about personae.

No matter what, your site is the first thing your users see, and in effect your brand; a true brand will build loyal customers

I buy way too much photo equipment. Way too much. I got some high end lenses, the prosumer Canon 5D body. It’s fun stuff.

For lighting equipment, I want to buy good quality stuff, but I don’t want to break the bank, so Alienbees come highly recommended. They are a company based in Kentucky, and their customers rave about them.

Most importantly, they know who they are, which is more than I can say about most of the customers I know.

Their website isn’t the most attractive site on the planet; however, it’s really easy to use, and reflects the personal nature they use when dealing with their fanatical customer base. No elaborate graphics, no flash, but there’s a simple shopping cart that’s straightforward.

The site has this clunky, midwest feel to it, but that’s okay, that’s who they are, and they even include links to other vendors for products they don’t have. It’s a true resource for the camera buff.

They are religious about customer relationship management. Keep it simple stupid is their motto.

How religious about their superior customer service?

I had one of their flash packs die on me. I used their website, called their customer service, and was connected directly to their tech person. He explained the issue in English, that it was a bad transistor that’s been showing up in some of their recent products, and that they are making their best efforts of keeping their customers happy.

He said, ship it, we’ll have it out back to you the next day.

I did, they did. I received a phone call, an email notice that it was on it’s way.

How often do you see that?

If you run a blog, there should be a search box somewhere on the site

I might have written another post about this — it might have been Baseball Prospectus — where I described the issue where search was confusing because there were too many different ways. In their case it’s probably a technical issue because they’re on some custom hacked together content management system.

Six Revisions is different: they’re on WordPress, which has search right out of the box (notice the search box I have on this site, nice and big). Yet, there’s no way to search the site except through using google. It’s really disappointing, because the content is off the charts, and I was going to find a Photoshop article along the lines of their Illustrator article to send to a friend, but I can’t. I have to browse through their archives; this increases page views, but I don’t want to take the time.

It’s simple: blog readers sometimes want to see what’s on the inside, and the easiest way to do it is either through free form search, or through tag clouds.

Development projects are shelved.

New initiatives are put off.

So why is this the perfect time to rethink usability of your applications? Here’s a few reasons.

Most usability changes are small improvements, not drastic changes

If your application or website is surviving and making revenue, but not increasing in revenue the way that you want, this is the prefect time because most changes are small tweaks versus massive redesigns (or, if you are having to do a massive redesign, you’re probably not going to be around much longer anyways).

Some suggestions:

• How does your help text read?
• Do your emails communicate the message plainly enough to encourage better conversion rates?
• Can you remove screens from the process?
• Are there bugs that are affecting the user experience?

Making user experience improvements versus development changes is cheaper

The ratio of time on projects of developers versus user experience architects is about two or three to one, and developers are very expensive. Thus, taking on large-scale projects that may or may not improve your website or web application is a risky proposition, but making changes on a smaller scale where you can measure the results in short, iterative development cycles in much easier to demonstrate to upper management and customers.

Plus with limited resources, you can also cut down the amount of requirements gathering you are doing and have user experience architects work directly with the developers.

User experience changes help keep your current customers happy, and retention is the key to survival in a recession

During periods of a good economy, the key is growth. During recession periods, the key is keeping the customers you do have, because you don’t have to convert them.

It’s best to talk to your customers directly (especially the high value clients), and ask them about your service. Put together a survey of five or six simple questions that are open ended, like:

• What do you like about the website?
• What do you dislike about the website?
• How often do you use the website?
• Do you use it in conjunction with other services?
• What are websites you like?

Interview ten or so customers, and you’ll be surprised at the insights they gave. One of the insights we got from customers at Escrow.com during a time of recession was that they were familar with eBay as an application. As we redesigned the Escrow.com site to fit the eBay style, revenue went up without any marketing spend.

Thus, we kept our customers happy.

That’s changing a bit with the advent of Google Chrome and minimalist browser user interfaces, but here’s a straight forward chart as compiled at My Own Shit (not kidding about the name), with some of my own notes added:

• 640 by 480: 618 by 310 actual, 600 by 300 safe
• 800 by 600: 778 by 430 actual, 770 by 420 safe
• 1024 by 768: 1004 by 598 actual, 950 by 550 safe
• 1280 by 1024: 1259 by 853, 1200 by 840 safe

Don’t Let Business Needs Get In The Way Of User Needs

Yeah, I know, we all have to make money on this thing, but one of the most annoying things about CNN.com is that the search box is set to default to the web, specifically Google.

But what if I want to search CNN.com?

When it comes to the web, I figure I’m smarter than the average bear, but it took me a couple of tries to figure out what it was doing. and that I had to click on CNN News above the search box to change the search. Not only is the indication of status above the search box weak (the links are bolder than the status), but for the millions of users that use CNN, you would think they would be able to make enough money on advertising not to perform this standard web trick.

This is, in essence, like a porn site: let’s hide the link so we can make some more revenue. Additionally (and I’m going to call Google out on this), this dirties the reputation of both CNN and Google because you and I know this was part of the business deal. Some lawyers got together and figured out a way some extra revenue.

I know this isn’t an isolated case. Another conversation I had with someone that works with an even larger site that also has a deal with Google said that the search engine practically monopolizes search, and in essence, it hurts the user experience of the whole site because of the legal terms of the revenue deal.

User needs should not be adversely affected by business needs, and the user experience of what we see here is affected actually that.

If you are making changes to your site to generate a few extra clicks, you’re in the wrong business. Users see through that, and it will affect your business.

Maybe we should send them a six pack of Anchor Steam.

Of course, that fell on deaf ears, the response being a silent version of, “What do you mean, how do I get in? Can’t you see it, it’s right there.”

This is a very important point: if someone has to be told how to get in on a public facing website, or there needs to be pages and pages of help text to explain the concept, it’s not going to work. That’s obvious feedback that something is wrong, that it needs to be re-worked to make it usable.

People don’t like to search, they don’t want to have to figure it out, they just want to use it.

Case in point — the iPod Touch.

I bought one. I have a manual for it somewhere, but I don’t know where it is. I just started using the applications and listened to music from the minute I loaded up the iPod. I’m sure there were functions that weren’t so obvious to the initial users, but through trial and error, Apple crafted a kick-ass interface.

Specialized applications or websites, like Photoshop or SharePoint should have a learning curve i.e. people shouldn’t be able to use the applications right out of the box because those are very targeted audiences that demand sophisitication and power. Anyone can open Photoshop, but you have to have design talent to use it well.

However, many of the applications that are along those same lines should follow some of the same design tenets of a Photoshop or SharePoint because it makes it easier to use the program. I started using InDesign minutes after I opened the program because it much of the same functionality as QuarkXpress, for example. Adobe probably got there by placing the application in front of a lot of users and getting a lot of feedback. Never was it suggested to the user that “it’s right there” or “I can’t believe you’re such an idiot for missing that,” but the designers were probably screaming at them behind the two-way mirror that it was, then realized the flaws in the design.

Users in their inexperience are actually very smart at pointing out the flaws in our designs and the difference between a User Experience consultant just getting by and one that’s an expert is recognizing the user is actually the expert, not you.

Do you listen?

Search should be intuitive

I watch baseball. A lot of baseball. And I’m in a fantasy league, so I read a lot alot about baseball. Because of this Baseball Prospectus is a site I subscribe to because the content is top-notch analysis. If though it doesn’t help me much, there’s a lot of information about teams and players that’s very insightful.

That’s what I like.

What I don’t like is their search interface — it’s hard to figure out how to get to certain articles, and everything is separated. Click on the search link above, and it sends you to a complex advanced search page. Finding a player is pretty self explanitory, but the Audit Team doesn’t mean anything to me.

Remember, users are looking for one search box, and it should be designed to intuitively go to results based on what they expect. In this case, I would expect a search box that would show me all results (“Google-style”), and then I could filter on players based on direct and indirect matches. What is here now doesn’t work for me.

For the most part, though, the broadband connections aren’t.

Using my Verizon Wireless card on the computer sends me back into dial-up time, and worknig with this client, we’ve estimated that we have to act like the site’s designed in 1998 from a page weight perspective to make it acceptable for end users, because most of them are on ISDN-level DSL.

So why does this conversation matter?

Even if they are using 3G for their iPhone, consider the end device or end connection speed. Of course if you are in a business environment, you’ll get more leilency over that issue, but for public websites, you don’t know where the users will be coming from. There’s a certain group of the user base that will never move off of dial-up (I’ve heard the quote, “you know what, it’s fast enough for me”), and you should design your pages as such.

Major League Baseball’s site does just that — they have a narrowband and broadband version. I had never seen the narrowband version because my connection at home is smokin’ fast, but here, it was a great substitute to downloading HD Video.

You don’t have to design your site like Craigs List, but do consider how much weight is on the page.

The truth is our economy has been in trouble for a long time. It is the “too smart for the room” guys that, at some point in, I would imagine the 90’s, figured out how to make money without actually creating any value.

When a form has been completed, indicate status clearly and not just with a single line of text

I’ve been promoting the blog a bit lately, and that means filling out a lot of contact forms. One of my pet peeves (and this isn’t just the Sharepoint Blogs site) is that many contact forms have a single line of text that reads something along the lines of, “It’s been sent.” Usually, it’s so small, people resend the same message over and over again. My first assumption is, “Did I do something wrong? Where’s the error text?”

I’m going to make everyone a deal — I’ll write a “thank you for sending us a note” page for free if you need that if you promise to endlessly promote me on your site.

Please spend the extra 15 minutes to add a secondary page that knows the message has been sent and confirms it to the user.

Don’t bury content; give your users multiple ways to view the same information

Usability Counts was just recently named as to the Social Media and User Interface topics on Alltop, which is a self-proclaimed “online magazine rack.” While we don’t think we know about as much as anyone else, we’re included in the same page as some of the top blogs out there. So cool. Maybe someday we can can aspire to be Jeffrey Zeldman.

The only issue: we are really, really below the fold. Don’t get me wrong — I like the new design All has launched — but for my own selfish reasons (more traffic, more targeted users, less pooftas), I wish we were a bit higher, and that there was a different way to view content so I could see items by date and not by blog.

How far down is Usability Counts?

Two scrolls down on the 1900 by 1200 monitor we function on for User Interface, and more than five on Social Media. Almost mad dogs and Englishmen tolerance.

Not all is lost: the good news is that AllTop is human-edited i.e. there’s some kind of vetting process on deciding who belongs, and who doesnt. so the spam aspect would be a bit lower, avoiding the torrent of bad posts Technorati delivers to my inbox.

Alltop needs a content view where items are displayed as they are posted (so there’s some encouragement of consistent posting), and maybe a couple others around autority and reputation. 9Rules does a really good job of this, and tends to push more traffic to blogs. A tabbed approach would be a huge benefit to users, and they could set the default of what they wanted to view first.

What do you think?

The good

• It’s snappy. I’m not going to run any speed tests, but it seems to be at least as fast as the new Firefox, and much faster than Internet Explorer.
• It doesn’t try to be too much, because it knows it’s a browser. There’s a back button, forward button, reload button, settings button and a document button which is basically the old tools menu from Word — throw everything in there. A lot of those other menu items (assumed stuff, like print) is hidden, which is good.
• The interface is slick, but I disagree that it’s going to be the operating system. It has aways to go until it replaces Microsoft Word.
• Tabs are application independent, meaning one tab cannot freeze another tab.

The bad

Releasing bug free software?

Uh, yeah, sure.

But I like to live in the real world too.

Today, we’re living in a “beta is acceptable” world. Requirements change. Wireframes aren’t updated. Changes aren’t communicated. Emails aren’t sent. Bugs are issued.

As much as I want to release products that are bug free, user friendly, and have every feature in the world working exactly as planned, I also like working realistic hours and shipping product on a timeline short of developing the space shuttle.

The point: most web applications aren’t life and death situations.

For this, there is an acceptable tolerance level. Users are willing to put up with a little discomfort if it means a fairly stable, better product; managing a realistic process means the difference between a good application with a few warts, and one that is completely broken with users that are leaving in droves.

As long as it doesn’t format their hard drive, they should be okay will a few application crashes.

Here’s a few things I’ve done to help mitigate issues in design and development:

• Do hallway usability testing early on. Get some of your wireframes, show them to people, and ask them, “What do you expect this to do?” instead of telling them.
• Site down with the developers and ask them to show you the system. It takes 30 minutes, and it means the world, because then you can clarify what you really meant with the spirit of the wireframes, and not the letter.
• Do usability testing late in the process. Two weeks before you release, grab more people, walk them through several scenarios, and test for pass/fail. Figure out what can be fixed before the release with minor application changes or added help text, figure out what’s broken beyond fubar so you pull those features, and figure out what to have customer support tell the end users. If there’s a message there, the users will love you for it.
• Schedule a second release after the first one. That’s why it’s called soft launch. For a second round of bug fixing, your users will appeciate going through a preview. If you do a search of all the marketing pushes occuring on hard release dates, it would be a good bet most of them failed because the applications failed to live up to expectations.
• Talk to your users. Say you’re sorry. Say you’ll make it better. Listen and learn.

The reason there’s usually a redesign is the CEO usually comes down from the hallowed halls, and says, “we have to make it grey instead of yellow!” And grey it is (read: cnet.com).

Facebook is launching their new design this week to upteen million users (100 million or so, not counting my friend’s cat), and there’s going to be an uproar, and some grumbling, and then people will get used to the new site and stop complaining. Last time I checked, no one is actually paying for Facebook, so they can’t ask for their money back.

Looking at the numbers as reported by Mashable, it looks like adoption is not too bad — I’d be worried if there was a massive change back to the old platform, and that’s just not happening. In fact, I’d even go so far to suggest that Mashable might be spinning it a bit their way in a negative light because they don’t like the redesign. The petitions are at about 800,000 users, which means that there are probably about eight million very unhappy users, but that’s what, five percent of the audience?

Every site redesign I’ve participated in, I’ve seen the same trend. Sites almost never lose users because of a redesign, but it does slow site growth because when you do a redesign, there’s always a lot of bug fixing. MySpace has been going through a rolling redesign of their site, and other than some grumbling I heard from the teenset, there’s no petition there. In fact, that and the adoption of the platform has been very, very positive.

Or maybe the users there just don’t care.

I actually like the new site and some of the features (like uploading a profile photo) require tribal knowledge of driving through Boston’s streets to find the right screen, but overall I think it’s a move in a positive direction, especially since many of the newest features are occupying a space that both LinkedIn and eVite missed.

Facebook is becoming the defacto networking platform for professional groups. You can personalize your page quite a bit more, but still keep the Facebook look. And seriously, running two designs like they’ve been doing is a serious pain in the ass; last time I checked, one of the advantages of the web was one code base, yo.

Facebook has grown immensely over the years, and the application platform has created whole new opportunities for developers to abuse it, so gaining a bit more flexibility with the new design I think is a good thing.

Just try it, you’ll like it.

Well, duh.

Not to further point out the obvious, but whenever a company touches a customer, it’s a reflection on the brand, whether it be through a website, a commercial, or the actual product. Phenominal User Experiences with the correct amount of Marketing bring profitability (read: Apple’s record quarter of Mac Sales, Amazon’s success as a retailer, eBay’s branding as the world’s largest garage sale).

Again, it’s not just a technology thing — the company has to live and breathe it.

It’s all a reflection of the brand.

Smashing Magazine has an article on this too, but here’s a few truths to live with:

The clients don’t always pick the best design

The design you are presenting might be something rich and inviting, with all the bells and whistles you throw on there. The other design might be something clean and sharp, but not exciting. Not exciting sells, especially in certain less progressive environments, like governments or large corporations. The stakeholder or final decision maker probably isn’t a designer, so they really can’t tell the difference between rich and not rich, just what they like or don’t like. Some of the sites I’ve designed I hate, but the client loved, because it hit their target audience.

The clients are influenced by a local designer

There’s nothing like being there in person when showing off a design, and if you can’t do this, you’re already at a disadvantage — you can’t discuss some of your motivations for doing a particular design, or taking a particular angle. Sometimes you are set up to fail from the very start, and it’s best to recognize it and put your best foot forward, even if you know you aren’t going to be the winning design.

Sometimes the best design isn’t the most usable design

When I was working at Escrow.com, eBay was one of our partners. We redesigned the user interface of the site, and on every iteration, we made it look more like eBay. On every iteration, revenue increased. As much as the user interface designer I worked with hated it, we had to keep going that way. Many users might consider eBay one of the ugliest sites on the web, but when revenue rises, you keep going that direction. If you don’t, you are ignoring your users. Follow the obvious roadsigns.

Design is subjective

Totally true, but the best argument I’ve set for some of the clients is, “let’s try some A/B testing.” If it’s a simple website, and the site gets a fair amount of traffic, you’ll know quickly which design works better. Changing the colors of certain buttons in a design can affect the conversion rate. As much as you would like to tell the stakeholder they aren’t the audience, sometimes it’s best to do just that by involing end users.

We actually tried to do the impossible, which was print from a web-based client, and we got it to work. It’s wasn’t production level code, but with a few tweeks here or there, we could have hit that mark. There was no indication if we were going to be allowed to release that client, but the usability wasn’t too bad, especially for skunkworks project.

Soon after that experiment, the company purchased another company that developed a shipping client for shipping centers. It was pretty advanced for it’s time: it did all the AJAX stuff before Jesse James Garrett got rich off of coining the term AJAX. Other than a few glitches, it seemed to work pretty well.

Except it didn’t.

When you visited the clients that used the application, they hated it, and here’s why:

• It was slow
• Performed poorly over DSL
• Was a bloated mess and a fragile application.
• The web client worked only on Internet Explorer 5.0, and as soon as 5.5 was installed, the application broke.

So what are the lessons? I always thought the internet postage client should have been a web application, and conversely the shipping application should have been native to Windows, because almost every one of these locations had a Windows system. As much as I keep repeating that the web is a fad, I think it depends on the following on what you select to be the platform to develop on:

Who’s the audience?

The needs of a bunch of workers telemarketing day in and day out are much different than a sales guy that’s going to make 10 sales calls a day. The telemarketers are going to want hot keys, they definitely don’t want to use a mouse, the latency means less phone calls, which means less money in their pocket.

That’s usability that costs the company in revenue, so they’re going to want a rich or native application. The sales guy making those 10 calls doesn’t mind taking a minute or two longer to futz over a dial up connection or a slow DSL connection, so a web application is just fine. It’s the difference between a casual vs. an expert user.

What’s their platform?

Take a good look at the audience’s technology before you select the platform. Is the audience has a bunch of different platforms and technologies they are working with, that’s an easy answer — go with a web application. If they are on fast connections, look at Flash. If they are on a single platform (Windows, for instance), a native application isn’t a bad idea.

How fast is their connection?

Native applications, once installed, don’t have to be downloaded again. Rich media applications have to be downloaded through a web browser, usually in one chunk. Web applications have latency depending on the connection. Which would you rather be using while working in Alaska, depending on how much data you have to push around?

How often does this need to be updated?

There are advantages, of course, to a web-based application, because you don’t have to worry about backwards compatibility, a code base that’s branched all to hell, and 18 different flavors of windows. If you are going to update the application every day, a native or even a rich media application might not be the way to go. However, if there are long cycles between updates, and there’s a way to push the updates cleanly, then a native application is okay.

All of the above should be considered even before selecting a development platform, because each affects usuability. It’s about the appropriate technology for the appropriate audience, something developers forget.

Smashing Magazine has a great (but lengthy) article about a topic dear to me — web forms. Web forms are the most important aspect of what we do because they usually lead to conversions, yet we spend so little time on designing them.

Never mind that Firefox 3, the new browser, is so fast it runs circles around Internet Explorer 7 and Safari for the Mac (this after a long time of bloatware with Firefox 2), their website is the best I’ve ever seen at identifying exactly at getting people to download the browser. The navigation of the site has always been phenomenal (is there anything more straight forward than add-ins?), and this release, it just gets better.

The wins?

Detect who the user is in a hurry

Am I a Mac or a PC person?

No problem!

We’ll just look at the user agent provided by the browser and server, and we’ll detect the language and operating system. No choosing, just a small note that tells the user exactly who they are. This is a detail most websites completely miss (how many times do I have to see PC Software listed when I access Download.com?).

At the bottom of the page there’s content comparing Firefox vs. Safari, the native browser for the Mac I’m on. Brilliant!

How much does this cost?

It’s free! And they tell you it’s free! Download now! Operators standing by!

But what if I have the wrong language selected?

I would have listed some of the languages here (how many Japanese people will be able to translate Other Systems and Languages if their browser is set wrong?), but for the most part, selecting another platform or language is straight forward. The secondary page does it a great job listing the languages, but a poor job of translating the word “Download” into each language. Was someone, anyone paying attention?

So some of you have probably been following my misadventures with United Airlines. After a few calls, they were awesome at correcting a airline ticket where I didn’t include the full name of the passenger (she has an Anglicized name that also appears with her Chinese name on her passport), and I didn’t find out until later that I needed to include the full name.

Not to throw just United Airlines under the bus (pun intended), but most of the other sites didn’t point out the the following requirement: that whatever name was listed, it should be exactly the name on any identification. This isn’t necessarily the airlines’ fault — all of the airlines are following guidelines set forth after 9/11.

The issue for some of the sites is that this requirement isn’t obvious enough: if someone like me, who never reads the text on a site, misses this, I can’t imagine how many others have fallen prey. And with the frustration over customer service and airlines in general, passing the buck of the travel sites with the airline companies has become almost sport.

Here are a few screen shots from my favorite airlines:

Southwest Airlines

No indication.

American Airlines

Does indicate, but in legalspeak.

Delta Airlines

No indication, but does have an indication that you can refund the flight if there are changes within 24 hours of booking further down the page.

Orbitz

Perfect. Someone at the other sites needs to copy this exactly. An additional improvement would be to add a link to the polices for changing flights. They should have additional text that reads something to the effect “even in the event of a mispelling.”

Other Travel Sites

Expedia does cover this under the rules and restrictions, and on the screen where you have to enter a traveler, but not next to the text entry area (and the rule is actually covered up by a popup window. Travelocity is much like Orbitz, where the explaination text is right next to entering the name.

Where’s The Search Box?

Hulu‘s a pretty good site — lots of video from companies that want some kind of control over the content, which is much more than YouTube is giving them. The site’s is version 1.0, so the interface feels a bit clunky. Most importantly, where’s the search box?

I made the screen capture small without a highlight for the primary reason that if you are on a content-heavy site, that search box better be easy to find. Like Google easy to find. Like YouTube easy to find. Like News.com easy to find.

Can you find it?

Enter Kayak. One of the best examples of Web 2.0 design, it’s simple, offers my options to change my search on the fly, and it’s fast. I love the site. I don’t know how they make their money, because sometimes I book somewhere else, but whatever they are doing, keep it up.

Personalization

I came in as a member, and those links showed up. They should be replaced with links that are appropriate to me as an audience. Off that page, I would also make getting to the online store more obvious.

Non-Standard Credit Card And Information Forms

This is the join form, but this also appears in the credit card form — the form required you to enter your month (May, November, September) instead of selecting it from a drop down menu or entering a number. It might seem clever, but every other form of this type I’ve seen has been entering a date as numbers and not as a text item.

You have to really do things people expect, and this is outside the lines. If 80 percent of the forms out there require thing, there better be a really good reason to do it different, and there really isn’t a good reason to do it different here. I wonder: did they do any usability testing?

One note: If you are designing forms for an international audience, the format of the date for most countries is day, month, and year.

I’m going to go one further: sometimes it’s about a lot of small features instead of doing one large feature.

Example: when I was working at Escrow.com, the application was receiving a lot of bad reviews by the users, and the customer service department was working 20 or so overtime hours a week. I did an analysis of the customer service emails, and found that a full 20 percent of the emails and calls were related to the URLs in the emails — they were too long. All we had to do was design shorter URLs.

Two days of work by the developer, and in three weeks, the overtime was gone.

Over the next few months, we did a lot of small changes, like rewriting the customer service emails, making small improvements in the application, making small user interface tweaks. None of them took more than a couple of days, but over the long haul, we saw month to month improvements in both conversion rates and revenue generated. The return customers doubled, because they found the site to be easier to use.

This was all done without spending any marketing dollars.

We did do a redesign four months later, but the design was based on the small changes and user feedback collected from emails and focus groups selected from our more frequent users. They told us to make small changes, because it was the details that made it a better user experience.

Think small, then big. If you have to think big, there should be a big reason to justify it.

What are your success stories?

There are no screen shots because I couldn’t install the software. Additionaly, there was no clear indication that the service was going to be discontinued for her.

Here’s what I would have done to make the service easier:

Tested the software on many platforms with many states of other application installs. One of the mistakes that many Windows developers make is they never test if for a typical install — which is when users install tons of applications, many of them of suspect quality, before installing your application. The developers always insist on a clean install of Windows, and how many of us have a clean install?

Put a “download software here” link somewhere on the site. If you go to Yahoo Music Unlimited now, there’s no explanation of what software you need to make it work — they just have a bunch of links to try this software now, which is entertaining, because they are about to kill the offering completely. The answer is that you have to download the Yahoo Music Jukebox, which I assume is a fine piece of software, except…

If the software doesn’t install, there should be an easy way to contact customer support for help. There was no install log, no click here if the software isn’t installing. Finding any answers at all on the Yahoo! website is a frustrating experience, and it took me upwards of two days to figure out that I should be contacting customer support. Additionally, there are seemingly three or four separate customer support contact screens, further confusing the issue.

Browser experiences are hard enough, but especially with applications, usability of said application is very important, especially when it’s an install of a paid service. Open source or shareware software, I could see less support — however, this is Yahoo, and the assumption is they are making some money off of this.

I ran into an issue at the Virgin America site — I tried to upgrade a seat from a premium to first class at check-in (which, by the way, is only a $50 upgrade on the day of the flight). My friends have been recommending the airline, so I decided to give it a try, because the price wasn’t much different than Alaska.

The issues were:

• The price was wrong
• The payment screen didn’t work well because it had issues automatically populating information if I entered the information wrong and showed a system error
• When I submitted payment, the site timed out

System issues like this are just as frustrating to the user as poor usability; users don’t know why things are going wrong, and sometimes assume that it’s something they did. I don’t know how many times I’ve seen during usability testing where a user would hit reset when hitting a javascript popup dialog.

Testing of a site is especially important if the site is an e-commerce site, like Virgin America, because it directly hits the bottom line. It’s all about ROI, baby.

The one usability issue I saw with the site was the color of the buttons (actually, the lack of color):

That continue button is really hard to spot. I would have made it dark gray (all the positives that color), to move the user along). The placement of the buttons was correct (positive to the right).

I do know that this site was designed by an agency (they were probably built the site also, and most agencies don’t have a lot of technical talent). Sometimes the look of a site should not take precidence over the usability of the site, especially when it comes to buttons.

On a good note, Virgin America honored the upgrade and did a wonderful job with their customer service, and the website had one important link — a mail to — so I could email the issue to their web team. I commend them for doing things the right way!

Metroblogging is a great site — localized blogs in 54 cities around the world, and they have a map that shows where the cities are. It would be great if i actually knew what the cities were if I hovered over them.

That’s really easy to fix: just add a label next to the city ball, and this would become a much, more usable Flash map.

Even with icons, there should always be some kind of label that indicates what the item is. Users don’t want to have to guess what it is, and even obvious items like folder items aren’t so obvious.

“You know, I didn’t quite think about it. I’ll just remove it for now.”

Part of it is lack of sufficient time to gather requirements, part is sometimes crafting a good user experience where coming up with something really cool is something that you can’t put a time frame on. Sometimes it could take five minutes and hit you on the road, like how to handle comments within an MySpace Open Social application I am working on now. It could take weeks where after you design it, it’s implemented and you realize, “man, that’s just not effective.”

At work and at some of the clients, I push for having an Information Architect around during the development process — not necessarily full time, but just around for questions — because issues will always come up. That’s why I am convinced that waterfall-style requirements gathering works well for building the Space Shuttle, but doesn’t work well for developing web applications because of the nature of the technology (ultimately flexible, low barrier to entry, the approach of “let’s throw everything against the wall, see what sticks”).

With wireframes, there’s always this “lost in translation” moment where Scarlett Johannsen asks Bill Murray, what does this do, and we haven’t quite covered it. I’m convinced it not a tool issue (Axure, Visio, whatever) but just an understanding of what we do is part art, part science. Apple gets it. Some other companies get it.

What did I do? Did what any self-respecting iPod Touch user would do: bought the music anyways through WiFi. It took me less than two minutes to go through the purchase process, truly an impulse buy that all music vendors aspire to.

Something so simple as buying music through thin air is another reason why Apple is so far ahead of the pack: the iPod experience connected to iTunes are clearly such a superior experience that other vendors are going to have a hard time catching up.

In other words, Apple has figured out how to sell out how to sell the razors and razorblades — clearly how usability and a superior user experience leads to a better bottom line.

The summary is:

1. Hidden log-in link
2. Pop-ups for content presentation
3. Dragging instead of vertical navigation
4. Invisible links
5. Visual noise
6. Dead end
7. Content blocks layering upon each other
8. Dynamic navigation
9. Drop-Down Menus
10. Blinking images

It comes with great examples of high profile sites too!

Cheers.

I like FaceBook. I’ve hired people off of FaceBook, and find it more useful from a profile standpoint (but less entertaining) than MySpace, but not as useful as LinkedIn. However, I had to do some housecleaning the other day, and I deleted over 100 applications.

Part of the problem is how most of these application developers design the applications, and nothing is a better illustration than what my online budy Andy Sternberg pointed out using an application on my own profile — that since I’ve installed an application, there’s this implicit “wow, Patrick must really like it.”

No, I don’t like it. My friends are selling me, and I’m not getting any of the profits.

A lot of these applications and even some websites, like Reunion.com (I’m not just bringing them up because I interviewed there years ago, but because I know the CEO knows better, and the David Lazarus of the Los Angeles Times also brought it up) are using shady ways to promote themselves, like harvesting friend lists and so on.

Note to application developers — if the applications are usable, engaging, and cool, people will use it in droves. They’ll tell your friends. They won’t worry about being forced to tell 10, or 12, or 20 friends. Facebook probably doesn’t know how it’s damaging their reputation, or if they do know, how to fix it.

That Scrabbulous application is engaging.

Texas No-Hold ‘Em Poker is engaging.

FriendFeed is engaging.

Selling friends is not.

Long story short, one of the people had an interesting paradox: how do you get people to use SharePoint when they are using the voice mail system for everything?

He works for a local restaurant chain, and most of the users are restaurant managers that are too busy managing their restaurant to report on issues. They are supposed to log the going’s on in MOSS, and now instead of using a diary, they use the voice mail system, because it records all the messages.

He’s talking about some of the issues, and there are some very interesting patterns, most of which are cultural because of the nature of the users he’s dealing with.

I suggested that instead of trying to force them onto SharePoint, do the opposite and let technology do all the work — there’s some voice mail software that will transcribe the message to text, and save the audio message. You can probably hook that up to MOSS, and thus save the messages and the voice mails themselves for archival. Sure, there’s a loss of potential meta data, but that could be cured other ways.

But it brings up an interesting point: how many of us have run into an environment where user adoption issues are so severe, the technology just doesn’t get used? Square hole, round peg, right? That’s why we write personas, so we can understand the culture of the people that we work with.

In this case, the restaurant managers are not computer users — if you studied their usage patterns, they are probably recording their voice mails on the way home after a long day on their feet (and they would drive home and record the message instead of sitting in front of a computer). So sitting them in front a blog probably wouldn’t happen.

Any suggestions?

1. Non-Standard GUI Controls
2. Inconsistency
3. No Perceived Affordance
4. No Feedback
5. Bad Error Messages
6. Asking for the Same Info Twice
7. No Default Values
8. Dumping Users into the App
9. Not Indicating How Info Will Be Used
10. System-Centric Features

The designer-user gap

This is what Jakob Nielsen (or his ghostwriter) in his Alertbox column is calls the designer-user gap. Nielsen identifies three levels of designer-user gaps:

• Level 1: The Designer Is the User (he completely understands how the product works, and so do the users)
• Level 2: The Designer Understands the Product (and the designer is in the dangerous position of knowing more than the user group)
• Level 3: Designing for a Foreign Domain (where the designer has the problem that he knows much less than the user group)

The reality is that we are almost never the target audience, so when we say that to some executive that wants it red or blue, the truth is that they may be closer to the target audience than we are.

“User Experience” encompasses all aspects of the end-user’s interaction with the company, its services, and its products. The first requirement for an exemplary user experience is to meet the exact needs of the customer, without fuss or bother. Next comes simplicity and elegance that produce products that are a joy to own, a joy to use. True user experience goes far beyond giving customers what they say they want, or providing checklist features. In order to achieve high-quality user experience in a company’s offerings there must be a seamless merging of the services of multiple disciplines, including engineering, marketing, graphical and industrial design, and interface design.

…because, well, they get paid a lot of money.

But, I like to keep things simple. This is what User Experience means to me:

For quite a while, I drove a BMW Z4. It’s a nice car, but most amazing is the placement of the cupholders: they’re right underneath the left and right air conditioning and heating vents, and when you pressed on them, they would pop out. Among all the other things that the car had — a lot of power, a stereo that would increase in volume when the car was going faster, seat warmers, and a power top, excellent handling — it was the little things like the cup holders that made it an excellent user experience. In the time I drove that car (for several years), I never spilled a drink.

The Z4 was in the shop for a while, and I rented a Chevy Aveo for almost three months. Among other things about the car (other than the running joke that a friend of mine came up with a different name for it every time he talked about it) I didn’t like, the cup holders were in the middle, between the seats. I spilled drinks in that car five times. The were a lot of things I didn’t like about the car (poor handling, uncomfortable seating, brakes that were similar to what Fred Flinstone had to do), but what stuck out most was the cup holders.

That’s what user experience means to me — you never know what the end users are going to complain about or like about your product, but you do know that everything they see is something that could be criticized as a poor user experience. It could be that the product crashes every five minutes, or that help text was poorly written, or that it takes ten steps to go through something that should take five, it’s the complete experience. It should even be to the level that users don’t know they want a feature, but it works just as they expect it to.

User Experience specialists act as holistic evaluators and product managers that recognize any that could limit the effectiveness of the product. In that sense, User Experience architects act as gatekeepers, working with all teams (Development, Quality Assurance and Marketing) to make sure what goes out the door is an excellent product.

Here are a few of my favorite resources:

• Internet Studies has a really good list of sites that have stored design patterns that they use when coming up with ideas.
• UI Patterns is one of the best libraries I’ve seen, and some of the patterns there, I’ve used for years.
• Here’s Yahoo’s design pattern library — they aren’t the best example because their IA across channels is all over the place, but at least they have something documented.
• The best book I have ever seen about this is Designing Interfaces, and this is the website.

(To this day, 15 years or so into the web, I still can’t believe we’re having browser wars.)

While they are still perfecting it and actually striving for a standard compliant browser, some of the notes from the conversations I had were:

• It should be a lot faster (I hope so — I just downloaded the Firefox 3 beta, and it’s smokin’ fast).
• The team says they will try to be as backwards compatible as possible.
• How IE8 will handle Element ID’s will be much different than previous browsers, and could break a lot of sites.
• A lot more built in tools like validating CSS and HTML will be right in the browser (and no more going back to Firefox to check).
• You as the user can choose how compliant you want to view websites, because there will be several modes (including a “quirks” mode) to choose from.

I’m not saying it’s a me-too technology — there are some very obvious advantages to it, beginning with standardizing on a programming language people actually use instead of something specialized like ActionScript, but we’ve had the hardest time adjusting to the workflow, and a lot of designers are afraid of this much like they are afraid of Flash CS3 Professional because it is such an adjustment. It was hard enough just moving over to the whole motion graphics world, and now many designers and developers are expected to relearn the application to a certain extent.

To the person who applies for this job, please remember how your job is better adoption in following ways:

• It’s not enough just to have timelines — the application really should be easy to use for designers because they are not programmers
• Make some of the interactions easier to explain like, “how do you make a button so it has the multiple states”, maybe even adding wizards like, “create a new button”
• Produce a product that can actually align text better (text alignment should be one of those 1.0 items, not on the 3.0 product list)
• Cater to the designers that ditched Flash when it moved to Actionscript 2 to Actionscript 3
• Most of all, it’s about user adoption and talking to your audience — if you don’t do that, no one will use it

Most good design and screen-based user interfaces follow some kind of grid — whether it be the orderly layout of items in a form, or a multi-column design of a blog. Grids bring order, and the grids don’t necessarily have to be symmetrical to be good design (the New York Times website is a great example).

For newspaper design, the closest guide to designing content sites, asymmetrical grids and number of columns were not only accepted, but encouraged, and most major newspapers are 5 or 7 columns wide. Peruse News Designer to see examples in the front pages of world newspapers.

Resources:

• Smashing Magazine has a really good article on creative usage of grids
• An article at A List Apart about thinking outside the grid
• Design By Grid, a resource with a lot of links

Click here to read the complete list.

More amazing is that Apple holds 19 percent of the space, and the only other on-line retailer is Rhapsody, at one percent. I repeat, one percent.

I was a print designer working at a magazine company, and a friend of mine said, “Hey, we’re doing this Internet company, you want to join?”

I had to ask, “What’s the Internet?”

A BBS I was on years before that was on Usenet, but for this, I literally had to buy a computer to use AOL and the World Wide Web. It looked interesting, and I figured that I’d be doing it for a couple of years.

That was twelve years ago.

I fell into this because I did really clean, organized design, and had a knack for enforcing a process in using the sites. I understood the basic needs of a user and how sites should do work as expected.

I understand simplicity.

Today, I work as a user experience specialist — an Information Architect guiding clients on anything from Windows applications to large scale websites. I enjoy my work, and the rewards include better return on investments that exceed the amount they pay for our consulting.

User experience is the lost art that most product management types miss in technology, software developers ignore, but something that matters most because it affects who matters most — the end user.

I spend time showing clients how a few changes to their processes can save them or generate them money. It could be as simple as changing a URL, or complex is evaluating a multi-step process. Whatever the process is, at the end of the day we provide metrics that the clients can measure against.

Usability counts more than you even know.