Look around the web, you’ll find them all over the place. MS-Word and PDF forms that you have to download and complete.  I would be forgiven for thinking that we have not progressed on the web since 1995.

I know I’m not perfect I have been party to this crime against UX as well.

We know they are bad, so why are we still using them.

Let’s Consider

You’re feel inspired to join a professional association.  The website seems pretty good, it lists all the benefits. There is a professional air about it.   You can see that some of your respected peers are already members.

The annual fees aren’t that much either, well within your budget.  You can see at a glance you’ll have no problem with your experience with the membership criteria.

The entire progression through the site has been seamless, almost as if the site was personally responding to your needs and wants alone. It’s been a pleasure considering joining this association.

So finally you press on the “Join Now” button.

The perfect reality is shattered. One brief sentence destroys it all -

“To Join simply download, complete and fax back to us the following PDF document”

This is not a little speed hump in the process.

Its a 10 foot wall!  This is a user experience disaster.

Completing a Form

Just consider what you have to do to complete the form:

1. Often the PDF form can’t be filled out online, or it just doesn’t quite work right.
2. Download the form.
3. You print it off.
4. Find a Pen, that works.
5. Fill it in.
6. Find a Fax machine or scan it.
7. Fax it, ensuring the fax has been sent.
8. Remember to collect your copy of the fax.

Yeap, it’s just way to hard.   Now consider, if we want people to complete the form why are we making it difficult.  Why indeed.

Pros

• Sometimes we don’t want a Form online.

  Over the years I have run into a good number of  agencies and corporations who deliberately go out of their way to make it difficult to complete certain forms.  They rely on the fact people don’t like to fill in manual forms to restrict the number they get. In a way they are burying the form and the associated process online so you will not complete it.

• Writing outside the fields

  A manual form can allow for those incidences that an online form designer didn’t consider.  You can write outside the fields, in the margins and the like.   You may have a small comment box online, but on a manual form it can be limitless.

• Easier to update

  Sure, you just have to update the link for the downloadable form.  However what happens if you don’t have the master document. Do you have to build the form from scratch just for a “simple update”.

• Easier to publish

  Yes the process of publishing a MS-Word or PDF form is an simple, one.  Just upload the form and link to it.   But consider the time taken building the form and getting it looking the way you want it.   These are the hidden costs.

• No special software or skills required

  No special software is required.  Most businesses have a MS-Office installed. Hence building a form in MS-Word isn’t that greater task.   No real specialised skills like “web design” are required.  It doesn’t take that long to build them either as all the pesky interaction component has been removed.

Cons

• People are lazy

  We known that people are naturally lazy, they aren’t going to want to fill in a manual form at all.   Maybe it reminds them of an endless victoria bureaucracy of hideous  forms.

• Easy to add a CMS form

  With a lot of CMS these days there are modules or plugins that allow the admin person, with no special design skills, to easily put together a form.  These forms often have all the interactive elements such as error messaging and the like.   All they need is to be styled correctly in the first instance.  They also usually come with default styles anyway.

• Electonic records

  Provision of an electronic record, whether or not it is in a database allows for easier access to the information, and an increase aspect of data manipulation now or in the future.

• Data validation

  You can ensure with filters, and data validation that the data you get from an online form is pure and the best it can be.   This is very hard to do with a manual form.

• No double entry

  It’s simple with a manual form you have to enter the data, manually type it into a computer system or at the very least scan it and use an OCR package on the result.   This all takes time and resources.   Also what do you do with that extra long comment that is too big to be collected and entered into the database.

• Easy to development a custom form

  Years ago designing and developing a form for a developer was a long process.   But today with frameworks, form generators, specialised form tags and the like it is possible to build a form in a tenth of the time.   This really eliminates the complaint of it taking too long doesn’t it.

• Cost effective user experience

  Overall if you look the process, sure building a PDF or MS-Word form may appear initially to be cost effective, but if you consider that it’s just not going to be what people are expecting.   You are going to loose potential transactions with an manual form.  They have started the process in the online world of the web, they expect to complete it there simply and efficiently.

Next time a client sends you a PDF form or worse a MS-Word document to be placed on a site as a form. Stop.

Have a chat with the client, discuss their real needs and the purpose of the form.   If they really honestly want people to complete the form then realistically it has to be online.

I have been involved with many user surveys over the years. Some have gone well. Some have been a complete waste of time and effort. The main distinction between them is the surveys that were professionally developed and pretested would succeed. The ones that had been knocked together by a well meaning manager were often destined to failure.

It comes down to this – unless you have experience designing surveys, then it’s best to either hire someone who has had experience and training, or find another way to collect the same information.

Proceeding with a flawed survey will just produce results that are tainted with bias and other data warping horrors. Not something you want in your user research, eh.

Survey Design Tips

Now I know some of you are going to be forced into running surveys despite my advice.   That’s okay, business is like that, sometimes you have to compromise.

Better that you at least know the pitfalls and can correct them as need be. So here is a list of tips for online survey design that you may find invaluable:

• Survey Objective

  This may sound really silly, but you have to know what the survey is for and what it needs to achieve before you start. Otherwise you will get side tracked asking meaningless questions. For example you may want to find out about the user demographics, their preferences, and the users needs and wants.

• Keep it Short

  There is nothing worse than an online survey that seems to go on forever. Asking page after page of questions. When you are putting together questions. Stop and think. Can I get that information elsewhere.  If you can scrap the question. Similarly if the question is not directly related to the goal of the survey.

  The point is to design a short sharp survey someone can complete in under 5 minutes. I don’t know how many online surveys I just abandoned after about 5 minutes, it must be in the hundreds.

