10 Tips for better User Interface (UI) Design in 2020

September 9, 2020

Our online attention span is a key commodity which is continually getting shorter. The average online attention span is about 8-seconds, probably about the time it took you to read up to here (give or take). That’s not a lot of time to get your user intrigued by what they see on your website, app or social platform and that’s where UI design can play a crucial role in captivating and providing immersive experiences for your end user.

What's UI Design?

"User interface (UI) design is the process designers use to build interfaces in software or computerised devices, focusing on looks or style. Designers aim to create interfaces which users find easy to use and pleasurable." Source.

There are a few quick checks you can do to see if your website is optimised for your user experience. We’ve put together a short list of some of the key best practices, which are super easy to implement with the right know how.

1. Less is more

Don’t over complicate the messaging. Use less wording and aim to optimise the layout.

UI Design - Less is more

2.  Consistency

When you’re filling in a form or selecting from options, aim to keep your typeface, colours and styling consistent.

UI - Consistency is key

3.  Element sizing

Make your call to action big enough for your user to click or tap. Generally aiming for 40-50px wide is about right for devices. Also consider your type size in relation to the rest of the page copy.

UI Design - Element Sizing

4. Picking the right image

Aim to use less busy imagery when overlaying type. Let the design breathe on the page. If the text doesn’t work well overlayed or wrapped with the image, is it essential to keep it? There’s a bunch of great free stock resources where you can find hi-resolution alternatives. Check out Pixabay, Pexels or Unsplash to start building a great desktop library.

UI Design - Picking the right image

5. Avoid unnecessary distractions

Is that line or text effect necessary? Does it add punchiness or is it just an additional distraction. This follows point 1, less is more!

UI Design - Avoid unnecessary distractions

6. Contrast

Differentiate your call to action. If you have a clickable button or an area to draw the user in, try adding a subtle shading in behind to make it stand out.

UI Design - Contrast helps elements stand out

7. Prioritise

Does your call to action have more than one option? Make the key priority stand out from the others. Just remember to keep the styling consistent. Try a reversed-out option or a complimentary colour.

UI Design - Prioritise key elements

8. Optimise your click-through

You want your end-user to convert or complete whatever form or button they’re clicking on. Increase the button visibility so it stands out from the other options.

UI Design - Optimise your click-through

9. Decisions, decisions, decisions

Reduce the user’s decision-making complexity. If you’re using a satisfaction rating, keep the options as short as possible to get the required data you need. A good rule of thumb is the +2/-1 scale; try providing two levels above average and one below i.e. Exceptional, good, average, bad (+2/-1).

UI Design - Reduce the user's decision-making complexity

10. Personality

Give your call to action some pizzazz and personality. If your user is converting on a contact form submission or rating your app, include a graphic or image that has some brand personality. Just keep it relevant and on brand.

UI Design - Give your call to action some personality

Wrap Up

This is just a short checklist, there’s numerous best practices for general sites and you can get really niche depending on your product offering. For more advice on best practices or if you’d like us to take a closer look at your website, get in touch!

Join our mailing list.
*No spam or fluff, we promise!
Every few months we'll provide some tips and insights to improve your brand, web and media assets – as well as a little taste of what we've been up to.
Thank you! Happy to have you on board.
Oops! Something went wrong while submitting the form.