The difference between UX and UI Design

alt

In today’s ‘app economy’ you’d probably have to be living under a rock (or be within the slightly more ‘mature’ age group) to not have come in contact with digital products and applications.

Whether you are in business development, web design, manufacturing or sales, you depend on these tools to help you get things done. GPS and mapping applications help you get from point A to point B and messaging platforms help you share files and keep in contact with colleagues.

These tools have become increasingly pervasive and today you don’t necessarily have to even be in the software industry to have some idea of what the terms UI and UX refer to.

Regular Joes (or Janes) today have a decent grasp (or at least an intuitive feeling) about what makes a great UI/UX experience.

UX and UI are actually two aspects of product development that have been around for many years (arguably for as long as there have been products).

Think about the objects that you interact with on a daily basis. These don't have to be technology products or applications and can include elevators, washing machines, even desks and chairs.

All of these products rely on some form of UI and UX design process.

With regards to the tech industry, UX and UI design tend to fall within clearly defined roles, however, as technology and product development continues to progress, these definitions are beginning to become a little more fluid as UX or ‘User Experience Design’ begins to cross boundaries with UI or ‘User Interface Design’.

In order for a product to be successful, both UX and UI have to be present. They work together and in harmony.
Despite UX and UI having to work together very closely, they actually serve different purposes and can be found referred to within different parts of the product development process.

Today, however, employers commonly can be found expecting UX designers to also have UI design skills, apart from UX expertise. This can come down to a variety of reasons.

Although it may be tempting to view them as one discipline, successful products are increasingly viewed as not distinguishing between the two.

To put it simply, UX is concerned with how things work, while UI is concerned with how things look. There are, however, several more details and minute ways in which core differences between UX and UI can be discerned.

UI design

Theoretically, the combination of form, content and behaviour is what defines a User Interface. Form includes text fields, buttons, labels, check boxes…etc while content refers to text, images, documents…etc. Behaviour refers to what happens if the user clicks or drags items or types text into the text fields…etc.

The goal of a UI designer is to make an engaging/eye-catching user interface. This UI should also evoke an emotional response from the user and should not be cluttered and disorganized. It should be able to guide the user throughout his/her journey in using the product, making the entire experience as easy and efficient as possible.

It is important to be aware of the ways in which an interface should be arranged and how the user can respond to it. For example, a user would, usually, first read the brightest/biggest and boldest text.

Even the alignment of objects and items within the interface are an essential aspect of UI design. Minimizing the number of alignment lines is an important design consideration as well. This can make the design neater and improve readability.

A UI designer should know how to pay attention to small/intricate details. By being able to do this, the UI designer can ultimately create a design that captures the user’s attention.

UX design

The goal of User Experience design is to make using a product an enjoyable, painless, hassle-free experience.
In order to know if a product’s UX is effective, there are several things to look at, such as the usability, consistency, simplicity and more.

The design of the product should ideally not be complicated enough to warrant an extensive tutorial or user manual (although the use of a tutorial or onboarding/tour guide can help guide users in certain cases and through certain areas).

If the product is a smartphone app, its usability should follow standards that users are accustomed to.

Using it should not be vastly different in comparison with other apps that your users may have used. For example, actions such as pinch to zoom or pull to refresh…etc are common.

Remember, you want to make things as easy as possible for your user and your product should apply those same rules.
The product should minimize pop ups and alerts that can annoy and overwhelm users. It should also be consistent with the portrayal of the brand, in terms of both appearance and functionality, otherwise, confusion may arise.

Bad user experience in action is not a pretty sight and can be found in products that confuse or annoy users.

On the other hand, when both UX and UI work closely together, wonderful products that are a delight to touch, interact and play with arise. Good UI and UX result from product developers putting themselves into their users' shoes.

Proficiency on the part of designers is key because if any of these delicate aspects of the experience fall short, entire products can become unsuccessful.

As with other disciplines, UX and UI designers have to be well-trained and stay constantly updated if they are to keep building awesome products.

*We are a UX-focused team of developers and designers. Our goal is making our products understandable at any level. The result is web and mobile applications that take minutes to learn and are easy to implement in any company, big or small. Find out more about Soda In Mind here