• Tell Me How Many Pages

  Your respondent’s time is valuable, they are doing you a huge favour filling in your survey. Respect that. Just like you minimise the number of questions in the survey, it is also a good idea to let people know how many pages they have to complete. The best way to do this is to  display an indicator of their progress.  This will have a negative impact if your survey is too long. However  it will have positive one if the survey is short.

• Let’s go Back

  Again this is a simple issue, let respondents navigate forward and backward (not via the back button) in the survey and review their answers, if they so desire. Remember the respondent is doing you a favour, don’t make it hard for them.

• Its About the Design

  At the end of the day all the information you’re gathering about the users will be applied to the design of the web site. Be that on a visual, informational or interactive functionality level.  It follows that when you include a question you should ask yourself – “Is the data collected going to influence the design of the site.”   If the answer is – No; then remove the question. Now it’s not a hard and fast rule, but still one you should consider.

• Say No to Checkboxes

  I know you might love them, but a checkbox is just a bipolar field, yes or no, on or off.   You will get a higher response rate if you present a checkbox as a series of radio buttons with a yes or no response.   It’s instantly clear to the user what response is required. Also you have the advantage of taking up more visual space and hence avoiding the question being missed.

• Say No to Select Lists

  This is interesting, as I have discussed earlier, certain demographics have an issue with realising that they can scroll down the list and pick the unseen items on a single line select list. A good way to avoid this issue is to use radio buttons with a multiple choice layout.

• Add Some Other

  When you put an alternative list of multiple choice items in a survey, how can you really be sure you have all the possible choices. I have always found it’s a good idea to allow for an “Other” field and have space for the respondent to fill in their alternative.  You usually discover you have missed a few alternatives I find.

• No Response

  It’s a simple thing, but it’s a good idea to have the default setting for any multiple choice items to be “no response” that is when all the fields are not selected.  I would also consider adding a “not applicable” or the like,  response as well. Mainly because there can be cases when the respondent has no experience with what you are asking.

• Getting Likert Scales Right

  Likert Scales are those multiple choice responses that go “Disagree 1 2 3 4 5 Agree” . Now these are very good at gathering information where there is going to be a distinct difference of option. However the result of a Likert scale question is not a series of interval measurements. But in fact it is just a scalar representation of extremes from agreement to disagreement (in this case).  When using a Likert scale it’s a good idea to have a mid point (odd number of values) to allow the measurement of the common mid point.

  ALso if you are measuring a very subjective issue.  It’s  a good idea to label all the scale with the equivalent labels to help remove any bias or misinterpretation.

• Pretest the Questions

  Writing survey question is something you have to do carefully. Respondents will attempt to interpret your questions. And subsequently provide you with the information they think you are expecting to get. Also they will try and determine how you are going to use their answer and respond appropriately. This leads to bias in the results.

  The way to avoid this is to pretest your questions. A pretest will tell you the questions that are always going to be skipped, give similar answers, and questions that are just confusing or misleading. Just like we user test, so we also need to user test the survey as well. Ironic really.

• Stop Question Skipping

  It’s simple your respondents will skip a question if they don’t understand it, are confused or just plain bored with a your too long questionnaire. The solution is keep it short and on topic and ensure the questions are not confusing.

• Multiple Choice Order

  Ordering the multiple choice responses is very important.  However if you put the responses in their natural order (high to low) or just listing them as you think of them is dangerous. This presents bias to the respondent. Who will select that response that looks like it is the one you want.

  What you need to do is scramble the responses. Still,  expect some respondents to lean towards selecting the first or last items as they see these as the important ones.

• Duplicate Answers

  The arrangement of your questions can have a great influence on the responses.  If you put too many questions that have a similar response or layout together (especially multiple choice). You will get a leaning toward the same response for all the questions. You have to vary the responses and keep the respondent on their toes. However you don’t want to confuse them. So mix it up a little.

• Leading Questions

  This is something you would think wouldn’t be happening in surveys, but it still does. The use of leading question is still an issue.  Ensure the words you use don’t imply any unwanted  response.   and that they don’t point the respondent to any sort after response. I have always found that open ended questions like those in an interview are the only way to go here.

• Ambiguous Questions

  Supplied responses to questions need to have no ambiguity in them at all. Remember what you interpret as meaning one thing, someone else will see if as completely different. It’s recommend that you ensure that all supplied responses are 100% rock solid in what you want them to mean. Use the contemporary language and terms of your audience, also avoid verbs that have a double meaning.

• Negative Questions

  The use of negative terms in a question is not a the best solution. In a lot of cases people will mis-read the question as an implied positive. Which will give you a completely skewed dataset. The simple solution is just to present all the questions as a positive outcome.

  If you really have to use a negative, a way around this is to highlight a simple negative  like for example – NOT. Just bold and capitalise it.

• Getting Ranges Right

  When you ask about a range or the like, don’t imply a level of use for a response. As the respondent will just assume you are looking for answer within this level of the range.

  For example. “How many times do you visit our site a week:” this is bad, it implies you must visit at least once a week. Where as “How often to you visit our site:” is a better alternative as it leaves the value ranges to the supplied responses.

  Pre-testing on the supplied responses will also give you a realistic response range as well.

Now this list is by no means complete, what additional pointers would you include as UX professionals?

