Search Menu discovery.

We used cards to discover how different people would lay out a search menu for a web page. The website we were investigating was DID Electrical, a retailer of white goods and consumer electronics. We wrote the individual item descriptors, (e.g. Fridge, Cooker, TV etc.), onto individual cards. We then asked somebody to lay out the cards as they would expect to see them laid out on a website. Following this we compared what the user was expecting to what the site actually looks like. If there is a consistent and significant difference highlighted over many iterations of this exercise, it would indicate that it may be prudent to align your website with what your users are telling you that they expect to see!

Image #1 is the way the website is currently laid out. (long and messy?).

Image #2 is how the users expected it to be!

Advertisements

Anchors.

Last Friday we inserted an “anchor” into our CV text document. This allows you to jump from one part of a page or document directly to another place, (e.g. jump to the bottom of the page).

Screenshot 2017-03-27 14.58.21

CSS – Cascading Style Sheets. Key Advice!

I was recently introduced to CSS for the first time. I was told that CSS was basically a list of instructions, (in computer readable format), that informed the computer how to display the various elements of a document or website on the screen so that a person can see and understand it.

So the CSS determines things like, colours to be used, font types and character sizes, whether an element on a page is indented, has bullet points or is numbered etc.

What I found interesting, (and to be honest – Frustrating), was the critical importance of tiny elements like (, – the comma or . – the full stop or : the colon ; semi-colon or  { } the bracket.   Each of these items, and their positioning within your CSS are critical to whether or not your page will display as you had intended.

Now the Key Advice piece! When setting up your CSS make only one change at a time. Save your work. Then check that the file does what you expected it to do before you move on to the next step.

If you make more that one change at a time you will spend ages searching for the error … which is usually a missing or misplaced special character.

Happy CSS-ing!

Coding Frustration meme

 

 

 

 

User Experience.. the challenge of consistency.

Pint of Guinness

One of my own favourite “User Experiences”.. a pint of Guinness. Ideally enjoyed in the company of good friends.

The challenge for Guinness though is two fold. Firstly they want to ensure that my user experience, (Ux), is a good one, otherwise, I am unlikely to repeat my purchase.

Secondly, they need to ensure that my Ux with their product is consistently good. Believe me, there is nothing like a bad pint of Guinness to turn you off a product for life!

So while enormous investment is made in developing and producing a product that will provide the user with a memorable experience, and therefore more likely to repeat their purchase, even more effort may be required to maintain the consistency and quality of the product on an on-going basis, to ensure the longevity of the product’s sales.

In the past, it was not unusual for the quality of a ‘pint’ to vary from one establishment to another. The true Guinness aficionado knew which pubs served the best pints and which pubs to avoid. Today, however, it is more likely that a pint in one pub will be exactly the same as a pint in the pub around the corner. It is a testament to Guinness that through their investment in cold rooms, efficient coolers, delivery, glasses and other technology, (and their merchandising teams), that they manage to deliver a consistent quality of product almost every time.

As part of my commitment to the field of academic research into User Experience, I am willing to continue my research into the quality of the product delivered as far and wide as I possibly can. It’s a tough job, but somebody has to do it.

Sláinte! …..

 

First Attempt at Balsamiq wireframe.

The following post is an example of how I have used Balsamiq Software to generate an initial wireframe for an imaginary piece of wearable technology and the associated app.

Starting point.

The objective is to design a wearable technology,(e.g. watch / bracelet), 
linked to an app, which can monitor the diabetic patient's blood sugar
levels, (and other key indicators), and provide an alert in the event that
an intervention is required, for example, insulin injection or food intake.

Initial screen.

AlanB - 1.jpeg

Screen 2.

Screen 2 will display the patient’s glucose levels over time.

AlanB - 2.jpeg

Screen 3.

Screen 3 could show blood sugar levels with some advisory text such as, “eat snack now” or “levels dropping, eat within 1 hour”, or whatever text is appropriate as determined by the medical consultant.

AlanB - 3.jpeg

Going Digital – why bother??

Everybody seems to be rushing to get an online presence. Current thinking appears to be that if you’re not on social media, then you’ve just NO chance of succeeding never mind surviving !!! But how true is that?

Surely the purpose of being “online” is to enhance your business and deliver some benefit. If your online presence isn’t doing that, then why are you bothering?

When people engage with you or your business in the “real” world, (as opposed to the online world), you can, to a large extent, manage their experience. The difficulty with the online world is that you will not be there to observe and manage their experience. So if their user experience is not a good one, not only are you in danger of losing their custom but potentially they can inflict a disproportionate level of damage on your business by utilising social media to point out the shortcomings or failures that they have experienced.

If you plan to go online, get a trusted friend to try out your site first, ask them to provide you with honest feedback on what they liked and more importantly didn’t like about their experience. This will give you a chance to fix things before you upset your customers. Remember, the objective is to make it easy for them to do business with you. .. not to show how flashy your new online presence is.

Remember, keep it simple, make it easy, and don’t pester them with “pop-ups”.

I’d love to hear about your examples of bad customer experiences when online. Why not let me know what has annoyed you in the digital world?

Image result for meme frustrating technology

Heuristics – from the Greek Heuriskein.. “to find”.

In psychology, heuristics are simple, efficient rules which people often use to form judgments and make decisions. They are mental shortcuts that usually involve focusing on one aspect of a complex problem and ignoring others.

Jakob Nielsen defined 10 general principles for interaction design. These were;

1. Visibility of system status:
The system should always keep users informed about what is going on, through appropriate feedback within reasonable time.

One good example is the “egg timer logo” which displays while a system action is being run in the background and the user is waiting for a response.

2. Match between system and the real world
The system should speak the users’ language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.

A bad example of this is where a website displays a message that simply says “Error 404 Page not Found”. Most people won’t understand what this means!

3.User control and freedom
Users often choose system functions by mistake and will need a clearly marked “emergency exit” to leave the unwanted state without having to go through an extended dialogue. Support undo and redo.
Example – display a “back” or “undo” button to allow users to easily correct a mistake they have made, or present a dialogue box to explain the effect of a requested action and re-confirm the action requested, e.g. ” this will delete all of the files – are you sure you wish to proceed? Yes / No.

4. Consistency and standards
Users should not have to wonder whether different words, situations, or actions mean the same thing. Follow platform conventions.

Example – if people are used to the colour RED signifying “danger” and the colour GREEN signifying “safety”. Don’t use the colours in teh wrong context.

5. Error prevention
Even better than good error messages is a careful design which prevents a problem from occurring in the first place. Either eliminate error-prone conditions or check for them and present users with a confirmation option before they commit to the action.

6. Recognition rather than recall
Minimize the user’s memory load by making objects, actions, and options visible. The user should not have to remember information from one part of the dialogue to another. Instructions for use of the system should be visible or easily retrievable whenever appropriate.

7. Flexibility and efficiency of use
Accelerators — unseen by the novice user — may often speed up the interaction for the expert user such that the system can cater to both inexperienced and experienced users. Allow users to tailor frequent actions.

Example is use of “Control” and “Z” keys to undo an action or “Control” and “S” keys to save.

8. Aesthetic and minimalist design
Dialogues should not contain information which is irrelevant or rarely needed. Every extra unit of information in a dialogue competes with the relevant units of information and diminishes their relative visibility.

Quite often, “Less is More”.

9. Help users recognize, diagnose, and recover from errors
Error messages should be expressed in plain language (no codes), precisely indicate the problem, and constructively suggest a solution.

A good example is the auto correct tool used by word processing packages which can identify incorrect spelling or possible grammatical errors and offer alternatives.

10.  Help and documentation
Even though it is better if the system can be used without documentation, it may be necessary to provide help and documentation. Any such information should be easy to search, focused on the user’s task, list concrete steps to be carried out, and not be too large.

Many packages will have a “?” or an “i” button to indicate the availability of support and documentation.