My 5 step UI+UX Workflow: 2021 👨🏻💻
In the last 2 years, a lot has changed about our lives, how we work, interact, consume content, stay healthy, and much more. For me, the way I design products has changed as well. Hence, I thought it was a good time to pen down my design process and give an updated version of my previous article, ‘My 10 Step UX+UI workflow: 2019’, which received a lot of love 💙 from the design community.
Let me take you through my current design process, the tools I use and the people I collaborate with.
01. Discovery through research
Why is it important? Over the years, I learnt and tested out the wisdom that’s been out there for a long time, i.e. start with a problem. It is crucial to understand who your users are, what they want, why they want & how they want because the deeper you go into understanding the user and their problems, the better your solutions will be.
Users are the biggest asset in user-experience and research plays a key role in ensuring user-centricity.
How I do it? As my first step into the design process, I gather users’ pain points and challenges to identify problem areas. I employ both qualitative and quantitative methods to gather insights. My favoured techniques include contextual inquiry, cultural probes, virtual-shadowing & usage metrics.
Once I gather the raw data, I analyse and categorise the data. The first step here is to design a user persona. Then, organise user’s pain points & challenges in different ways.
Finally, I look for themes emerging from data. Themes are simply a group of pain points toward a similar topic. For example, if you are designing a digital bank, there can be themes like security, support, easy access, trust, transparency, etc.
Tools I use: Zoom, Notion & Logrocket.
Related resources:
- How to conduct user-interviews
- Guide to building user-persona
- How cultural probes make your user research even better
- Guide to Quantitative Research
02. Design strategy with product owner
Why is it important? While working for a product, it is crucial to collaborate with the product owner to define the scale of the problem, its business impact and prioritise items.
A good design strategy that fits the product vision helps me understand which problems to tackle first.
How I do it? I usually sit with the product owner to discuss the research findings. Often the product owner is also involved at the research stage, and hence he is aware of the findings. Involving product owner in research has been fruitful for me as a designer because it reduces the need to justify design decisions later.
In a meeting, we try to write user-stories, assumptions, considerations, risks, dependencies, and related issues for each identified problem area. Sometimes, when a problem is too big, we try to break it into smaller problems.
For prioritisation, we look at — how different problems fit into a product vision, % of users impacted, business impact and ROI of solving the problem. Last but not least, we also decide on a rough timeline for solving a problem and building a solution.
Tools I use: Notion
Related resources:
- 7 prioritization frameworks to help you make smarter product decisions
- How to choose your Product Prioritization Framework
03. Building user experience
Why is it important? This stage is the bread & butter for UX/UI/Product designers, and it is my favourite stage in the entire process.
Solving identified problems and defining the future through ideation methods is the core essence of building a user experience.
How I do it? First, I ideate possible solutions for a chosen problem. I write down my first 8–10 ideas and keep them aside. Then I do a bit of competitor analysis and trend analysis. Once I am done with ample secondary research, I return to the idea board and generate more ideas or improve upon existing ones. Doing 8–10 ideas before secondary research helps me avoid any bias formed by looking at existing solutions.
Once I have enough ideas, I narrow them down to 2–3 based on ease of use & feasibility. Then, with the chosen ideas, I create user-journeys that help me imagine how a user will go from point A to B. Usually, I do a few iterations before discussing it with the product owner. Involving the product owner at this stage helps me refine the journey, ideate on scenarios/edge cases, raise technical challenges and make sure that each user story has been covered in the user journey.
The outcomes of this stage are well thought-through user journeys that solve the problem at hand and cover all the possible scenarios.
Tools I use: Whiteboard, Sketches or FigJam.
Related resources:
- The process: using the Double Diamond
- Learn How to Use the Best Ideation Methods
- Guide to FigJam
- Journey Mapping 101
04. Designing user interface
Why is it important? User interface design is the bridge between user experience and the final product. It is a guiding light for front-end developers. It informs the back-end team about the required data, APIs, and other capabilities they might need to provide to front-end developers.
UI designing is the most affordable way to produce ideas & test them without diving into labour intensive coding.
How I do it? This is another diverge-converge stage where I start with sketching out different concepts on paper. At first, I focus on the number of ideas, choosing a few and refining them. At this stage, I also do secondary research where I focus on UI design trends and benchmark with leading products.
My next step is to define UX patterns. While defining these patterns, the focus is on ease of use, reusability, scalability and technical feasibility. My guiding light is Nielsen’s 10 general principles for interaction design for ease of use.
Once I am satisfied with the paper wireframes, I convert them into high-fidelity screens showcased to the team and users. I leverage the design system, which helps me reduce the time to re-design elements, maintain consistency, and focus on providing a good solution.
Tools I use: Pen & Paper, Figma or Sketch app
Related resources:
- Nielsen’s 10 general principles for interaction design.
- Web Content Accessibility Guidelines (WCAG)
- Google Material Design Guidelines
- Apple Design System
05. Test & validate design
Why is it important? To connect UI design to the research, it’s essential to validate the design product/feature with end-users and get their feedback as early as possible. It is also necessary to validate the designs with the tech team to analyse the feasibility and get their input.
User-testing connects research with your designs and validates the design without building the entire solution.
How I do it? For new features and significant UX improvements, I like to engage with end-users in a 1:1 session where I would hand them a prototype to play with. Lately, I have been doing most usability testing remotely using online tools.
In my team, we have design-dev connects where we discuss the designs and get feedback from developers. We also try to understand any dependencies and pre-requisites to develop a solution. As a designer, I often design a north-star, i.e. the ideal solution we want to give to end-users. However, at times, developing a north star might take too long, and thus we decided on doing an MVP version first to get a solution released to the users.
After releasing a solution, we try to track its adoption, success/failure rates, time on task (if required) and get feedback from users. This is usually done with tools that can provide quantitative data.
Once I gather all the feedback and data points, we move towards a V2 that is more refined than the MVP. Sometimes, there can be a time gap between V1 & V2, which is common across the teams I have worked on.
Tools I use: Zoom, Notion, Logrocket, Maze & custom usage metrics.
Related resources:
Additional steps
The steps I mentioned above usually apply to any product you are designing. However, there might be some additional steps that I follow based on a need at times.
01. Heuristic Evaluation
When to do it? If you take over an existing product, you might start with a heuristic evaluation. Then, evaluate the product based on usability, accessibility and effectiveness. Refer to Nielsen’s 10 general principles for interaction design for this analysis.
02. Creating information architecture
When to do it? If you are designing a new product or believe that navigation is a significant problem in your existing product, you should consider new information architecture. To create information architecture I prefer to have the research and design team co-create using methods like card-sorting.
03. Building/updating design system
When to do it? If you are part of an organisation that does not have a design system, it can be worth demonstrating the value of a design system to the team and getting them excited about building one. Since building a design system is a collaborative effort between designers and developers, you must have everyone on board before starting.
04. Brainstorming sessions/workshops
When to do it? Sometimes, you build a new product or a significant feature that everyone is looking forward to. In such cases, I prefer to engage with the team early on to get their perspective. I like to organise a brainstorming workshop where everyone brings their ideas to the table and select the best ideas from the bunch. This ensures inclusivity, and as a designer, you understand the problem at hand from varied perspectives.
05. Annotate designs
When to do it? Your designs might be self-explanatory to you, but they are not to others. I’ve found that using simple annotations to provide information about functionality, intention, interactions, states, and other complexities help developers in their process.
Thanks for going through my experience. If you liked reading this article then send me some applauds and explore other articles I have written. 👏🏻👏🏻👏🏻👏🏻
As always you can connect with me over LinkedIn and see my work at www.shubhamkhatkar.com
