Great User Interface (UI) design is the difference between a successful site and a less successful one. Your photos can be crisp, your copy relevant; the colours can be vibrant and the design attractive. But if the site is hard to use, your visitors won’t be happy.
In other words, the design is about a lot more than just looks. Good design is about fusing form with purpose – about making things that are above all usable. A well-designed product is an easy-to-use product; aesthetics plays their part, but practicality is key.
The good news is that there are plenty of tricks up a good designer’s sleeve that will make your site not just look good … but function beautifully. Here are our five golden rules, to help inform your own UI thinking.
To be able to design a good UI for your users, you need to know who your users are. It’s a good idea to analyse the data that your analytics apps collect. By doing so, you can understand your user’s goals: which pages do they head for most often, which functionality do they make the most use of? By understanding what they want to do – and how they like to do it – you’ll be able to make informed decisions when designing interfaces that suit your audience.
With the growth in touch-based devices being used for browsing, it’s important to think about how you want people to use your website. People tend to use websites in two ways: directly and indirectly. Direct interactions might include tapping a button, swiping the screen, or dragging and dropping. Indirect interactions include clicking with a mouse, using keyboard shortcuts, and typing into fields. How can you be responsive to your users’ chosen means of interaction? Answering this question is critical to building a usable website.
You can calibrate your users’ responses to your website from the off: for example, let them know what will happen once they click that button before they do it. You can do this through design elements or copy. Highlight the button that corresponds to the desired action; associate a widely understood symbol with a given action – a trash can for a delete button, a plus sign to add something, or a magnifying glass for search. Write great, engaging copy that immediately cues a user and leads them to the path they want to find. Pick a colour with a relevant meaning – green for a “go” button, red for “stop”. In other words, guide your users – don’t leave them adrift.
No site is perfect, but nor is any user: mistakes will happen. Perhaps a user will visit the wrong page, click the wrong button or enter the wrong information. The key is to minimise its impact. There are two main ways to help lessen the impact of human error: prevent mistakes before they happen, or provide ways to fix them after they happen. Follow our tips above and you’ll achieve the former; by offering wayfinding and navigation tools such as breadcrumbs or back buttons, meanwhile, you’ll help your users retrace the steps – rather than start from square one – when they go wrong.
Good UI design is a two-way process: when users interact with your site, they expect something to happen, for an action to be triggered. It’s important to give feedback to your users as they interact with your site, such as clicking on a button. All too often, digital interfaces fail to give much back, leaving us wondering whether we should reload the page – or just give up altogether. Use animation and pop-up boxes to reassure a user that all is as it should be. Hold their hand.
In other words, make UI central to your design process by putting the user experience first: what do they want, how can they get there easily … and how can you reassure them that they’re hitting the right buttons? That’s UI design in a nutshell – and these are our five essential UI design tips.
If you need web design or development, then speak to our friendly experts. Our web developers are based in Coventry, Warwickshire and are always ready to help. Please feel free to contact us and speak to one of our website design specialists.
Contact us on 024 7683 4780 or send us an email at info@image-plus.co.uk.