You have built the perfect web site, the colours invoke the right emotional response, the visual imagery leads customers to the relevant information while allowing the audience to personally relate to the site. The content is ideal for the web, not to much but enough to convince people of the service. The major call to actions are in the right locations, and easy to find. Everything is set, the web site is ready to take on the world!

Still no matter how perfect your site is, if the  last step, when they encounter the web form, isn’t streamlined and usable, the rest is a waste of time.

The other day I ran across a web form that was failing, it was suffering from a series of issues that would basically make most users stop in their tracks.

With any identifying markers removed, I would like to share with you some of the issues of this form, and a few simple steps to fix them.

The Form in Question.

The form was being used for membership of a professional organisation, it is broken down into three sections (fieldsets in this case) The Personal Details, the Payment Options and the Acceptance of Conditions, these are presented here, for clarity I have separated them, but normally they appear on one long form.

There are a good number of issues with this form, I’m not going to cover all of them, but here are a few of the common issues:

• Number of Fields  - Only What You Require

  I have a major beef with forms that are just way too long. You know the ones with an endless list of fields.  Clearly this one falls into that category –  when you first encounter it you are filled with dread at having to fill it out.

  You should consider every field that you put in a form to be a major stumbling block for anyone completing it. Research has indicated that people naturally hate forms and the like, as they slow them down to getting to their goal on the web. When you designing a form this long (with 38 fields) you are not really respecting your users time.

  Consideration needs to be given to what is the bare minimum to identify the person joining. Everything else should be removed. If you really want the extra informaiton there are ways of encourging people to complete their online profiles later on.

  Trying to capture all the information for a person at sign up in the worst possible time. People are hesitant, and still deciding on the your website.  A long form is just going to convince them you are a little bureaucratic .

• The Need Print out of the Form

  I do know that in some cases long forms like this are developed so people can complete them, print them off and fax, not ideal, but people do it. What needs to be provided is a fax back PDF form or the like. This should be presented on the same page as the online form –  preferably at the top of the page.

• Fieldsets and Grouping

  Yes the form is broken down into three sections. Sections 2 and 3 are reasonable, it’s just the first one that is a little long. This can be improved if it had been segmented into personal details, work details and joining information.

• Help

  With this example there is very little inline contextual help. In today’s interactive web, people are starting to expect to see contextual help boxes appear when they tab or focus on a field. These can be alternatively just be accessed by clicking on an appropriate  help icon (a question mark maybe). Semantically of course you place this information between the  fields and the associated label.

• Encouragement Along the Way

  Currently there is no inline encouragement on the form at all.

  This is a simple thing to put in place; for example every time a user completes a field or an information block (like the BSB / Account Number pair) they get an acknowledgment for their actions that appears inline on the screen. This could be a small tick, thumbs up or the like – appearing near the relevant field.

  Using this type of positive feedback adds a degree of trust that the organisation cares about the information it is collecting, as well as a sense of achievement and sense of completion for the user.

  Use of this technique can also be extended to inline validation of the form, hence providing instant feedback for any error as well.

• Create Steps

  Even if we removed all the redundant fields  we still have a form that is visually way to long.  In this case we are better of presenting the fields  in distinct groups of related information, one at a time.

  You would present it as two step process –  step one personal details and step two the payments, with the terms and conditions confirmation tacked onto the final section. Of course you would have an indicator showing the users progress through the various steps.

  As the user processes the form the indicator would show where they were up to in the process.  This step wise process allows one to segment a long process into several short chunks that users are more likely to undertake as they are progressing towards their final goal in manageable steps.

• Date of Birth

  There are different ways to ask for the date of birth, different  layouts was work for differently user audiences. It has been shown that it can be easier for some users to select a date of birth from three drop down lists than type it in the format you require.

• Clear Labels

  The labels on a form have to convey  instant meaning for the user, and yet still remain personal so they can relate to them.  The order and grouping of the fields should also follow a logical sequence  (as recommend above).  Labels such as “Optional” mean nothing to a user.  With a field like this, people may not even complete it, after all it’s optional.

• Add White Space

  From a design view point all the yellow fields do wash into one large yellow mass, they would be a lot clearer and easier to read if there was a some white space between the fields. It’s a simple thing, but cramming all the fields up together doesn’t help, if anything it makes the appearance of the form even more intimidating.   Remember white space is your friend.

• Avoid Multiple Columns

  This is one that has been debated quite a bit – should you use multiple column layouts on forms.

  Research has indicated that users really like to just run down the page filling out blocks of information as fast as they can. The don’t like shooting across a page to complete a postcode, like in this case.  However having blocks of fields like the BSB and Account Number field close together is acceptable as these are taken visually as one block of input.

• Terms and Conditions

  Use of a check box to confirm agreement is really redundant if you think about it.  Often these checkboxes are put in place to keep legal teams happy,  teams that usually don’t want the form on the web in the first place.   The checkbox sometimes is also seen as a substitute for a signature.   Still there are improved ways to approach this requirement.   If the agreement is required what can the user do,  join and not agree.  No.   The user has no choice – they have to agree or leave not completing the form.

  Sure the statement can remain, however a better approach would be to have the join button saying “Agree and Join”. That way if you don’t agree it is very clear that you can’t join.

  Using a required checkbox field just forces the issue, frustrates the user, and makes them feel a little like they are being railroaded into agreement.

  Also what if my browser produces a cross not a tick  in the checkbox,  labels like “Tick to accept terms” should be more generic.

