UI design and UX design: what is the difference between them?

What is UX design - User Experience design

It is right to start by saying that there is no commonly accepted definition for UX.

UX stands for User experience - an experience that users can have when interacting with digital or physical products.

User Experience design is the process of designing both digital and physical products that are useful, easy to use, delightful to interact with, and valuable for users. It is about enhancing the user’s experience while interacting with a product.

UX has many disciplines

UX is a broad umbrella term covering many disciplines. We will focus on the 4 most important ones:

• Experience strategy (ExS) - UX does not only focus on end-user, it is also about bringing value to a business providing a product. Experience strategy is all about devising a holistic business strategy, incorporating both the customer’s needs and those of the company.
   
• Interaction design (IxD) - Interaction design looks at how the user interacts with the product considering all interactive elements such as buttons, page transitions, and animations to create desired user experience.
   
• User research (UR) - Understanding existing and potential users have high importance within UX. During user, research designers use various methods such as surveys, desk research, usability testing, and many more to find the most valuable insights about users to identify problems and help design opportunities to solve those.
   
• Information architecture (IA) - IA is crucial in helping the user to navigate their way around products. It focuses on organizing, structuring, and labeling content in an effective and sustainable way. The goal is to navigate users around the product and therefore, find useful information to successfully complete the task.

If you are wondering what UX designers can specialize in, it’s HCI-Human computer interaction, Audio and sound design, Spatial design, UX writing, Computer science, Motion design, Guidance systems and many more.
 

Distinguish between UX and usability

Many people think that usability and User experience are the same things. Or if someone asks them what is the UX, their answer is "the usability of the product". That is not true. Partly. Usability is a considerable part of UX, its definition says it is a quality attribute of the UI, covering whether the system is easy to learn, efficient to use, pleasant, and so forth. But that is UX as well right? Yes, however, while usability focuses on a product itself, UX covers the whole user interaction with a product since thinking about a product, buying it, unpacking, installing it, using it, etc.
 

What is UI design - User Interface design

The UI stands for "User Interface". It is about aesthetics and a graphical layout of interfaces across different devices. It consists of everything the user looks at - banners, images, the text they can read, buttons they can click on, sliders, input fields, etc. It is also about screen layout, transitions, any sort of visual element, interaction, or animation must all be designed.

UI has a huge role within the User Experience. An attractive interface can boost the experience to a higher level but on the other hand, User experience can be destroyed by an unpleasing interface.

It is more than an aesthetic

Even it looks like the only purpose of UI is to make the interface look visually attractive, it is more than that. The UI designers have to look beyond the aesthetic and craft the interface to match the purpose/personality of the app. It is up to them to make sure that every single visual element feels united, both aesthetically, and in purpose.

3 formats of UI

User interface designers are creating key points where users interact with a product. These points can have one of these formats:

• Graphical user interfaces (GUI) - Users interacts with visual representations of a product - screens
• Voice-controlled interfaces (VUI) - Users interact with the product through the voice - Siri, Alexa
• Gesture-based interfaces - Body motions are used to interacts with a product - VR games
   

6 key principles of UI

• Clarity - an essential part of a great UI. How effectively visual design prioritizes and conveys information
• Familiarity - Leveraging UI design principles and patterns but also ensure that all elements are in sync
• User control - Place user in control. Makes him feel like he can do whatever he wants. Make sure he can always move further in a process but he can always go back to the page they were last on.
• Hierarchy - arranging visual elements in a way that explains the level of importance of each element and guides users to take the desired action. 
• Negative space - The negative space creates emphasis on your content and it makes the content easier to spot.
• Accessibility - design the product for ALL users. Think about users who are visually impaired or disabled in different ways.
   

UX vs UI design - differences

To wrap up all information given before, the main difference between UX and UI design is that UX design is all about the overall feel from the interaction with the product, while UI design is all about the visual representation of interfaces.

The goal of UX designer is to identify and solve user problems, UI designer is looking for ways to make the solutions aesthetically pleasing and intuitive.

UX design usually comes first in the design process, followed by UI. UX designer maps out the product that works perfectly, UI designer fills it in with visuals and interactions.

To add, UX can be applied to any kind of product, not only digital but also physical, service, spatial, etc while UI is specific to digital products and experiences.

UX and UI design - collaboration

While UX designers think about the interface work, the UI designers decide how the interface will look like. UX and UI designers work firmly hand in hand and the collaboration is very close. 

UX designers work on the research, they have to decide which features should have the most priority and have to map the user flow through the product. Usually, they create clickable wireframes used for testing with users to uncover all bugs and pain points. 

This prototype is handed to UI designers who will bring it to life by creating an attractive, visual representation of all individual screens and touchpoints that the user may encounter. Keeping the purpose of the product in mind, they have to decide which style is the most visually pleasing, how elements are going to look across the whole product, how they are going to behave on tap, scroll, or swipe.

But what happened if we need to change something but the UI design is already done?

In many cases, the first release focuses on MVP-minimum viable product and then, more features are being added. The collaboration between UX and UI designers has to be even closer and constant communication is a must. 

