What is UX and why should you care?
I always try to correct people who talk about designing or improving ‘the UX’. They talk as if a user’s experience can be designed. User experience isn’t just trying to make the interface more usable by looking at the colour or placement of different items. It’s not something that should be sprinkled onto a project if time and budget allows.
UX aims to ask questions and solve problems. It’s the first step towards a user-centred design. It’s researching user needs and testing them. Its aim is to find out what the people who engage with your organisation really need, not what we think (or hope!) they need. Wireframes are one well-known way to get this on the page, but they’re not the product.
UX in 2020
So why should you care? In five years’ time, what advantages will an organisation that invests in UX have over one that doesn’t?
This time five years ago we talked about mobile websites, not responsive design. These were the best phones of 2010. The first iPad was yet to be released. Now my gran has one. It’s really hard to predict what the digital world will look like in 2020. But one way to figure out what the people who use our products and services will want is by doing research.
Organisations who don’t do this- those who try to guess what users need, or just bury their heads in the sand- will struggle, just as those who didn’t adapt to the rise of smartphones and tablets struggled. Here are some examples of organisations who studied what users needed, made changes, and reaped the rewards:
Every UXer’s favourite comic
What to do
If you’re inspired to make user experience a core part of your organisation’s digital strategy, where do you start?
User experience is more than just a deliverable. For the most successful organisations it’s integrated into their culture. This means that your organisation needs to go far beyond the occasional ‘UX project’ and embed UX into everything it does. Research, iterate and refine what you do online:
Pick some key goals- perhaps lots of people are dropping out of your checkout process, or newsletter signups are surprisingly low- and find out what’s going on. You could do this with a survey and/or some user interviews for example.
Investigate what tasks users want to complete, and where your digital offering helps or hinders them. Be as unbiased and open to criticism as possible- now isn’t the time to correct someone’s misconceptions!
Decide on the change(s) you want to make and track your results.
Repeat. Keep repeating it. As in, forever. There’s no completion date, just a process of continuous improvement. Websites are like gardens, and they need to be maintained.
Smashing Magazine has a huge list aimed at ecommerce, but there’s plenty that applies elsewhere.
GoodUI has over 50 suggestions for improving conversions.
This post originally appeared on the Sift Digital blog.
The Web Is…
On Thursday and Friday I went to The Web Is… in Cardiff. The line-up had changed fairly significantly since I booked my ticket, and when my train sped through Cathays station without stopping, taking myself and twenty fellow passengers on a surprise trip to Pontypridd, I started to wonder if I’d been cursed. Still, I made it, a mere 30 minutes late.
There were 17 talks in all, and there was something to take from all of them. It’ll take a while for me to work through all my notes and process what I learned. In the meantime here’s a whistle-stop tour of my highlights (let’s hope this one stops before Ponytpridd, amirite?!):
Chris Murphy told us that education is a force for change. It’s about giving people the confidence to act.
Anna Debenham reminded us that performance is a user requirement.
Seb Lee-Delisle talked about lasers. I didn’t understand much, but it was cool.
Emma Mulqueeny gave a fascinating talk about the 97ers- the generation born from 1997 on who’ve grown up not just with digital but with social media. Having done a fair bit of research with children and young adults this year it was great to hear a fellow grown up talking about the positives of digital for young people, rather than just worrying. We have a lot of responsibility to these guys. They’ve grown up carrying a device with access to the entirety of human knowledge in their pockets, but don’t always know what they don’t know. They’ve also grown up in a world where recession is the norm and big organisations fail. If it’s scary for us it must be terrifying for them. We need to help them grow up, find their place in the world and- not long from now- start running the show.
Phil Hawksworth gave a very funny and timely reminder that the web is made of links. As an aside I thought it was also great to hear from someone who (to my knowledge at least) isn’t already Twitter/conference famous. He presents like a pro.
Scott Jenson gave us all a little piece of the Physical Web and now I have a low-energy Bluetooth beacon that beeps and transmits my website’s URL. This is possibly not the most exciting implementation of that technology. My mum was impressed though.
Robin Christopherson served as my latest reminder that accessibility is for everyone. No excuses.
Sally Jenkinson, among other things, pointed out that people care about experiences, not tech.
Mr Bingo doesn’t work for free.
Brad Frost always inspires me. Web design is, he said, the “most sharing community in the world.” It’s open by default, and this openness is starting to permeate other areas of our culture. He also mentioned a big bugbear of mine- charities who want to protect their ‘competitive advantage’ more than they want to share knowledge with other organisations in their field. But that’s a post for another day!
Thanks to Craig and family for organising and running a great event.
Really enjoyed @thewebis_ . I learned a lot. <3 u interwebs. #TheWebIs
— Mike Dunn (@mikedunn) October 31, 2014
One useful item in any content strategy toolkit is the style guide. Today, I wanted to look at a couple of my favourites.
The thing I like about these is that while they’re for very different organisations - one is a government, and the other is a talking monkey who helps you send email - there are more similarities than differences.
A style guide can cover almost everything, from logo and branding to typography to the HTML and CSS code you use. But why use a style guide? The UK Government Digital Service’s own research gives four reasons: it makes better use of writers’ and editors’ time; it helps readers by being consistent; it conveys the right ‘look and feel’; and it saves you money.
Today, though, I want to look at tone of voice - how can the many people at your organisation speak to the user as one?
GOV.UK is the website of the UK Government. Its clean, straightforward design has won it a lot of attention as well as awards. It seems to me that none of this could have happened if those design principles hadn’t been embedded in its style guide. There isn’t space for a lengthy analysis here but suffice to say that it embodies the GOV.UK aesthetic, clearly explaining what a contributor to GOV.UK should do, how they should do it, and why. Two of my favourites are the sections on writing in plain English, and on making content easy to find via search engines. Their most important tip? Stick to the style guide!
As well as its style guide, the email marketing company MailChimp also dedicates a separate site to the company’s tone of voice. The MailChimp takes great pains to explain to its staff that while their voice is always the same, its tone should change according to users needs. This means the company’s humourous branding comes across loud and clear when users are happy, but gets dialled back when they’re having problems. Some of my favourite parts of the style guide are the grammar tips (“Ampersands: Don’t use them.”), and the different approach staff should take when writing for the MailChimp blog (“Be casual, but smart”). I’m also going to go out on a limb and say it’s the only style guide ever which explains when to use the phrase “Eep eep!”
Different but the same
Much as I’d like it to be true, it’s hard to imagine GOV.UK ever needing to define when it’s appropriate to use the phrase “Hi, Neil. Why am I smiling, you ask? Because I’m not wearing any pants!” on its website. But this is the exception that proves the rule. The MailChimp and GOV.UK style guides have a lot in common:
1. Sweat the details
Both style guides detail exactly when to use italics. GOV.UK’s explains when you should use a full stop in ‘eg’ and ‘ie’ (never). MailChimp have strong opinions on semicolons. These aren’t hard and fast grammar rules everywhere, but they are for these two sites. They make them consistent and reassure their users that the organisations are professional, knowledgeable and in control.
2. Define what you are - and what you’re not
Stating both what your organisation is and isn’t is a great way to strike the right balance when defining tone of voice. GOV.UK and MailChimp both know this. GOV.UK is “brisk but not terse” and “serious but not pompous”. MailChimp is “confident but not cocky” and “expert but not bossy”. Two very different organisations, but with very similar ideas of how they should talk to users.
3. Put users first
I’m a user experience designer, so it was probably inevitable this tip would end up in here. Your style guide should put users at the centre. What do they need from your website? GOV.UK’s guide explains that, “Using this style guidance will help us make all GOV.UK information readable and understandable.” And MailChimp makes clear that “our priority is to explain MailChimp and help our users get their work done and get on with their lives”. Both style guides recognise that users should be able to find out what they need as easily and as stress-free as possible_._
This post originally appeared on Together We’re Better.
On Tuesday evening Bonny and I ran a workshop at the #SoMeSW June meet up. As UX designers we’re interested in how an organisation’s social media presence can affect the user experience.
We split the attendees into small teams and assigned them the name and brief description of an (imaginary) organisation for which they’d play the role of social media managers. We then asked them to write the absolute worst tweet their rogue Managing Director could ever send from the organisation’s account. Once they’d decided what this was, every ten minutes or so we handed the teams a new and terrible twist in the tale and asked them to discuss how they’d respond.
On the basis that most #SoMeSW attendees are social media professionals we didn’t make this easy for them. Everyone took part enthusiastically, having a laugh but also doing some serious social media strategising. We ended with a quick presentation of some of our ‘favourite’ social media disasters. These included Susan Boyle’s hashtag fail and the time US Airways tweeted pornography.
While we had fun there was a serious message. If you’re responsible for your organisation’s social media presence you need to run regular fire drills. Figure out the things that could go wrong, who in your organisation will respond to them, and how:
Just as your office building needs a fire drill, your communications strategy needs an emergency plan. Every site or service will fail eventually; it’s only a matter of when or how.
We pushed the teams to sometimes ridiculous extremes but right on cue the next morning this happened, with the whole incident unfolding across Twitter, Facebook and Buzzfeed. Which just goes to show it’s never too soon to run a social media fire drill.
The Storify on Together We’re Better
#SoMeSW on Twitter
How emotional is your site design?
It’s easy to get bogged down in the world of deliverables when talking about User Experience: wireframes, research reports, prototypes, sitemaps and the like. But at the heart of good UX design is the craft of creating experiences that people love.
Psychology plays a big part in designing any sort of digital experience, and regardless of your role you can consider your site’s emotional impact on your audience. In other words: how are you making your users feel?
“We scientists now understand how important emotion is to everyday life, how valuable. Sure, utility and usability are important, but without fun and pleasure, joy and excitement, and yes, anxiety and anger, fear and rage, our lives would be incomplete.” Don Norman: ‘Emotional Design: Why We Love (Or Hate) Everyday Things’
A strong emotional experience when we’re using something makes us much more likely to remember it- and whether your users’ memories are positive or negative is up to you! In his book ‘Designing For Emotion’ Aaron Walter argues that when we create things we should go beyond utility and try to delight our users:
“People will forgive shortcomings, follow your lead, and sing your praises if you reward them with positive emotion.”
Forming these emotional bonds with your users makes them more likely to remember you, become engaged and share your work - things that most not-for-profit organisations are eager to achieve. So how can we build positive emotional design into our everyday work? My number one tip would be to put your users first. Your new web page or email newsletter might please the people, but what about the people who matter- your users? Will they be bored and frustrated by what you do? Or will they be surprised and charmed? How emotional is your design? Here are three easy things you can start doing today: Tip 1: First impressions count When we visit a webpage we don’t work our way around it in a careful, structured manner, taking everything in before deciding where to click. We scan. We skim. We hurriedly hunt around until we find what we hope is right. With this in mind, take some time to decide whether you’re giving your visitors a great first impression and triggering the right emotional response to your content. Put yourself in their shoes and ask if they’ll be able to find what they need on your site within five seconds of arriving. How about in two seconds? Or in .2 seconds? Assess what message you want to communicate in the first moments after landing on the page, and remove barriers to this. For instance: does your use of imagery support the emotional response you want? Tip 2: KISS!
Keep. It. Simple. Stupid. Remove as many words as possible from your copy, especially instructional copy. The less there is, the more chance your users will read it fully and understand. Go through your site to see if you can remove any excess words and make your users’ tasks simpler - frustration is never a welcome emotion.
Tip 3: Check your forms Forms are often neglected areas on the web, and are often far longer than necessary. Long forms bore and disengage users, so review yours and remove superfluous fields. Another common problem is the way marketing opt-in options are presented - double negatives are definitely a no-no! Keep these simple and understandable at a glance as getting these details wrong can leave your users with a poor impression of your organisation. This post originally appeared on Together We’re Better.
Get an image makeover in 2014
The imagery you use online says more than you might expect. An image may be the first thing someone notices when landing on a page, so they play a key role in making a good (or bad) first impression.
Here are three tips to help you assess the imagery on your site and see if you need to tweak it, update it or create something new.
Tip 1: Avoid obvious stock photos
We’ve all seen them: handsome business people shaking hands in a spotless white room. Women laughing while eating salad. Babies using computers for some reason. Clichéd stock photos are rife on the web, so much so that they have their own meme.
We’ve learnt that these images are fake- not real customers, users or staff. So go through your key pages and check you don’t use any clichéd stock images. If you do, try to replace them. And if you have to use stock photography, Paul Boag has some great tips for doing so effectively. Make this the year you start using images that really mean something.
Tip 2: Make your imagery appropriate
It’s not just stock photography. People are extremely proficient when it comes to a assessing imagery on the web, according to this study by Jakob Nielsen. If it looks like an ad, or like something that’s been dropped in to fill a space, users will ignore it. If it looks useful or interesting (think real people and product photos), they’ll pay attention. Good or bad, the imagery you use will leave an impression on users, so take the time to make sure it’s a good one. You can read more about this at 52 Weeks Of UX.
Tip 3: Get the resolution right
A common problem with using imagery on the web is getting the resolution and size right. The larger the image, the longer it takes to download (a problem for people with slow connections or mobile devices), but the smaller the image the more pixelated it will appear when stretched: fuzzy images look cheap and unprofessional. inSquare Media’s article on why you should resize your images is a useful introduction to getting the balance right.
This post originally appeared on Together We’re Better.