Difference between UX and UI design

Let's dive into the essence
Well, how can we do it differently if we want to know the difference between UI and UX?

UX is about user interaction with a product. This is about how to make sure that everyone opens the application and immediately understands how it works.

Any project begins with the development of the UX part. At this stage, designers thoroughly study competitors' products, determine user needs, their problems, and then come to an understanding of how best to solve them. Such UX research allows you to think through a product, create and test prototypes, and abandon obviously unworkable solutions. UI is about how the product looks and how the user perceives it. The main task is to create an interface that will stand out from competitors. Looking at which the user will think: “Damn, who did something so cool?” To do this, colors, typography, infographics and animation are used.

At the UI creation stage, the designer can also work on the logo and branding (corporate style) - everything that, one way or another, reflects the integrity of the product and its positioning. UI prototyping, animation and adaptability are those aspects that ensure comfortable interaction with the product on any device.

It turns out that the difference between UI and UX lies in the workflows. But there is only one goal.

Analyzing the work process
It is possible and necessary to create cool UI/UX. The truth is that working interfaces are mainly about the synergy of usability and visuals. To understand how to achieve it, let's look at how product design is created here at Purrweb.

UX comes first

As stated earlier, any design project begins with UX research. See how competitors' products are made, dig out potential pain points for users - these tasks should be addressed already at the start. You cannot skip this stage - the risks are too great to do exactly what is already on the market. Truly cool and useful applications simply do not happen without such analysis (however, you yourself know everything).

After analyzing competitors and the target market, designers switch to developing information architecture. Plan a hierarchy of screens and navigation that will tell users about all the features of the product. The created AI allows you to take on low-fidelity wireframes, the basic skeleton of the future interface with a minimal UI. At a minimum, this is when placeholders are used instead of images and buttons.

At this stage there are a lot of tasks:

briefs - a document that contains basic information about the project - so that both the designer and the client know what's what
mood boards - a collection of patterns, patterns, color palettes - so that the designer imagines the appearance of the product and does exactly what the client needs
refs - viewing products with similar functionality - to understand how they look and work
personas - an archetypal representation of potential users - to represent the process of interaction with a specific person's product

In our team, one designer is responsible for them, but if the work becomes too much (for example, the project includes too many features and screenshots), then we involve a second one. And here the difference between UI and UX is gradually blurring.

When it comes to developing an MVP (first product version) and a limited budget, the following is important: do not neglect the UI or UX. And you can’t go wrong with hiring a designer. Finding a person who can complete tasks “on both sides” = save resources.

Now let’s summarize and highlight the main differences between UI and UX again:

If we are talking about UX, then:

it's about how the user interacts with the product
UX designers focus on user interaction with information
The UX designer creates the logic of interaction with the product, which conveys the business idea
UI differs from UX because:

UI is about how the product will be perceived by the user
affects only the visual part of the design
this is a concern with appearance and interaction design
Made on