• Final Submit Button

  The final submit button, should be easy to find visually and  be in line vertically with the input fields.   This allows for an easier path to completion.

  However on this form it is like it has been tuck in the corner, with a little reminder that seems like an apology. It’s almost like the form is saying – “Sorry to pester you, but if you just click you can join”.

  This doesn’t really fill you with confidence that your membership application is going to be taken seriously.  The submit button should be a big bold statement.  After all you want people to join.

• Processing the Form

  When I tested this form it was something of a shock.

  I just wanted to see what the validation and error handing was like on the form, so I submitted a blank form, expecting to get a screen filled with error messages. That’s not what happened. I was returned with a list of processed fields, which is fine if you have completed to form, which I clearly hadn’t.

  It is really important to validate the required fields at least, check for bad email addresses and the like, and return an error message, preferably near the relevant field. Ideally you should validate inline as the form is being completed and recheck server side when the submit button is pressed.

Accessibility issues

A quick review of the accessibility on the form indicates that it’s no that bad, fieldsets and labels are correctly used, tab order seems fine. However a few sticky points are present:

• Requirement Indicator. The indicator for the field requirement is presented after the field, this will be an issue for some people as they will not be aware of the requirement of the field till after they have moved past it. This should have been placed semantically between the label and the input field. Presentation wise it could remain after the field.

• Data Formatting – The use of data types formatting and hints in the input fields themselves can be an issue, especially if the JavaScript does not clear them.

  After all the user may not have JavaScript turned on.

  It is better practice to present these hints semantically before the input field but after the relevant label.

  Also consider from a usability view, when a user has moved into a field the context of the requirement is lost and can’t be referenced.  This information should be presented anywhere on the form  as long as it’s in close association with the relevant field, and not in the field itself.

• Field Labels – All fields should have labels, even if you don’t want to display the label. There are ways to hide them, but from an accessibility view point they are very important.

Something to consider

Now I have no idea if this has been done with this form or not, still I recommend with a form like this that  you:

• Produce Prototypes

  Using Prototypes would have allowed a development team to work with an interaction designer to produce a form that was within budget and still easy to use.  Any prototypes could have been tested and fine tuned with the respective audience to determine the best completion and conversion rate for a relatively low cost.

• Some User Testing

  Finally user test on a iterative developmental proccess with the final form to produce the best outcome could have been conducted on all of the above points.

Remember

A badly designed web form is like putting a roadblock in the way of your users  - this is something you really want to avoid.

I know there can be internal issues from legal departments, IT, reduced budgets and the like. Still consider if the form isn’t that usable, less people are going to complete it.  Sometimes having a bad form design can be worse than no form at all.

The more friendly and easier to use a form  is the greater conversion and completion you going to get.  Simple really.

Just think about these points next time you’re designing a form.

I’m seeing an interesting trend here in Perth. Recently,  job adverts and recruiters looking for Test Analysts to do usability and accessibility testing as part of their duties. Now this is a good thing in a way.

At least the traditional roles of the IT software project are understanding the need for usability and accessibility testing in web and general software projects. I guess something is better than nothing, right?

Well maybe not.

Traditionally Test Analysts are inserted into a project to test software code and specification compliance, usually via various automated processes and the like. Whether the SDLC of project is agile or waterfall in nature, they still have a part to play. However they work is at the end of a productivity cycle, after the run of the development / design team.

It is interesting to note that the type of testing techniques listed do not mention the usual usability testing methods that a usability professional would employ. There is also no reference to using the users of the system as test subjects. It seems that the Test Analysts has to play the Expert Reviewer card and use their wealth of understanding of the usability and cognitive process the users will go through to evaluate the system.

This is a waste of time!

Unless the Test Analyst is a usability specialist they are just going to be wasting everyone’s time and money. Yes they are looking at the issues, but this is really just like making User Acceptance Testing = Usability Testing – and we all know about that old chestnut.

Getting a User Experience professional on the team, even just part time, would produce better results than having the Test Analyst cover off the usability and accessibility issues to save a few dollars. At least the UX professional would examine the issue holistically throughout the run, not at the end.

Point to note there is also no reference to User Research or the like, just a reference to supporting business requirements.

Another case of the industry just not getting it, maybe? I suspect that the terms usability and accessibility testing are being dropped in, a bit like a form of buzzword bingo.

Now people tell me, especially Test Analysts, is this just happening in Perth or is the trend across the Australian job market and beyond?

You know in accessibility circles we are constantly telling people using drop down CSS menus that when the menus are not visible  we shouldn’t be using display:none to achieve this.   We all know this one, right.  Just to refresh your memory, remember the display:none rule takes an element assigned right out of the picture completely,  for anyone using a screen reader the assigned content will just not “exist”.

This is all well and good.  Well that depends, maybe there is a case for the use of display:none afterall.

Sometimes we forget about the bigger picture, about the people we are building the sites for.  A few weeks ago at the UPA Perth (chapter in formation) meeting, Teressa from the Disability Services Commission demonstrated with her screen reader (JAWS) why the display:none is sometimes a good thing.

The Issue

Normally for a drop down menu you would code it as a unordered list as below, note I have removed the links for clarity:

<ul class="menu">
        <li>Home</li>
        <li>Products
           <ul class="submenu">
               <li>Sexy Product </li>
               <li>Highest Selling Product</li>
               <li>Mega Cool Product</li>
           </ul>
        </li>
        <li>Services</li>
        <li>About</li>
        <li>Contact</li>
</ul>

