what's the difference between ui and ux developer moodia web design

Over the past few years, two buzzwords have entered the web designer’s ‘concise dictionary of websitey jargon’ that have been causing no end of confusion: UX and UI. These are two separate skill-sets that developers can specialise in, yet often they get mistaken for being the same thing. So, we hear you ask – what is the difference between a UX and UI developer?

Well, first of all, we’re going to have to quickly run through some basics :


What is UX design?

User experience design (commonly referred to as UX design) is the process of researching and determining a design solution that is centered around the user. It should provide the simplest, most straightforward and engaging result for the user.

A UX designer takes on a problem or project and investigates every single step of the process to find the optimum way to solve that problem for the end user. Take for example, your smart phone apps, each one operates slightly differently because different UX teams have tried to design them to what they think is best for the user – some prefer to swipe, some to pinch and others to tap.

Effective UX design is often achieved through focus groups that match the target audience of the final website design. By creating wireframes, gathering user feedback and researching competitors, developers are utilising user centered design to create the most effective end product.

What is UI design?

UI stands for ‘user interface’, which means that UI design is concerned with the look and feel of a website or system. While the focus should still be on maximising usability and enhancing the user experience, UI designers and developers craft the visuals and front-end interface, not the underlying processes.

What’s the difference between UX and UI design?

Internal vs. external experience

UX designers create the internal experience that a person will encounter as they use a product or service. They do not determine the final ‘look and feel’ of the end-product. For example, they won’t concern themselves with colours, icon shapes, logo design or font choices. That’s the outward appearance and thus the UI designer’s job.

UI and UX for websites – an example

To give a real-world example, let’s imagine a new website needs to be created to allow users to compare car insurance. The UX designer would identify the specific problem that the website needs to solve – e.g. “I want to compare car insurance quotes to get the best deal and save me money” – and then research how that problem can be solved.

By carrying out extensive research they would design some wireframe mock-ups of how the website should work based on what they’ve discovered. The ‘flow’ of the website would be finalised; i.e. how a user gets from landing on the homepage to completing a quote and purchasing insurance.

Each step/page of the website would be carefully planned out and tested with the target audience to ensure they are able to use it and that it’s intuitive.

Only when the process is truly bullet-proof will the wireframes be passed on to the UI designer.

It’s the user interface designer’s job to turn the static, black-and-white wireframes into something beautiful. They are responsible for the aesthetics such as colour schemes, fonts, images and backgrounds. However, it’s not just about making it pretty – it’s more concerned with adding life to the UX designer’s work and turning it from sketches on a page into something ‘real’.

Once the UI designer has completed their work, the project gets passed on to a developer or manufacturer who turns the designs into the final working product.

Think about your buttons

A simpler example is to think of a button on a website page. The UX designer would have determined that the button should exist in order to persuade users to perform a certain action – e.g. adding a product to a cart or subscribing to a newsletter.

The look and feel of the button is the UI designer’s responsibility. They might make it have rounded corners and a bevel effect so it looks 3D. It may be in a contrasting colour to the rest of the website so that it stands out on the page. They may even decide to place it in a certain position to encourage maximum engagement.

When someone hovers their mouse over the button, it changes colour. The state change (i.e. ‘something should happen on hover to differentiate this button’) is the user experience design; the actual colour change is user interface design.

Next Steps

Does your business need a website? Want to save money on the cost and work with some of the best agencies in the UK?

If so, Moodia can help! We review UK based web design agencies in order to connect you with the perfect person or team for your job. Just fill out the form at the top of the page and you’ll soon be comparing quotes for free!

Compare free price quotes to find the best deal for your businessSPEND LESS NOW