The UX Process: A Practical Explanation
July 30, 2024
Ceara Crawshaw
Knowing that the goal of UX is designing with humans in mind and that the expected results are more usable and more pleasant products and services – the remaining gap to fill is how to get there. While specifics differ from one designer or one organization to another, UX methods tend to follow similar broad strokes. The design process uncovers many opportunities for businesses, whether that’s cost reduction or seizing new opportunities (we created an article to help calculate the ROI of UX research and design, if you’re curious to find out more).
An important first phase in any project, design or otherwise. In UX, discovery involves doing as much initial research as possible to understand what we’re looking at. Understanding the context of a problem is key to understanding the problem itself and its potential solutions. The intensity of the discovery phase corresponds to the scope of the project and nature of the business. Often on smaller teams, discovery can be expedited or spread more naturally throughout the design process.
Here’s a few research activities UX designers often perform during this phase:
This is a term we made up at Pencil & Paper - it’s an expedited onboarding process where we facilitate contextual understanding of the tech, business, data and user context.
Main benefit: gain a holistic understanding of the project, create collaborative relationships and access necessary documentation and artifacts for study.
This process happens throughout the process but often kicks off in the beginning. This is a key part of the iteration cycle, where user input informs direction. Interviewing can be a very efficient method to derive huge insights. In B2B SaaS products, we often focus our interviewing a lot on mapping existing workflows, workarounds and painpoints.
Main benefit: this insider perspective unlocks new understanding, smashes assumptions and gives users the opportunity to pipe in their thoughts.
Put simply, stakeholder interviews are just having a conversation with key people involved in making the project a reality. In organizations where information is scattered or it’s important for specific people to be involved, stakeholder interviews become more and more important in order to secure alignment. At P&P, we focus on deriving subject matter from specific subject matter experts (SMEs) during our context mapping process, so we treat stakeholder interviews as a different thing.
Main benefit: these interviews help us get more information about the challenge at hand and understand what it takes to make the project successful.
This is one of the most fun and fascinating methods of research out there. In short, it’s observing people in their natural habitat to understand how they do things.
Main benefit: looking at how people do things in their natural environment can help us identify things that users are not aware of because it’s so normal for them. You can observe things that people would never describe to you.
A lot of times, the equivalent of this comes with screen sharing their workflow in software, but every once and a while it’s hyper-relevant to test irl. Example situations where this is important: a science lab, a manufacturing factory floor, a retail environment etc.
Examining direct or indirect competitors and the industry at large to suss out competitive design advantages. This can be a little difficult for B2B SaaS products, as many require meetings with sales people for a demo of the product.
Main benefit: finding weaknesses of competitors can give us ideas for new concepts. We can also find places where we don’t need to reinvent the wheel.
Taking in information at scale can be very useful for analyzing and determining where to focus the UX effort.
Main benefit: this can help support places to dig into deeper with design and research efforts. Analyzing these numbers often can populate well-informed and interesting research questions.
This is where UX designers think about what they’ve seen or heard during the discovery phase and begin putting things together into insights that will inform what they design. This is where the ambiguity between phases begins. There are parts of each of these phases that overlap with one another.
As part of the context mapping process, we take in a lot of information. At this point we draw out the logic and groom rough notes to convey our understanding of the logic of the software at hand. We might draw flowcharts, user flows etc to begin. However, as we start the design phase and begin imagining the future, we’ll use the same types of diagrams, just in the future-facing context.
Main benefit: creates alignment of the team and a shared understanding of the “as is” scenario.
These are narratives that are created to describe users of the software you’re working on - the exact format isn’t important, just that it illustrates interesting and relevant information to the team.
Main benefit: this can create understanding and challenge incorrect assumptions about users and can get the team focusing on specific personas in the software. It’s a step towards more user-centricity for many teams.
Zeroing in on the precise problem to solve is key to making sure you spend your UX dollars wisely, and get the best ROI possible. This is where we formulate a problem statement based on the information at hand.
Main benefit: this focuses the team not on “what can be built” but “what users need us to build” which is a focus that many companies need. This is hyper-relevant especially now that we grapple with design user-centred AI features.
This is the stage most people get excited about; when ideas begin to materialize and it starts to feel like there may actually be a light at the end of the tunnel. An important principle in UX design is testing and validating ideas. Checking in with your users at multiple points throughout the design phase helps confirm that you’ve made sound design decisions and highlights how you can improve and refine your design over many iterations.
Creating wireframes or “low fidelity” sketches of screens and interaction flows is key to the design process, this is a super fast and cheap way to start aligning around your ideas and exploring possibilities.
Main benefit: cheap and collaborative method to explore ideas, which not only designers can do.
This is where the interface is able to be interacted with. Prototyping is making our static wireframes come to life through clickable prototyping (in Figma and other design products), or with code.
Main benefit: you can test out ideas in more depth and “feel” the flow and interactivity.
Using either prototypes or live code, you can run through tasks and flows with users and observe their perceptions, roadblocks and usability issues (points of confusion).
Main benefit: introduces real feedback which informs direction as well as “quick fixes”.
Though we involve developers throughout the entire design process, this is when we work together to make the thing come alive!
This is the visual specs, interaction behaviour and system logic that applies to the design work, it’s packaging up the deliverables for software developers to build. Other users of documentation might be the product team, technical writers, quality assurance analysts and potentially back-end devs and data people.
Main benefit: clarity of information, ease of collaboration and reduction of “mis-implementations” of designs.
Once the entire user experience process has been completed, you often loop back to assess a feature or flow over time and determine if more UX love, innovation or general richness needs to be added. This process is happening in shorter bursts and longer cycles depending on the scope of problem you’re trying to solve and how much design exploration they require. There’s a big difference between developing a whole new paradigm of data analysis and fixing a bad user management screen for example.
If you’re itching for your team to come to appreciate the design process and how designers think, consider taking our Intro to UX Masterclass!
Do a mini UX audit on your table views & find your trouble spots with this free guide.
Be the first to know about our upcoming release!
.webp)
.png)
.png)