And you would use CSS menu based techniques (with a little Javascript for legacy browsers) to generally display the lower  menu (assigned the class submenu on the unordered list).  It follows before the menu is activated it would be hidden from view with the use of the following CSS that still makes the submenu content readable to a screen reader.

.submenu {
    position: absolute; 
    left: -10000px;
    top:-10000px;
 }

For those who are not familiar,  this rule pushes the element outside of the normal document flow visually – to the far left and up beyond the normal visual screen.  However it is still on the virtual screen, so it can be read by a screen reader.

It follows then that a screen reader will be able read all the menu items even the lower level ones and hence the user can transverse at their will round such a menu system.   Which is a good outcome, right?

The Downside – Information Overload

However consider not just a simple menu system (above), but say one from a government agency  consisting of  maybe hundreds of items.  Now think about  having to transverse such a menu.  To deal with those hundreds of items being read out.  As Teressa put it -”It’s just information overload”.

Unknowingly we have subjected our users with disabilities to a massive amount of information that even we are not subjected to.   You see even we see the the menus in chunks, bite sized pieces that we can mentally digest as they appear on a mouse or keyboard action.

The Solution

It’s really a simple thing to fix.  We just use display:none to hide all these large lower menu systems as required.  This means that they are no longer visible to the screen reader at all.  Which is exactly what we want.

.submenu {
     display:none;
 }

To supplement this what we should be doing is using progressional enhancement of the navigational system.  At the very least we should be  having the relevant  sub menus presented on the parent page or related sibling pages as a separate menu list.   This way anyone with disabilities or the like using just the top level menu buttons will still be able to navigate around the site.

So when we have way too much information on the CSS menu, maybe it’s time to consider an  alternative and remove it from the sight of the screen readers altogether. Forcing the navigation of the site by the regular page by page chunks of the menu navigation.

As you would expect this all comes down to testing with real people, people with the disabilities that you are finding solutions for.  You see sometimes with all the good intentions we think we are doing the right thing, but it turns out to be otherwise.

So what instances of disability best practice have you found to be a hinderance to people with a disability?

The other day we came across a web site that  shows all the things that are wrong with a good deal of e-commerce sites on the web.

A little background, we were looking for education books for our youngest child -  so why not look online.  You  know, from the convenience of our own home and all that.  So on  the recommendation of  a friend we went to a local publishers web site.

This site in question does children and adult education  books, judging from the home page I would say that they are focusing on an adult market, from young parents to grandparents.

The first thing you see on the home page is a large screen filling advert, that proclaims in large text  ”Real Sex for Real Women”.  I can tell you this does make you do a double take.   Anyway we could see a small “Children’s Books” menu item so all was not lost.  But it doesn’t put you at ease, after all we are looking for kids educational books, not sex guides.

Onwards with Sex Guides and the like

Down the bottom of the home page we find a drop down list of the major catalogue sections, nicely divided into adult and childrens books.   You would have expected when you select an item you would have been taken to the relevant page.   Well you are partly right.  Not knowing what section of the kids books we needed to look in, we select to see the whole children’s catalogue from this list.  What happens next was off putting

You are sent back to the top of the page instead of to the catalogue as you  expected.   Again you are presented with the ”Real Sex for Real Women” advert right smack bang in your face.   Makes you think, “oh the kids section is in the adult sex section, do I have the right web site”, not the best experience so far.

The problem here is the select list options have been used as headings for sections on the list instead of using the correct optgroup element.   After working this out, we select one of the correct sections, only to be presented with a PDF document, that just has a few pictures of the books concerned and very little in terms of information we were looking for in the first place –   like what the book is about, the price, the skills sets it covers and so on.

Stabbing in the Dark

So back to square one, we end up via that small menu button in the children’s book section.  It’s  clever that the books are all hidden this way, it makes finding them interesting.    The books are  presented as a long list of books by title in descending alphabetical order, all 700 odd of them over 36 pages.   It’s not as you would expect segmented into alphabetic groups, but just pages 1 to 36.   In this case we know the title, but it’s still not  very handy for finding that book you are looking for.

After a few blind stabs in the dark at finding the right page, we are able to locate the right book, and we are able to display all its details that we require on the page.  This is great, we have found it, and it is perfect!

But…

Now we just want to order it.  so we look and look, but there is no “order” or “add to cart” or “purchase” button anywhere on the page.   We have come all this way, through the depths of the darkest library  to find this magical book and now we can’t get it.

However..

It is then we notice that there is smaller menu item labeled “ordering”. Surely this will solve it all.  But alas we are gutted, there is no shopping cart, no e-commerce system.

Just a manual form (print and fax) for orders over $100 or a recommendation to visit other online stores to purchase said book or better yet go to a bricks and mortar bookshop.

After all this effort, they had our trust, we searched out these books against all odds of the poorly designed  site and the bad experience, but still after all this we are told to go elsewhere, we are not wanted, we are cast aside.   Bad taste is a bit of an understatement.

What should have been done

In this case it is all about findability and a good user experience.

It’s not about  being impersonal, cold to busy thrusting the latest sex guide in your face.  It’s about gathering and nurturing your trust.  Okay this was a publishers web site, but that does not excuse the bad experience, and sloppy web site.  So what would have helped:

