UX vs. UI Design

UX and UI, it sounds mystical right? However, it’s nothing a quick Google search can’t reveal the answers to – but let’s assume you’ve done that, and you’ve found yourself here. You’ve probably opened your phone or web browser app, keyed in the search terms and hit the search button right? Completing that process was so simple it’s now second nature to you.

Every element you’ve interacted with during this process has had some level of UX and UI consideration, resulting in the process being intuitive and easy to understand.

So what are UX and UI?

UX, or ‘User Experience Design’ and UI, ‘User Interface Design’ are both crucial steps in the process of creating a well designed and engaging website. However, they aren’t restricted to just this profession.

UX can also be considered when a product is developed. A great example of how a business has considered UX during the process of product design is the Apple iPhone’s box. Yes, you heard me correctly, THE BOX!

Remember back when you first purchased your new smartphone and opening the box was so exciting! The premium look and feel of the box, the glossy logo and fonts applied, the brilliantly folded card your headphones came supplied in, it could almost be considered Origami! All of these elements, and more, have all been cleverly developed with the user in mind – a true user-first experience has been forged for the ‘unboxing’ experience.

Mobile phones are a great tool for explaining User Interface Design, so let’s stick with the Apple iPhone for the time being. Take a look at your mobile phone right now and you’ll find a large screen containing many app icons just waiting for you to take action. Sure, it’s very colourful, the resolution is great and it’s pleasing to look at, but what good is all of that if the interface is complicated and non-intuitive?

Luckily it isn’t, and it’s because Apple has spent a huge amount of time considering processes users are likely to go through when interacting with their phones. The double taps, swipes, pinches and clicks we all take for granted have all been premeditated for a better experience – and it works!

User Experience Design Explained

User Experience Design is the process of creating customer satisfaction and loyalty by improving the usability, ease of use and emotional response between a product, website or app. Regardless of its medium, UX Design covers any and all interactions between a customer and a business.

During the wireframing stages of website development we can begin to structure, plan and analyse our prototypes quickly and efficiently before any ‘real’ design work takes place. It’s during this process we can begin to consider the experience of the end user. How will they get to the end goal of this website? Through the use of language, colour, fonts, images and layout how can we influence an emotion for a positive result?

User Interface Design Explained

User Interface Design is the collective name for a plethora of tasks which ultimately focus on the optimisation a product or website for more effective and enjoyable use. Where does the ‘Buy’ button live? How does the menu respond when viewing a website on a mobile phone compared to a desktop screen? What colour a call to action needs to be for maximum effectiveness? These questions, and more, we deliberate when constructing a functional interface.

A website isn’t complete when it has been launched; this is just the beginning – especially when we’re referring to UI. Through the use of software such as Hotjar, we can use heat maps and track user journeys to highlight where potential problems are, and then act on improving them. This continuous assessment and development can ultimately conclude in better use of the website or product and aid towards more sales.

How we use User Experience and User Interface

As an agency, we find we’re getting involved with websites either at the beginning, or once the website has been launched and has a chance to ‘live’ a little. Either way, the same in-house agency skill sets are put to use to get the very best from the website. A couple of ways we usually do this have been listed below.

CRO Audits

CRO, also known as Conversion Rate Optimisation, predominantly looks at a website or webpage to see how clear it is for a user to perform a specific action. The focus of CRO is to lead users down a specific path – to make them convert. This could be persuading a user to purchase something, sign up to a mailing list or fill out a contact form, amongst other things.

A good example of CRO would be analysing how often a Call To Action on a page is clicked. This is done through heat mapping and event tracking. From here, we can then use A/B Split Testing to see whether moving the button to a different location, changing the text or making it a different colour to see what effect this has.

Unlike User Experience, which is designed to help the user navigate and locate section of the website, CRO is entirely for the website owner’s benefit. Rather than making the website easier to use, Conversion Rate Optimisation is all about making the user turn into a lead or a customer.

We use various methods of analysis to figure out the problems a website could be having as part of our CRO Audit, broadly speaking this covers;

  • Analysis of user engagement with specific webpages
  • Analysis of user interaction with navigation systems
  • Analysis of pages that cause users to leave the website
  • Recommendations and suggestions to improve user conversion rates.

UX Audits

Website accessibility is one of the most important details a Website Designer and/or Developer should consider whilst designing a layout for a web page. However, even with the best intentions until a website has had a chance to live, you won’t fully understand a user’s journey or ‘sticking’ points until you can analyse what they’re doing.

Think about it, we’ve all been there, furiously clicking on what we think is a button to only give up and never visit the website again. A UX Audit is designed to improve the users interaction with your website, ironing out these issues along the way.

As part of a User Experience Audit, we’ll analyse the following items among many others;

  • Multiple device testing of the website
  • Page accessibility analysis
  • Website information hierarchy analysis
  • Internal linking strategy analysis

In Summary

So there you have it, a look at what UX and UI design are. We’ve shown you how they can be used to achieve a much more effective user interface, resulting in a better user experience and you getting the desired results from your website – whether that be direct sales, indirect sales through engagement, or product or service interest.

 

Do you need help with converting more visitors to customers and increasing online sales?

Are you considering a website development project? Or maybe you need help with a current website which isn’t performing how you expected? Get in touch and we’ll be happy to analyse your website and offer our skill sets in helping you and your business online!

Written by Steve Evans

Hi, I'm Steve a Senior Graphic Designer at Brave Agency. I spend much of my time crafting brands, designing awesome websites or working out better user experiences and journeys through e-commerce websites. I've been working in brand, print and digital design for over 10 years now and have a lot of experience I'll share here.

RAR+
Google Partner
IDM
Bing Ads
Brightpearl Partner
Marketing Society