join us as we take an in-depth look at user experience – or ux for short. what is ux, what are its core principles, and how can those principles be applied to an app or website? furthermore, how can marketers measure customer experience of their user interfaces? let’s find out.
what is user experience?
user experience (ux) refers to how users respond internally to a digital user interface (ui) such as the user-facing parts of an app or website.
if the user enjoys using the interface, that’s usually a sign of good ux. if they don’t, that could be a signal of bad ux. as we’ll see, there’s a whole lot more to it than that…
the ux honeycomb
to gain useful insights into the user experience, we need to consider the individual factors that together define the quality of a digital experience.
image credit: a-dit-ya on flickr.
peter morville’s honeycomb visualisation of ux factors (above) defines the basic components of good ux as follows:
- usable: the system is simple, easy to use and quick to master.
- useful: the service is useful. it serves a need.
- desirable: the product is aesthetically appealing and in keeping with current design standards.
- findable: the system is easy to navigate. it makes the required information available in ways and forms the user expects.
- accessible: the service is built in such a way as to be accessible to everyone.
- credible: the provider should be reputable.
together, these six factors will define ux against the central cell of the honeycomb: valuable.
morville’s honeycomb is a useful starting point for understanding ux, and ultimately for testing it.
to familiarise yourself with the factors involved in user experience, do a simple website audit using the factors from the honeycomb. at least to start with, we advise auditing someone else’s site rather than your own – it’s easier to be objective when you have no personal connection to the subject.
here’s what we found when we audited southern railway’s site:
| ux honeycomb audit: southernrailway.com (tested on a laptop running chrome) | ||
|---|---|---|
| observation 1 | observation 2 | |
| usable | ticket booking system is clear and simple. finer details such as travel date and railcard options are expandable, which makes the initial booking system view nice and approachable. | a large amount of the information on the website is unrelated to its core use, e.g. sponsored content from commercial partners. while beneficial to revenue, this hinders usability. |
| useful | the facility to book train tickets online is clearly useful. | - |
| desirable | design looks clean and professional. | could the branding be better-implemented? how does it compare with other operators such as virgin trains and grand central? |
| findable | links for key functions – ‘book tickets’, ‘live departures’ and ‘delay repay’ – are prominently displayed to the top-left. | the amount of information available from drop-down menus in the header could be overwhelming. |
| accessible | links are written in such a way as to make sense when read out loud (which is done electronically in some internet software for the blind or visually impaired). | audio and text transcripts are available for videos and podcasts. |
| credible | strong brand recognition: the website shares a logo with southern railway’s trains. | company has a patchy reputation with customers. the prominent “delay repay” link in the header is a clue as to why. |
| valuable | the website’s well-designed ticket booking and train finder facilities add value for users. | potential flaws such as the high volume of sponsored content and high density of navigation links could impede website’s value vs. competing providers. |
this exercise is a good way to get yourself thinking about ux. use it to learn the seven factors from the ux honeycomb, so you can bear them in mind whenever you are involved in designing or evaluating a digital user interface, such as a website or app.
how user experience is tested
the user experience principles we’ve covered so far should help you focus on good ux whenever you design or evaluate a user interface. now, let’s look at some ways to test how well a user interface satisfies key ux factors.
expert ux review
perhaps the simplest way to effectively test ux is commissioning an expert to do it for you. you’ll find some well-regarded freelance usability testers listed at toptal.
the nature of working with usability testers varies based on who you hire. for instance, some will take an active role in redesigning your ui based on their testing, while others will simply provide their feedback. if you’re considering going down this route, we’d recommend engaging someone who has worked on projects similar to your own.
a downside to the expert review approach is that it relies on one person’s informed opinion, whereas other types of ux testing are more scientific in nature. for this reason, we’d recommend using an expert ux reviewer in tandem with a data-based ux testing approach, if budget will allow.
eye tracker studies
eye tracking may have been around longer than you suspect. the first eye tracker was built by the american psychologist edmund huey in 1908, to study eye movements during reading. huey’s device was made up of a contact lens attached to an aluminium pointer – not exactly the sort of kit most test participants would be happy using today.
most modern eye-tracking uses unobtrusive infrared tech or ordinary webcams to measure pupil movement and dilation while the participant looks at a screen. the results can be viewed as heat maps and analysed using eye-tracking software. current uses of eye tracking include research into cognitive science, music reading, drivers’ hazard perception, and ux.
one of the standout benefits of eye tracking is that it gives a physio-metric read on how users interact with a website. this theoretically provides less scope for bias than a tester’s verbal or written testimony.
the video above highlights findings from a study into the eye movements of heavy facebook users. it includes an interesting section on how the design of a page can influence the flow of visitors’ attention towards elements that contribute to a marketing conversion, especially “like” buttons.
this illustrates a key ux use case for eye-tracking: identifying how design/content choices affect user interaction with an interface.
thinking back to peter morville’s ux honeycomb, here are some examples of how eye tracker studies could shed light on critical user experience factors:
| usable | how directly does the user’s gaze move between the points involved in completing an action? |
| desirable | how much attention do users give to the company logo, branding elements, etc.? |
| findable | where do users look to find a certain item? |
| accessible | how long do users have to look at a page’s body copy in order to read it? |
eye tracking hardware ranges in price from the low hundreds to the tens of thousands. as such, hardware-based mass participation eye tracker studies can quickly become prohibitively expensive.
eye tracking software used with ordinary webcams tends not to be as accurate as eye tracking hardware, but it does have the advantage of affordability. here’s a list of free eye tracking software that can work with participants’ webcams.
heat mapping
heat mapping software is used to measure where users click, scroll or move their cursors on a user interface. this is typically facilitated by integrating a back-end application with the interface, enabling the website or app owner to monitor user activity.
much like eye tracking, heat mapping is used by ux researchers to test how design choices affect user experience. however, there are a few important differences between the two methods.
heat mapping generally comes at a far lower cost than eye tracking. the software itself is usually reasonably priced, and in some cases is available free-of-charge over a trial period. the second advantage of heat mapping is that it facilitates monitoring of real users, whereas eye tracking relies on research participants whose behaviour may differ somewhat from the user interface’s actual audience.
one simple heat mapping application you can try for free is page analytics (by google), a chrome extension which allows you to track clicks on pages connected to your google analytics account.
far more detailed heat mapping is available from hotjar, which offers click, scroll and move tracking from as little as $89/month for businesses. there’s also a free version for students and enthusiasts – an offer well worth taking up if you are interested in gaining practical ux heat mapping experience. standout hotjar features include recording of real site visits from individual users, and feedback polls allowing for heatmap data and users’ critical input to be analysed side-by-side.
professional user testing
in professional user testing, trained users are commissioned to install testing software on their phone or computer, and then carry out a series of tasks on the subject website or app, talking through their experience as they do it.
the tester’s commentary is recorded by the software and can be used to shed light on strengths and weaknesses of the interface, to highlight bugs or poorly designed elements, and to gather opinion on lots of different attributes of the ui.
putting together a good list of questions for testers to answer is key to getting the best out of professional user testing. careerfoundry’s raven veal suggests writing questions based on the following goals:
- gain insight into the product’s value relative to competing products;
- find out which of the interface’s features are most valuable to users;
- identify pain points, such as navigation issues;
- explore how users use the site and why the use it as they do.
there’s a lot more to it than that – so if you’re setting out to write an effective set of questions, we suggest you read raven veal’s article: how to write effective usability testing questions.
bet伟德安卓下载 ’s marketing director, ciaran rogers, used a ux research service called whatusersdo while working on projects for agency clients in previous roles. using the service, ciaran and his colleagues recruited testers to record their thoughts via whatusersdo while performing tasks on websites, such as finding and purchasing certain products. the system allows marketers to recruit test subjects with the right interests and demographic fit so that they can be asked to conduct some predefined tasks using the site to be tested. what comes back are recordings of the users attempting to perform the set tasks. the testers are all supplied with software by whatusersdo to not only record them performing the set tasks but also talking through their thought process as they do so. as you can imagine this kind of feedback was incredibly insightful. according to ciaran, running a test with four or five users sufficed to provide reliable insights. if more than one user reported a particular problem, that would strongly indicate a need to investigate.
persona research
a marketing persona is a made-up person who represents the attributes of a user demographic. a typical marketing persona could include details on:
- demographic info, e.g. age, marital status, education;
- values and goals;
- ux preferences;
- problems they need to solve;
- professional role and stakeholder relationships;
- daily habits;
- information sources;
- common ux objections.
ux research methods such as heat mapping and eye scanner studies can be used to match ux preferences and common ux objections to demographic persona details. this enables the creation of a more complete persona, which can be used to steer user interface design.
putting ux theory into practice
the most compelling case for implementing good ux is what happens in its absence. according to research from experience dynamics, 52% of users said a poor mobile experience would make them less likely to buy from a company, while 90% said they would stop using an app if they found its ux unsatisfactory.
it’s probably no coincidence that 84% of companies surveyed by experience dynamics said they expected to increase their focus on customer experience metrics and measurements.
good ux is a crucial objective for digital marketers responsible for websites, apps or user interfaces of any kind – and we’re glad to say there are steps you can take towards that goal no matter what your level of budget or expertise.
the first step is to learn the user experience factors outlined in peter morville’s ux honeycomb. applying these to your user interface design and evaluation could significantly improve your focus on ux.
once you’ve put that theory into practice, you can start using ux testing methods like heat mapping and expert testing to back up your ideas with data and user insights.
your reward for taking these steps will be the potential to create better experiences for your customers – which usually means better results for your business.