6 steps to UX nirvana

Earlier this month I spoke to the front-end and iOS students at The Iron Yard to introduce them to the world of UX (user experience), and during the talk I gave them some tips and pointers to consider when creating and developing their own digital experiences. Here is a rundown of the advice I gave, loosely grouped into six themes.

A case of the tail wagging the dog

In the real world of deadlines, stressed clients, existing technical frameworks, decisions are often made in the wrong order. It’s important to try and think the right way round. So what does this look like?

  1. Start with questions, interviews or a workshop to reveal the purpose and ambition of the product you want to create
  2. This will help determine its content, functionality, features and overall structure
  3. Only then can you design layouts and templates and decide how to build it

 

Of course, this is the ideal way of making decisions. It’s not always possible to do that, but where you can, technical solutions should come after the user’s needs have been established.

 

Deconstruct the problem

In my experience clients sometimes come to me with solutions already laid out; the answers without the questions. We have to ensure that the necessary interrogation of the root problem takes place and that the answer isn’t a foregone conclusion. So take on board the client’s thoughts and then re-ask the questions they’ve asked themselves: ‘Why have you come to this answer? Well why does the user need that? And why would that make a difference?’

And why, why, why… Break it down. Deconstruct it. Keep asking until you can’t go back any further. To a kind of singularity! Then work your way forward from that. It gives you a blank slate from which to work.

Become the user

The way you use a website – or even the way people like you use a website – is not an accurate picture or broad enough cross-section of your target users.

Ultimately what you’re building is not for you. So don’t be selfish; don’t create something primarily for your portfolio. Put yourselves in the user’s shoes and try to be objective.

If you stick to your high standards, and the needs you’re attending to are the client’s and user’s, you can still create a great portfolio piece.

Ask questions

You can’t produce a good user experience solely through your own understanding of the industry, or just because you ‘get’ the internet. One, your client knows more about their business than you do, and two, the user knows more about their needs and experiences than you.

So don’t second guess them. Hear it from them first hand, whether it’s through a workshop with many stakeholders, a one-on-one conversation between you and your client, or remote user testing.

Only by blending their knowledge with yours will you achieve great results.

A website that’s technically sound is not enough. Usability is about understanding humans and their biases and idiosyncrasies. The ‘textbook’ way to do things may not be the right way to do it for them.

There is a parallel in urban design, and we can learn some lessons from it.

This is Brasília. It was built in 1960 to replace Rio as the capital.

In ‘Urbanized’, a film about the built environment, there’s a segment that talks about Brasília as a planned city. It makes some interesting – but contrasting – points about designing for humans. On one side of the argument, a now rather frail Oscar Niemeyer (one of the architects responsible for various civic buildings in the city) says that it isn’t enough to have a building that works well, but that it can be beautiful and different. It can create surprise, which is the main thing in a work of art.

The contrasting view comes from another well-known architect – Jan Gehl – who describes Brasília as looking fantastic from the airplane, but down at eye level it is a disaster because of the wide distances, miles and miles of completely straight paths, and a general lack of ‘connection’ between things.

What looks good as a design – on paper or in the mind – may not work when real people start using it. We’re not robots.

 

A helping hand

So what can you do to accommodate our ‘failings’ as humans?

We know that people scan, they glimpse. They don’t have time to read everything word for word, letter by letter.

Often people hide things in plain sight, much like the forwarded email you receive where the really important item is buried 6 conversations deep with no pointers to its existence. It might be there but you shouldn’t reasonably expect people to notice it.

So make it easy for your users. If something is important, it’s high up the page. It’s larger than other elements. It has design features that highlight it. It is written in a way that’s easy to understand and jargon-free. Where a single instruction is needed, it’s completely unambiguous.

 

7bn people and counting

There are many different people in the world, each with their own way of doing things. Taking a website as an example, some might navigate to content deeper in the site by the global navigation, while others might prefer to use the search box. Others still might make a beeline for the content on the page, linking through from there.

And they won’t do the same thing every time.

So cater for many different types of people using your digital product. If it’s important, give users multiple ways into the content.

