UX or User Experience is the key criteria for successful products these days. It ensures that websites or mobile apps are up to the mark. Being up to the mark means, your design is delivering content as per the expectations of the people using them. Therefore, one needs to understand many things related to the users like their needs and life style.
Hi I am Shreya, a student of UX Design Course in ADMEC. In this blog, our experts from UX design team will share practical steps to help you understand UX design.
Table of Contents
- Understanding UX Design
- Step 1: Understanding Your Target Audience
- Step 2: Defining User Personas
- Step 3: Ideation and Structuring the Design
- Step 4: Finalizing and Prototyping
- Step 5: User Testing
- Conclusion: Continuous Improvement and Impact on Business
Understanding UX Design
Before talking about the UX design process, first we should understand what UX design is.
User Experience (UX) design is about creating products that provide meaningful and relevant experiences for users.
To understand UX design better, consider a simple mobile phone feature: making a call. No matter what age you are or how tech-savvy you are, making a call on a mobile phone is straightforward. You open the dialer, input a number, press the call button, and to end the call, you simply press another button. Putting the call on speaker or mute is also easy to figure out. This seamless experience, which makes such features accessible to everyone, is the essence of good UX design.
When a product is easy to use, it provides a delightful experience. This applies to anything you design, like apps, websites, or things you can touch.
Step 1: Understanding Your Target Audience
Knowing your related users is the first step and the information you will collect will be followed till the end. Understanding users is a lengthy task which involves too many steps. Conducting interviews, creating personas, clustering of data, finding problems are a few only.
Example of understanding users
I worked on a project while attending UX Design training at ADMEC, i picked a very useful topic. It was to address issues with Women PG (Paying Guest) accommodations in Delhi. So, I decided to make an application to resolve those issues which I faced personally there.
To gather initial insights, I casually interviewed 5-6 girl or women. To get structured data, I created a Google Form and received 33 responses. Additionally, I conducted in-depth interviews with two women aged 19+ facing multiple issues in their PGs. It uncovered their frustrations, goals, and specific pain points as my UX Design teacher Ravi Sir guided me.
In another project, I worked as a team leader to redesign the “Video Editing Institute” website. We began by analyzing data from the video editing site and the institute’s primary website (ADMEC). We also watched interviews on YouTube and conducted interviews with a domain expert to understand the needs of our users better.
To see the final project, you can contact our institute on the give numbers in footer of this website.
Step 2: Defining User Personas
In this step, you use your research to make personas and map how they feel. These characters stand for different kinds of users, and they help you design with the users in mind. Empathy maps help you understand users’ emotions, thoughts, and behaviors.
Empathy maps: Empathy maps are tools used to visualize a user’s thoughts, feelings, behaviors, and experiences, helping designers understand and empathize with the user’s perspective.
Example
For the Video Editing Institute website redesign, we analyzed data to identify user traits and considerations. Affinity maps help us organize user research by grouping similar ideas together, while empathy maps help us understand user emotions and behaviors. This information informed the development of detailed User personas, which guided the design direction.
Affinity Maps: Affinity maps are visual tools used to organize and categorize research data into themes and patterns, facilitating insights and decision-making.
Step 3: Ideation and Structuring the Design
This is where creativity comes into play! Generate and iterate ideas for better designs. Start with How Might We state to reframe problems into design opportunities to make it even better. Brainstorming sessions generate ideas, which are then refined into User flows and Information Architecture to map out the user journey. Wireframes, both rough and detailed, show the layout and structure of a design.
Iterate:
Iteration is common in improving anything. We can’t achieve the best in first attempt, so iteration or repeating for improvements is expected. We keep creating ideas and features, analyze and apply.
How Might We Statement or HMW:
“How Might We” is an ideation phase activity. Our teachers told me they found it from Design Sprint Book which is written by the veterans of Google. This activity gives open challenges from the team members on new opportunities.
User flows:
Every user has a goal while visiting a website or mobile app or using a product. User flows are visual maps which show all the steps a user takes to achieve a goal. It helps UX designers to understand the user’s journey. User’s journey is about knowing how an user gets particular information while on your website or app.
Information Architecture:
Information Architecture or IA is one of the most important topics to understand for UX designers. IA helps in structuring information for a design so that users can easily find what they need.
Wireframes:
Wireframes are semi-finished or skeletal outlines of an interface. It draws layout and functionality without all design elements. I understood that wireframes encourages to focus on grid system, space, size of elements. These are very much required to create a design with good information navigation.
Example 1: PG Accommodation App
After understanding user needs, I conducted a Competitive Analysis to learn from existing solutions. Using insights from Empathy and Affinity maps, I developed “How Might We” statements to address identified problems. I created rough wireframes first, followed by high-fidelity wireframes with design elements and details.
Extra points: Competitive Analysis: Competitive analysis involves evaluating competing products or services to identify strengths, weaknesses, and opportunities for improvement, informing the design strategy and differentiation of a new product.
Example 2: Video Editing Institute Website Redesign
Like the PG accommodation app, we started with low-fidelity wireframes in the Video Editing Institute project to brainstorm user flows and information architecture. We continuously refined our designs based on feedback, ensuring a user-centric approach.
Step 4: Finalizing and Prototyping
Our focus here is to finalize the design so that we can move to the next step. We should conduct a final check on features and looks to ensure UI works consistently. The final Prototypes is not enough, we must add micro-interaction to simulate the best user experience. If all these things are done then we can move towards the user testing.
Example: Video Editing Institute Website Redesign
In the website redesign project, I developed a comprehensive design system to maintain consistency with typography, color schemes, styles, and UI elements. High-fidelity mockups and final prototypes were created to demonstrate the website’s functionality and design.
Extra note: High-fidelity mockups: High-fidelity mockups are the final and fully detailed interfaces.
Step 5: Checking if it’s easy to use and can give it to the developers
Usability Testing with real users is super important. It helps find problems and get suggestions to make things better. Once validated, the final step is to hand off the design to the development team with detailed specifications, assets, and documentation.
Our team of few UX design students conducted a vast testing. We tested it on all our mobiles, all computers in institute’s lab, and mobiles of our faculty members.
Extra note: Usability testing: Usability testing calculates ease of use and effectiveness of product by gathering feedback from real users.
Example
During the Video Editing Institute website redesign project, we conducted usability testing to gather feedback with real users. Our team applied all inputs to improve the design and we did it many times. Working closely with our Stakeholders like students and teachers ensured a smooth handoff.
Extra Note: Stakeholders: Stakeholders are individuals or groups with an interest or influence in the product, including clients, users, developers, and business representatives, whose input and feedback are essential for the design process.
Conclusion: UX is About Continuous Improvement for Better Business Impact
Always remember, The UX design process is iterative and flexible so it needs patience. You can’t achieve delight in first try. The steps you take should be dependent on user requirements and goals. It’s like a never-ending loop of making things better, always changing your product to match what people need.
My experiences with the PG accommodation app and the Video Editing Institute website redesign underscore the critical role of thorough research, empathy, and collaboration in achieving successful UX outcomes. If you focus on what users need and keep improving based on what they say, you can make your designs easy to use and leaves people feeling good.
Master UI/UX Design with our specialized training.