1. The separation of the Adult and Children section up front would be very handy, they is focusing on two markets, so why not funnel the user in that direction, gather their trust of the publisher by presenting the focus books that the person is looking for.
2. The correction of the navigation and page findability are minor technical issues, but still they should be addressed. Just like  a real life bookshop, make it easy for me to find the books  and I will browse and buy more.
3. The killer aspect is the lack of any e-commerce system.  Now I can understand that the publisher doesn’t want to disrupt their old school distribution channel, but really this is 2009.
4. It would be nice to have a list of available stores for each book on the book information page.  Ultimately there should be a shopping cart system and a way to purchase the books.  This would be good,  it  locks me into the sale, and the publisher doesn’t risk that I will find a competitors book that maybe be better than theirs and I end up buying that instead.

Mirror the Bookshop

This site should have been like a good bookshop.   I don’t know about you, but I love a good bookshop.   Note I said bookshop not bookstore.

A bookstore is impersonal, cold  stacked with best sellers and not much else, staff that are just killing time, everything is about sell, sell, sell.   Sadly in the city I live in,  it is mostly filled with these types of  chain bookstores.  I hate them.  Sometimes they are the model for online bookstores.  The bad experience is usually just transferred to the web.

On the other hand a bookshop is personal.  I can spend a whole day just browsing around the many topics that are available .  The smell of the books, the ink, the colors, the texture of the covers, the vast amounts of information and the volume of untapped ideas.   Things are logically organised, it’s usually easy to find things, even in a large store.   It’s somewhere you can trust, like an old friend.

Overall it’s about building and maintaining trust, and building that bookshop experience, but online.

So many times I find local publishers or bookstore sites that seem to fail to achieve this.

Is it budget, is it lack of vision, lack of user research, testing or just a lazy developer.  Maybe it’s all of them.  Can’t business owners see that for a small outlay they are easily find out if they are presenting a good or bad user experience.

So why in 2009 are sites like this still being produced?

I don’t know about you, but this is nothing new, For me the User Experience of a web site has always been more than the usability or achieving the sites business goals. Some say that we should be telling a story or translating those magical moments in real life onto web. Now in order to do this I would have thought it was a given that we have to engage with people on an emotion level and build trust. After all a good deal of our experiences are at least tinged with our emotions. We are after all emotional beings.

Yes, the influence of emotion and persuasion in the equation is plainly beyond usability.

Eric sees persuasive design as:

…designing for persuasion, emotion, and trust… basis in a deep understanding of customers’ subtle emotional triggers and employs a rigorous set of new, research-based methods and techniques… it is fundamentally more qualitative, deep, and subtle than usability….

As Eric points out there is a distinct need for the ecommerce sector to overcome the traditional marketing model that is currently being churned out with the more understanding the UX focused emotional driven model.

But really this is nothing new also, look at modern real life retail, that is what it is all about now, the overall experience. For example take an exclusie clothing store, the place often has a refreshing smell, with relaxing music, the clothing is placed for easy access, the sales assistants are helpful, but not pushy. Nothing is too much trouble. You feel relaxed, at ease, among friends, there is a emotional synergy, a trust. However false this maybe, the emotion sell is still there. So why should the web be any different, granted the web can be a little old fashioned and behind in some areas.

Still a web site should be designed considering the user and their experience with the site. Isn’t it a given, that you want the experience emotionally to be a good one, one that will build a loyalty, a degree of trust.

So it follows that by engaging with people emotional with the user experience of the web site will, if done right, have some persuasive influence on the final outcome. Ethics on the matter aside. Hasn’t this been the heart of UX all along.

What do you think I’m I right, or is this persuasive design the next big thing?

After a workshop with Andy Budd yesterday and an evening with the WSG, it was time for Web Directions User Experience 2008 conference proper. With a packed out the Melbourne Town Hall with a focused not a the general web process but the user experience.

Andy Budd – Designing the Experience Curve

Initial and end experiences are the ones that are memorable.

Negative experiences stand out more than the positive experiences

We don’t have experiences in a vacuum, they are supplemented by the previous experiences

References to Hierarchy Needs. Online experience is not at as intense and positive as the off line world. Often they are just barely functionally adequate.

First impression really do count. they set the expectations for the experience. It can be easy to get the experience wrong. Visual impressions for attractive people, products will entice the consumer. The same can be said for packaging, for example for an Ipod. This is a little like geek porn. WTF!

Games slowly builds up the game play functionality layer on layer. Show them the functionality to get them excited.

Newbie overlaid help functionality and explanation of the screen items.

Attention to details is important, this makes the experience more seamless. Car door sounds, and smells, are part of the experience.

Personalisation and Customisation can be very powerful in the user experience space.

Game and online world customisation of characters and avatars in the online world. People react to small amount of peronalisation and feel locked into a online community, they will tend not to leave the community as there is a degree or loyalty.

customisation of standardised drinks at Starbucks,

Small details, can be use for a delightful experience. Personality in the experience is important.

Constant feedback on the experience is very important. rewarding that you are progressing in the experience via the use subtle cues

Learn from real world experience and transfer them to the web.

Tell people what point they are up to at an point in time – eg Kayak

Point of failure is the best opportunity to make positive experience.

We are programmed to collect and explorer. People like to collect, but leader boards can produce a negative effect.

Pull holistic experience from the real world into the web experience. Negative experience is just a lack of a positive experience.

Andrew Kesper – ABC Election Site: Making the most of the dry data

Needed to revamp site to latest environmental specification. Resused existing solutions, just restyled them, this allowed focus on not tools for interactivity.

Use video and audio elements, the interactive prediction calculator, live news feed, and interactive focus on changing seats.

7000 hits per second, 10,000 plus connections. Flat files with flat server side includes, quick and simple as possible. High usage of flash and javascript. One css and Javascript file, cached, the allowed for.