This is a dilemma most web creators are faced with. One of the things that appeals to us about creating stuff on the internet is that we have variety in what we do.

Of course this depends on your exact job and client list, but one day we’re creating a mammoth corporate website for a FTSE 100 company, the next we’re creating an animation for a small boutique agency. And everything about those two endeavours will be different. Not just the colours, layout and size, but the whole attitude of the piece. We like the fact they’re different. We like to create things anew. We want to – as they say – surprise and delight our users.

 

Same same but… same

But the problem is that users like familiarity. They spend time learning the way a certain type of communication or content looks and works, and expect it to be like that on the majority of sites and apps they visit. The way accordions open and close, the way screens swipe, where navigation is positioned, common terms for pages, carousels, and so on. A good example of this is the hamburger icon. You couldn’t move for them in 2015!

And on a wider level, over the last couple of decades, a common ‘best practice’ has been established.

Add converging build techniques – for example responsive frameworks like Bootstrap – as well as off-the-shelf solutions like Squarespace, and it means we are starting to homogenise the way we create digital products.

“What did Airbnb do? Can we do something like that?1

The image above is Airbnb’s homepage. A carousel. Strong typography over a darkened, full width image. Seems familiar, right? That’s because half the internet is also Airbnb! Put a finger over the logo on many of the sites below and you wouldn’t know the difference between them.

So what do we do? Is there a balance?

On one hand, you could argue that you should be creating that great unexpected ‘thing’ that becomes the new standard in digital design.

On the other hand you could argue that the fundamentals should stay the same. You won’t alienate your users and it’ll make for a good user experience.

For me, there’s no right or wrong answer, and there certainly isn’t a blanket solution. The only thing to do is ask yourself each time: is this the moment to innovate, to do something completely different? Or is this the moment to abide by convention? You have to evaluate each project on its own merit.

Leave no stone unturned…

As a UX designer you have to cover everything. Every dead end, possible cul de sac, or black hole of logic needs to be explored, and a solution found. If there are different logins and view states for different users, you need to methodically go through every possible outcome. A painful process but someone has to do it!

 

… but keep it simple

But just be careful that what you create doesn’t end up being overly complicated and cluttered. It’s a very fine balance to ensure you’ve covered every base for every user while also making it simple and easy to use. There is a quote I often think about which encapsulates this sentiment:

All in all, this combination of thoroughness with simplicity is a delicate balancing act, but I believe it’s achievable.

 

Dead ends

Whether some people know what they want when they come to a page or whether they don’t, ensure there are no dead ends.

So understand and define what you want your user to achieve on each page or screen they visit.

It might be an overt call to action like a button shouting ‘BUY NOW’, but it might also be some information they need to take away – contact details for example. And it could even be simply a feeling of trust in the product.

The weakest link

There’s a school of thought called Gestalt psychology that looks at the human mind and behaviour as a whole. When trying to make sense of the world around us, Gestalt psychology suggests that we do not simply focus on every small component2.

So how does this relate to us?

Often a user will experience a bad product and not know why it’s bad. Layout, design, UX, navigation, copywriting, build… any one of these elements can let down the whole experience. And our user often can’t – or doesn’t feel the need to – discern between the different components that make up the product.

So it’s not good enough for a UX designer, for example, to say “well, my wireframes were fantastic, but the visual design let it down”.

This means that whoever you are in the process, whether you’re a developer, a designer or strategist, you don’t work in isolation. You’re always part of a team, even if the team is just you and the client!

So if you care about the front-end build, you should be caring about the design, the back-end, the writing, the UX. You can’t be 100% involved all the way through, but you should be able to recognise good and bad decisions and thought processes at all stages.

 

Collaboration’s what you need

And finally, collaborate. It sounds obvious, but it doesn’t happen often enough on live projects, despite people’s best intentions. If you see something that really doesn’t work in a stage that someone else is response for, then say so.

----------

Hopefully these nuggets I’ve gleaned over the years of doing UX and running digital jobs for various clients and projects come in useful when making your mark in the digital arena.

 

----------

  1. Louder Than Ten – Design machines
  2. Verywell – Gestalt psychology