The one question that comes to everyone’s mind who is new to designing, product or any other field. What is UI & UX? Is there any difference? Is it even important? This article helps you understand the importance and meaning of the terms
Let’s start with answering to the question in the headline itself first, the direct and blunt answer would be ‘YES’. So let’s learn about UI/UX in detail with the help of Five W’s framework. We will focus on What and Why in the article and the rest will be covered in future articles.
What is UI/UX
Now, let’s start with what is UI/UX. UI stands for User Interface. The User Interface can be anything, it does not have to be a screen. In the near future, it can be AR, or it may be VR. So we cannot define UI with boundaries and from time to time and product to product it will change. Let’s take an example of a traditional mobile app, there are a lot of interactive elements on the application screen to interact with. When you open a mobile app, you’ll see buttons that you can click on, you’ll see text that you can read, you’ll see images and logos and colours, you’ll see sliders and more. This is what a User Interface is. It’s all the elements inside the application that you can interact with.
UX on the other hand stands for User Experience. In basic terms, it means how easy or difficult it is for others to interact with the elements that are on the screen in your app.
Some of the questions that User Experience answers, 1. How easy or difficult it is to interact with the elements on the screen? 2. Is the app intuitive? 3. Does the app make sense? 4. Is the user getting confused while using the app? 5. Is the user making mistakes?
When it comes to User Experience, we can break down the complete UX into 5 elements.
Now let’s try to understand those elements one by one.
1. Strategy Strategy is the mere reasoning behind developing a product, feature or screen. The key questions that this element should answer are, i. Why are we making it in the first place? ii. What does the organisation get out of it? iii. What do the users get out of it?
2. Scope The scope is nothing but the set of features and the functions associated with it available within the structure. As a Product Manager, you have to make many hard decisions and the following are the things that you will face day in and day out, a. Hear in-scope and out-of-scope b. Make a tradeoff c. Spend a lot of time, energy and expense to make the vision come true
The scope has some questions associated with it, i. Do you include all the elements? ii. Which geographies do you cover? iii. Do you include other types of elements?
3. Structure The structure represents the user’s journey or the flow of the application and shows how each page in the experience connects to the other. Structure as an element has to answer the following questions, i. When does the user enter the feature? ii. How does the user enter the feature? iii. How does the user manoeuvre through features? iv. All the random questions about feature functionality.
4. Skeleton When it comes to the skeleton, it is nothing but wireframes and sketches of the features at the initial level. This includes drawing each step of the feature for the designers to understand the complete flow of the feature and its basic functionality. This helps you understand how the user will navigate through the feature and what details should be made available at each step of the feature for users. Elements in Skeleton are,
5. Surface(high-fidelity prototype) The surface represents the design of each page of the application. This is designing each page of the app within your skeleton so that it comes to life and feels really like something you might actually use. it is called a higher-fidelity prototype. And so, at this point, you’re starting to add colour, you’re adding logos, you’re adding brand. It’s becoming more and more tangible.
So in short,
User Interface is where one can touch and interact with all the elements on the screen.
User Experience is how one can interact with all the elements on the screen.
User Interface and User Experience, when put together can let the user have the five elements of user experience.
Why does UI/UX design Matter?
Building a feature or an application without complete knowledge of users’ intentions and requirements is just like walking into a dead end. If you don’t know whether a user wants a particular thing or whether you are solving a problem or not it makes no sense for you to invest time building a feature or product to that fact. Let’s take a look at the following image and try to understand how to determine the need for UX and UI,
1. Desirability As the name suggests, desirability stands for the user’s need for the feature or the product.
The important question you need to ask before building a feature is Do people want it? 2. Viability Viability suggests whether the feature is viable or not. You need to answer the following questions to understand the viability of a feature, 1. Is it economically possible? 2. What social considerations should be included? 3. Is it environmentally possible? 4. Are there enough resources? 3. Feasibility Feasibility shows whether the proposed idea is doable or not. Is it technically possible to engineer it? So to review when you’re trying to think about the why, why a feature should exist in the first place, why you should make this feature, and why user experience and user design exist, you need to think through desirability, viability, and feasibility. And if it meets all three of those criteria, you’re more likely to be successful with the feature or product.
More on this topic in the second part of the blog here — 2nd part of the blog UI vs UX.
I hope that this article helps you understand UI & UX along with their importance and the elements attached to them. Please share your thoughts on the topic in the comments. If you enjoyed this article, please follow me on Medium for more stories about Product Design and other Product Management-related topics.
I am always open to having a healthy conversation over a cup of coffee. Connect on LinkedIn here, Twitter here.
Yorumlar