Used inner-html to insert a table row and render changes for the house of reps calculator. Used Yahoo JS library.

Used GMap component using Google maps API with Flash. API allowed overlay of Flash movie, allowing for zoom in instead of using the vector coordinates, Flash maps accessing same XML files. Wanted to use Google Geo code, cross scripting problems, finally used scripting tags feed to web page then to flash element.

Animated bar charts. – use javascript with manual onload event firing at end of page, used pre width determination.

Donna Spencer – Getting Content Right

People like to be user centric with in a social. People learn well from a narrative.

Figure out the Whys, who cares, so what of the content.

It’s about focus on the customer not your needs. You are not important.

Content needs to have voice, voice that will engage and promote people to read the information. It has to speak to the audience and feel like there is degree of care.

Ensure that the voice is one real voice. Avoid the content to be written by committee. Write as you speak, make it a conversation with the reader. But to do this you really have to find your voice.

Show and Tell. Now that is not diagramming, images graphic, Writing it, but remember a picture says a thousand words. Illustration can sum up the information within seconds.

Donna then illustrated these principles with the rewording and restricting of the content.
Really focus on writing like you are having a conversation with the person reading the page.

Creation of persona for the web to encapsulate consist voice. Place persona into style guide, words used, examples of content and approach.

Me thinks Donna is become a bit of a Petrol Head with all her TopGear passion.

Technorati Tags: wds, wds08, wdsux, web+directions, conference, US, user+experience

At BarCampPerth 2.0 stepped up again and presented. This time I wanted to push things a little, well a lot. I didn’t want the standard presentation. What I wanted was something entertaining with a defined takeaway message.

Now I really wanted to focus on an introduction to User Experience. But that can be a very dry and lets be honest, boring topic.

So I opted for a thematic talk following an information journey. The slides are on slideshare. There was a video recorded, so we shall see if it is encoded, if it is, it may give you a better insight than the transcript and slide set.

Disclaimer

The views, side comments and delivery method of this presentation do NOT reflect the views of the author or presenter and where included for entertainment value only. If you are offended by adult only content and views proceed no further.

| View | Upload your own

My World

This is my world. The world of the back alleys, the dark dingy bars.

The girls looking for their last few johns for the evening.

The stale odor of the last cigarette and the tack tack of the sticky beer carpet underfoot. This is my experience.

The cars, the girls, the guns, the good times, the bad.

This is me, – Vince (Vinny my friends).

This is my tale. I deal in “User Experience”. It’s my trade.

I run a number of businesses for m’ boss, Sol. Now Sol is good boss, can’t complain. You just have to look out for his right hook and love of new shoes.. if you now what I mean.

So Sol calls me into the “office” the other day.

Vinny, my boy I have heard there is something new on the streets. Something we need to get onto. I need you to find out about this “User Experience”. Go find me the secret to this user experience before the Fenchenso Brothers do.

The Mission

So I have been out on the street researching this “User Experience”, and well because I feel I can trust you, so this is what I know.

This user experience thing it seems is all about the users. That’ll be the clients and the johns, the users. They are, it seems important, seems without them we can’t have a family business.

Now I’ve been thinking on this and well. seems right to me. We like need the clients. Gotta have someone to protect. Need the punters, the johns, hey they are bringing in the cash, right.

They say this user experience thing has to be a good one.

But I just don’t know about having to be friendly with them and making things pleasant and nice. A good user experience.

I mean lets get real, some of my clients like to be scared, they understand, fear is good for them. So I suppose that’s a good experience overall. Better than having a conversation with Billie the Bat.

So with these users I guess we need them, as they let us know about the important factors:

• Like the business needs
• And their user needs and wants.

So with all this user experience I have found that it is all emotional with lots of this Psychology stuff . Seems the emotions like

• Fear
• Lust
• Desire
• Greed

These are all good. They are a good user experience.

More User Research

But Jerry, he’s Sol’s bookeeper, tells me research is important too.

He says I have to research and get to know the users more than just a few chats.

Seems that doing this research, getting all cosy with the clients, johns and punters then we’ll get to know them better.

So I just send Justine and Rhonda out to get all close with these users. That worked a treat. Yeah this research thing is easy!

You know what I found out,

Most of the time its not secrets, just lots of whining about things not working, about this is too hard, this is not right, whine, complain, complain, bitch…. bitch. This and that!

Glad I asked the right questions during this research. Cause now I know that we just have a bunch of “whining arseholes” for users.

Seems the right questions enable me to stop us having problems later. See I was able to cut of the problems before they started. Sent Billie the Bat to visit them. Now they are having a sweet user experience. Just what was ordered.

So this user experience thing isn’t easy, you have to be skilled in a number of areas. But lucky I’m multi-dimensional. I can understand all about the aspects that it covers.

Making the User Experience is like making good lasagna, you build it up layer by layer, emotion on emotion, experience on experience. So people can understand what is expected.

Yeap like the good lasagna mama used to make.

But then some ponce on this intraweb thing tells me people don’t want a user experience.

That it should invisible.

That the best customer experience is one that people don’t know they are getting. Like it’s an experience not to have an experience. like an experience by stealth.

I tell yer this is getting confusing.

Now hang on I’m sure Justine and Rhonda would be a little upset if their customers didn’t get an experience!

This just seems, wrong, So you I suppose what they mean is you have to experience Billy the Bat to know what’s a good experiencing.

They say that people just want to find information and stuff and be able to use it easily, with little experience. No experience that is invisible, by stealth after a “sweet” experience