So let’s imagine we have to add one more button to a screen. 

UX designers will determine how the screen with all elements needs to be re-organized, which could lead to a change in the element’s size or shape. UI designers have to adapt to these changes and come up with the best way to visually display them to deliver an interface that looks good, while also operating efficiently and intuitively.

However, usually in smaller companies, there is only one person who covers both UI and UX responsibilities. Having both UX and UI skills can make the whole process faster as some steps may be skipped, but on the other hand, the missing collaboration of people with different ideas and mindsets can conceal useful insights, therefore, make the user experience deficient.

What is your path?

If you are thinking about which path is the right one for you, we will give you a glimpse of each main responsibilities and tasks, as well as the skills needed for each position.

What does UX designer do

As the UX revolves around the user, the UX designer needs to have a lot of empathy, curiosity, analytical thinking and he has to be open-minded to be able to keep up with different user’s personalities. 

UX designers seek to make everyday products, services and technology as user-friendly and accessible as possible while working on every step of the design process. UX designer has to find the balance between fulfilling user needs, clients requirements while still thinking about making profits for a company.

Skills required:
 

To become a great UX designer, one needs to have a passion for user research, analysis, spending hours gathering data about the user but the product as well. UX designer has to be able to detect and translate the most meaningful user needs and requirements. Translating insights into a product starts with/by? building information architecture, the organization of information within a digital product. The great skill of wireframing and prototyping is a must, as well as the ability to test the prototype within the target group to get significant insights into the user experience of your product.
 

Tips for tools:

There is a wide variety of tools needed for each step of the design process. If you are not a fan of sketching the first prototype on paper, you can use Balsamiq to create hand-drawn wireframes digitally. To create flowcharts or any kind of diagrams, Lucidchart is what you should check. UXTweak will help you to your prototype/product remotely if you are working on a redesign. 

The no.1 tool in the GoodRequest is Figma, an online design platform that allows us to create, test and ship design faster by being able to collaborate with the whole team at the same time, what is more, there are many plugins that make the whole process faster and more efficient.

If you are not a fan of Figma, you can go for AdobeXD or Sketch (only available on MacOS).

What does UI designer do

If you see yourself more as a visual person, you may be more interested in the path of UI designer. Creating a visual design for different products is a crucial point in customer interaction with a product. The customer decides whether he likes the product or not in the first 8 seconds of interaction with it and it would be up to you to make him stay.
 

Skills:

Talking about skills needed to work as an UI designer, graphic design is one on the top followed by visual branding, UI designer needs to have knowledge about color theory, icon design, typography but responsive design as well to make sure all devices share the same visual identity. What can distinguish you from the crowd of UI designers is the skill to create animations, motion design or illustrate.‍
 

Tools:

To follow in UX designer’s footsteps, UI designer needs to have skills to design and prototype in Figma, AdobeXD or Sketch. To make the interface more aesthetically pleasing, skills in Photoshop, Illustrator or InVision are a requirement. What can make you more interesting to your future employer is the skill of AfterEffects, Animate or Axure.

How to become UX and UI designer

Educate yourself

While there are many institutions that offer courses on visual, interactive or graphic design, you will not find many for User experience. You need to work on your way to become UI or UX designer by yourself most of the time.
 

What you should do is educate yourself every day. The easiest thing to do is to listen to podcasts, interviews, read blogs or follow people on Linkedin. You can sign up for online courses on platforms such as Nielsen Norman Group, Interaction design foundation, or Udemy, which we at Goodrequests prefer because it is a benefit if you become a part of the GR team.
 

Events/workshops/hackathons/UX community

Look for a UX/design community nearby you, they will organize events you can attend, you will meet new people from the industry, you will make new contact for your future career but what is more, they will share their wisdom with you. 

If you are not able to attend events physically, it doesn’t matter anymore. You can attend most of the events comfortably from home, for that, we advise you to follow the community called Friends of Figma - we are the leader of this community in Slovakia and we organize Figma events with interesting people from different fields 4x a year.
 

If you think you already have some skills and you would like to start your career but you are struggling with the first step, join a hackathon. You can sign up as a team or you can join a team by yourself and together, work on a challenge for 24 or 48h straight and what is more, if your solution is good enough, there is a high chance you will get funding to realize it.
 

Internships

Are you looking for your first job without any luck? Try to look for an internship!
Maybe you get paid a little less (or nothing) but the experience and knowledge you will gain are invaluable. You will work as a full part of the company, you will join a design team and work on a project or some task, plus, you will have a tutor that will look after you and guide you through every step of your work. 
Right now, Paula, a student of high school joined our design team for a summer internship and she is working on an application for one of the most listened to radios in Slovakia.

Conclusion

We hope we made terms UI design and UX design more understandable for you after reading this article and that maybe, we helped you figure out in what direction you want to continue your career.

Do not forget that even these two terms involve different skill sets and one may seem more important, the truth is one cannot exist without the other. A great UX will not save an unpleasant interface but on the other hand, a beautiful interface that is hard to go through is useless as well. 

UI and UX go hand in hand and are integral to each other success.