Question the details | Boagworld - Web & Digital Advice

Web & Digital Advice

Digital and web advice from Headscape and the addled brain of Paul Boag... tell me more

Paul Boag Posted by: Paul Boag On Friday, 1st April, 2011

Question the details

I have been working on a wireframe walk through of an ecommerce checkout the last few days. What has struck me most is how important it is to question the details of your design.

Design:
The estimated time to read this article is 6 minutes

They say “the devil is in the details”. Cliche though it is, it is actually true. When deadlines are looming and budgets are tight it is easy to make snap decisions about the details of your design that can ultimately be incredibly detrimental.

To produce truly great design we need to find the time to think about and question the details of our work.

To give you an indication of the type of questions you should be asking I thought I would share some of the details I have obsessed over while working on wire framing a recent ecommerce checkout process.

Question whether more clicks are bad

Conventional wisdom dictates that we should minimise the number of clicks required to complete any task on a website. However, in a world of broadband and Ajax I’m not sure that is always true.

I think the most important thing is to ensure that users feel they are making progress and that sometimes making them click a few extra times is the best way to achieve this.

While working on wire framing my e-commerce checkout process I decided to add an additional screen for users paying by cash, cheque or voucher. Without this additional step the experience felt jarring and left users wondering whether they had clicked on the right thing. The one extra screen provided them with the reassurance that they were heading in the right direction. In my opinion this was more important than reducing the number of clicks.

Cash payment Screen

Question conventional wisdom

The number of clicks is not the only conventional wisdom we should be challenging. It is easy to blindly follow supposed best practice without asking whether it is right for your site or not.

Take for example those “remember me” checkboxes you find on most login screens. I found myself asking whether a user needed to confirm their login if they previously checked this box. After all if they have asked us to store their e-mail address and password why can’t we automatically log them in?

Remember me checkbox

Ultimately we decided against this partly for security reasons (because we store credit card information) and partly because we felt it would just freak users out. However, even if you end up agreeing with the conventional wisdom that does not mean it should never be challenged.

Question the need for data entry

One detail that should always be challenged is the need for users to enter data. Nothing will prevent the user from completing a call to action more than being asked to fill out a form. It is really important that we challenge the need for every field that appears on our website.

A simple example of this is remembering data that the user has already entered once. For example if the user has been required to enter their e-mail address in order to recover a password they should not have to enter it again to then log in.

Note reminding me to avoid data re-entry

However sometimes you may wish to add additional fields so you can ultimately reduce the overall amount of data a user has to enter. For example we decided to ask users for their credit card type even know we do not need this data. This then allowed us to hide some additional fields like start date and issue number from credit card users who do not have that information on their cards.

Credit card type selection option

Question the “what if” scenarios

Another area of detail we all need to pay particular attention to is the “what if” scenarios. There are hundreds of these edge cases which need to be considered in any interaction flow and yet it is often left to the developer to decide what happens.

A good example of this occurred while working on my checkout process. I have to decide what would happen if a user tried to register with an e-mail address already tied to an account in. The easiest solution was to display an error message. However that leaves the user to work out what they should do next. Instead I decided to take them to the password recovery because if their e-mail address is already registered they would need to recover their password before they could login.

Note saying we should take users to a password recovery screen

Question your micro copy

Micro copy is one area where few questions are asked and details are largely ignored. Often it is left to the developer to throw together some instructions when more consideration and questioning is desperately needed.

Micro copy is a huge area and not something that I’m going to discuss in detail here. But in order to give you a sense of the kind of questions you should be asking, let me tell you about a single question I asked while designing my e-commerce checkout process.

The question was this: “should instructional text, buttons and links being written in the third person or the first person?” In other words should we be talking about “my order” or “your order”?

Eventually we decided that when we were providing instructions these would be written in the third person (e.g. “select your delivery address”). However, when the user was required to take an action it would be written in the first person (e.g. “deliver to my home address”).

Screenshot showing the various use of language we employ

Question how you can differentiate

How to differentiate your website from everybody else’s is a burning question that most website owners ask. However they often content themselves with just addressing this issue on one or two pages of their site (often the homepage).

I believe we should be looking for opportunities to differentiate ourselves in the details on every page of our website. As you are working on pages ask yourself the question “how can I differentiate here?”

While working on this e-commerce checkout process I used the fact that the company in question works through a network of local franchisees to personalise the experience. Throughout the entire process I named the local franchisee the customer will be dealing with and even provided a local number they could call. This is not something that their competitors could do.

Introducing their local driver

Questioning the desire to go with the simple (for you) solution

Finally I want to encourage you to question the motivation you have for the little decisions you make while working on a website. Are you going for the simplest solution for you, or the simplest solution for users?

It would have been easy to force users to register by creating a password, before they were allowed to place an order. However we knew users saw registration as a barrier to completing their main task (placing an order).

We decided instead of going the easy route we would automatically generate a password. However we knew that many users would not remember there are automatically generated password and so also gave them the ability to set their own password if they so wished.

Create an easy to remember password

Going the extra mile and paying attention to this kind of detail turns a mediocre experience into a truly exceptional one. It does take extra time but ultimately it will pay dividends both in the reputation of the web designer, the profitability of the website and the experience of users.

Become a web expert with our newsletter

Receive invaluable advice every three weeks and get two free video presentations for subscribing. You can unsubscribe in one click.

Blog Updates

You can follow all my posts by subscribing to my RSS feed or signing up to my email newsletter above.

Podcast Updates

Subscribe to the podcast via itunes or RSS. You can also subscribe to my quick tips via itunes and RSS too.

Social Updates

I am completely addicted to Twitter so try following me there. I also have a Facebook page which contains considerably less waffle.

Comments

Boagworld is a community, not just the voice of one blogger. You've read the post, now its time to get involved.