Now that I’m totally confused, So I decided to go do some more research with Billie the Bat and few friends.

So what is a Good Experience

Turns out it’s a lot more. After a few conversations down the dark alleys I have the secret. The secret to this user experience. People it seems have been hiding it. Damn those Fenchenso Brothers.

Now I don’t know if I can trust you. So I’m just going to remind you, there is Billy and maybe you need some new shoes.

So can I trust you.

Well it seems this all about this user experience not being a Science, It’s an Art. Now I like me a bit of the arts. The Mona Lisa, Elvis or Superman (the american way and all that).

This Experience it seems is all about being

• Useful

  Seems we have to be useful, innovative in our solutions. Honing our skills to find creative ways of doing things.

  Well I love I little creativity, a little flair for the different. So I’ve taken up golf too!

• Desirable

  Things must be desirable. We have to appreciate the the ways things look and make them even more appealing.

  Well der. I think we all know that! Lust and money, sex sells. The Family has that one nailed. No work needed there!

• Valuable

  The user experience must return a profit. It’s all about the business needs. But also making the customer satisfied.

  I don’t know about you but this Experience thing is a just easy. Everything we do is about profit. And really our customers are always satisfied, I never hear a complaint twice. Which is good, eh.

• Accessible

  Its good business practice to allow for the disabled and make things easy for them. We have to make the places accessible to them.

  At first I was, why!

  But then I get to thinking, well, their money is good too, and most of them are loaded! So we’re going to be accessible in all our business now.

• Credible

  Then things are presented to people they have to appear credible.

  So things have to be credible, Liek the mother church, any one disagree! There are guidelines for this it seems. But Don’t need them.

  Well again, we have been doing this.

  All our businesses are on the level, we paid tax once. It’s all very neat and orderly, and what you see is what you get. I just don’t see that the problem here.

• Findable

  Things, like people and information and stuff has to be findable. This is so users can find it when they want to.

  Okay I can see this.

  When the john, wants a girl, she’s there.

  If our clients need to reminded then they can ‘find’ us.
  Need to get some extra stuff, we have people on the corner.

  That’s what they call good findability. Yeah, good navigation, navigation to the source! Navigating the user to what we want.

• Usable

  This is important, they say, how you do it and opinion of the people are helpful in making things usable.

  Well, that’s a given, if you can’t use it, what good is it. Client can’t use the stuff, then its a problem.

  If it’s there problem its my problem. And you know you have a solution to all this. Fix the problem with Billy the Bat.

The Team

So I looked at all this and reported back to Sol.

Sol looked up at me:

Vinny, So now you have the experience. But you don’t have the soldiers, the team the team to deal out the experience.

So now I have only a few hours to assemble a team, so you being people in the know, peeps of the streets. You will help me. eh.

So you know nothing! Your not working with the Fenchenso Brothers are you!

So What skills do we need in a team

• Information Architect

  Seems I need these peoples to organise the information, helps the users find what they want. So I need someone good with locating things or organised.

• User Researcher

  So we know tis, gotta go talk with the uses, get the information outta them, you need someone with lots or people skills and bend the users to our will.

• Visual Designer

  It’s good look good, eh, product has to be “appealing” Need to have our products leap out at people entice them to buy it. all this. So the person need good design, layout and an eye for what is beautiful but not er, slutty.

• Information Designer

  This is about the interfacing with the user. Sounds like a Justine and Rhonda job to me. But it;s more it’s about these columns of information called “data sets” and tree maps and weird stuff.

• Interaction Designer

  This needs someone tough, they have to work with the arty designers and the back room boys. They get to know tools what to use in the interaction and when.

• Copy Writing

  All about sounding good, you know a well worded contract, its very important. People have to understand the best way to explore out products, but this has to be inline with the Family Business.

Yeah, Now I have the user experience team and the “secret” , now it is time to take a hit out on those pesky Fenchenso Brothers.

References

• Assessing Your Team’s UX Skills
• Building the UX Dreamteam
• User Experience Design

We all know the goal of any web site is to make the user experience as informative and pleasant as possible. Reduce the frustration factor and all that, close the sale, win the customer.

Well seems Donna Spencer has found a few car sites that are the exception to the rule, particularly the Peugeot site.  In short the sites alienate, and hard to navigate without previous product experience.

Now at first I was under the impression that maybe this site was basically put together by an inexperienced marketing agency that has no idea on how to approach the web at all.

However on reflection maybe we are looking at something a little more subtle.

Consider that maybe we are looking at an attempt to build an air of eliteness. A special club -”you are the owner of a Peugeot, you are in the know, you have the speical knowledge that others don’t”. It’s as if there is a statement like:

If you able to understand the Peugeot web site then you are on your way to understanding what it takes to own and drive a Peugeot.

On another level, web sites are a bane of sales personnel on the floor of a car dealership. Personal experience  speaks volumes here.  The customer comes in after researching all the cars and can easily make an informed logical decision. To be honest this is not what they want. They want an emotion, lust, need for the car. A decision not based on logic, they want you ill informed.

So make the site a little elitist, make it appeal to the repeat customer only. For the new Peugeot buyer, have enough to entice them into the dealership and that’s all. The staff on the floor can do the rest with the ill informed customer.

This begs the question, are there times when you don’t want a perfect user experience and you want to redirect the customer into traditional marketing channels.  Maybe we need to break the UX rules every now and again.   Regardless the Peugeot site is a shocker.

What do you think, do we need to break the UX rules sometimes?