The UX Process
The approach to any project can significantly differ depending on factors such as the presence of defined requirements, access to real users, available resources and project deadlines.
The UX design process – and design in general – is non-linear, iterative and user-centric, with a strong focus on empathy for the users and their needs. There are several design thinking frameworks but I tend to follow the design thinking process as first defined by the Hasso Plattner Institute of Design (d.school) at Stanford which describes design thinking as a 5-stage process, being:
Empathise > Define > Ideate > Prototype > Test
These stages are not always sequential and sometimes there are additional steps! Some stages can be run in parallel, they can run out of sequence and some stages are repeated (iterations) when required.
As any project progresses, I will often revisit and refine various stages of the process as I/the team gain a deeper understanding of user behaviour and preferences. Nevertheless, the following guiding UX principles form the framework for every design project I work on, although not necessarily in the order listed below and sometimes not all processes are required.
The UX Process
1 Research and Discovery
User Research: Understand the needs, behaviours and preferences of the target users through techniques like interviews, surveys and observations. Other methods for research include contextual enquiry, card sorting exercises and user analytics such Google analytics or HotJar heatmap analysis.
Market Research: Analyse the competition and industry trends to identify opportunities and gaps. This includes competitor analysis and heuristic evaluation where a product’s user interface is measured against a set of established usability principles (heuristics) to identify usability issues.
User research generates various output artefacts and deliverables that help in documenting and communicating research findings to stakeholders and inform the design and development process. Artefacts include personas, customer journey maps, user flows, survey results, affinity diagrams, heatmaps and other quantitive and qualitative data.
Every project contains some aspect of user research, sometimes in-depth and sometimes just a light touch. Navigate here to read my case studies demonstrating various user research methods.
2 Define Goals and Objectives
This is a critical initial step in the UX design process that lays the foundation for a successful project. This phase serves as a compass, guiding the entire design process.
As a UX designer, my foremost responsibility is to understand the project's purpose and align it with user needs and business objectives. During this stage, I collaborate closely with stakeholders, including clients, product managers and end-users, to gain a comprehensive understanding of what we aim to achieve.
It is essential to set clear goals or key performance indicators (KPIs) and define what the business aim to achieve with their product or service. During definition, it is important to understand the right problem(s) to solve.
User-Centricity - I begin by identifying the target audience and their needs. Conducting user research, including surveys, interviews and usability testing helps me gain valuable insights into user behaviours, preferences and pain points. This research lays the groundwork for creating user personas, which are detailed profiles of typical users.
Personas are best when they are based on real users but sometimes proto personas can be used. Proto personas are a lightweight form of ad-hoc personas created with no new research. They catalogue the business team’s existing knowledge (or best guesses) of who their users are and what they want.
Business Objectives - it's equally important to align user needs with business goals. I work with stakeholders to define clear and measurable objectives that the project should achieve. These objectives may include increasing user engagement, improving conversion rates, streamlining customer support enquiries or enhancing brand loyalty.
Alignment - Once we have a clear understanding of both user needs and business objectives, the next step is to ensure alignment between the two. This involves crafting a UX strategy that bridges the gap, ensuring that design decisions directly contribute to achieving user needs and business goals.
Key Performance Indicators (KPIs) - KPIs play a pivotal role in this stage as they help the team measure success of our UX design, and the product development, efforts. There are many ways to measure KPIs including conversion rates, user engagement, customer satisfaction (CSAT) and net promoter score (NPS), task success rate, usability metrics and user retention.
3 Ideation and Conceptualisation
In UX design, ideation and conceptualisation are crucial stages in the process of creating user-friendly products or interfaces. These stages involve generating ideas and refining them into solid concepts that can be developed further.
Ideation: the creative process of generating a wide range of ideas without judgment. It's about brainstorming and exploring different possibilities to solve a particular problem or meet a user's needs. For example, when working at Ericsson in the ideation stage, we gathered together the team of designers, developers and subject-matter experts and encouraged them to brainstorm ideas for unique features that would make the application unique and meet the specific needs of the users identified during research.
Conceptualisation: the process of taking the best ideas generated during ideation and turning them into concrete concepts. It involves defining the core functionalities, user flows and overall structure of the product or interface. During this phase, I aim to create a clear vision of what the final product will look like. Continuing with the Ericsson example, one of the ideas was to show a clear visual gauge of cell capacity for a network operator. During conceptualisation, I worked with the team to define how this feature would work in detail with the user flow outlined and wireframes created to take the abstract idea into a tangible feature.
4 Information Architecture
Information architecture, in the realm of digital and web design, is akin to the blueprint of a building but for a content-rich website or application. It encompasses the structure, organisation and classification of information to facilitate efficient navigation and comprehension for users. It’s the behind-the-scenes framework that ensures users can easily find and understand the content they seek. User research tasks such as customer journey maps, user flows and card sorting often inform the information architecture hierarchy. Here is an example of how to structure information architecture: -
Content Categorisation - I'd start by categorising the website/application’s content into logical groupings. For instance, products, services and news and events would be distinct categories. This ensures that users can quickly identify where to find specific types of information.
Navigation Structure - Next, I'd create the primary navigation menus, typically found at the top or on the left of a website. These menus reflect the content categories established earlier and provide users with clear entry points to different sections of the website.
Search Functionality - not all websites and applications require search but it needs to be robust and effective to make it usable. Search allows users to quickly locate specific content and is crucial for a large, content-rich website. Good search can be very complex with hierarchical categories and subcategories. You can read an example case study from HDR about search here, where the user is presented with multiple categories such as “Coverage” with sub-categories of “Spatial”, “Physical sample available” and “Follow up”, all of which contained their own sub-categories!
Metadata also plays a big part in effective search functionality. In HDR’s case, this included author name, published date, provenance and more. The metadata elements help users filter and sort content effectively.
User-Friendly URLs - the URLs of individual pages within a website should be descriptive and intuitive. For example, the URL for a page about HIV medicines in my ViiV Healthcare case study could be "https://viivhealthcare.com/viiv-hiv-medicines/". This not only aids users in understanding the content but also benefits search engine optimisation (SEO).
Feedback and Iteration - Information architecture is not a one-time task; it's an ongoing process. Regularly collecting user feedback and analysing user behaviour can help refine the structure and organisation of the website over time. For instance, if users struggle to find a specific section, it may indicate the need for reorganising or revising the information architecture.
5 Prototyping
Prototyping is a vital step in both the UX and UI design process. It involves creating interactive, low-fidelity or high-fidelity representations of a digital product or website to test and refine user interactions and flows. It allows me to simulate how users will interact with the product, gather feedback and make usability improvements before the development phase.
I predominately use Figma for prototyping, Sketch much less so these days due to the limitations of that tool such as the need for specialist software to be installed which is not platform agnostic (Mac only at the time of writing).
With Figma, I can create style guides, libraries and design systems in the same tool. It is browser-based as well as offering an app for all platforms, so it is much more accessible for everyone involved in a project lifecycle. I can create low-fidelity wireframes and high-fidelity interactive prototypes in the same tool giving me the ability to demonstrate the designs and user journeys to stakeholders and developers to help them understand user flow and functionality. I can also use the prototypes for usability testing with real users.
I can also use Figma for UI prototyping, which focuses more on the visual and interactive aspects of a design, ensuring that it aligns with the intended look and feel of the final product. UI prototypes are more refined and often higher fidelity than UX prototypes, as they aim to showcase the final aesthetics, typography, colours and animations.
In summary, UX and UI prototyping are essential steps in the design process, helping me to create and test user experiences and user interfaces before the development phase. Tools like Figma, Sketch, Protopie and Axure RP (I use these latter two tools for more advanced, dynamic interactions that simulate real user experiences once coded) offer various levels of functionality and interactivity, enabling me to choose the most suitable one for each project's needs. These prototyping tools ultimately facilitate collaboration, iterate designs and ensure that the final product meets user and business expectations.
6 Visual Design
Visual design for websites and applications plays a crucial role in creating an appealing and user-friendly digital experience. As a designer, I rely on industry-standard tools like Figma and Adobe Creative Cloud, including Photoshop and Illustrator, to bring my creative ideas to life but I often start with blank page and a pencil!
The visual design process is also non-linear but does follow these principles: -
Research and Ideation - before I dive into the design process, I begin with research. I study the target audience, competitors and industry trends. This helps me understand the preferences and expectations of the users.
Wireframing and Layout - Figma is my go-to tool for wireframing and initial layout design although I really enjoy working with Balsamiq too. I create a basic structure for the website or app, keeping in mind the user flow and content hierarchy. I use simple shapes and placeholders to outline the placement of elements like navigation menus, buttons and content sections.
Creating Visual Elements - once the wireframe is approved (hopefully, but not always, user-tested!), I move on to Adobe Creative Cloud and Figma. In Photoshop & Illustrator, I design custom graphics, such as logos, banners, icons, symbols and background images.
Typography and Colour Theory - Typography and colour choices are critical in creating a visually pleasing design. I select fonts that align with the brand's identity and legible text sizes, always bearing in mind accessibility and colour contrast to keep the design inclusive for all users.
UI Component Design - Adobe Illustrator and Figma come into play when designing custom UI components. I create buttons, icons and other interactive elements in vector format to ensure they scale smoothly across various devices.
7 Usability Testing
Usability testing is an essential method in the field of user experience (UX) design and product development but from my experience, it is often the most challenging aspect in a project. It involves the evaluation of a product, such as a website, mobile app, software application or physical device, to assess how effectively and efficiently it can be used by its intended users. The primary goal of usability testing is to identify usability issues and gather feedback to improve the overall user experience.
What makes this challenging is presenting the product, whatever that may be, to the actual intended audience. Real users are sometimes offshore, unavailable, too busy or simply off-limits, so testing can get very inventive!
Below I have listed some key aspects of usability testing but this is in no way definitive, as there is always another way to conduct effective usability testing:
Purpose - Usability testing aims to understand how real users interact with a product and to uncover any usability problems that might impede their ability to achieve their goals. It also seeks to gather qualitative data on user preferences and expectations.
Participants - Usability testing involves recruiting a group of representative users who match the product's target audience. The number of participants can vary but is often around 5-10 individuals. These participants should ideally be unfamiliar with the product being tested to ensure unbiased feedback but this is most certainly not always the case!
Guerrilla Usability Testing - sometimes access to real users is just not possible so other tactics are required, such as guerrilla testing. Guerrilla usability testing is a quick and inexpensive way of testing a concept, wireframe, prototype, website or application on real user. Instead of recruiting a specific target audience to take part in sessions, participants are approached in an ad-hoc way, sometimes in public places and asked to participate in research. Whilst they may not be the exact target audience, they can be very effective in testing hypotheses and I have utilised guerrilla usability testing on several projects.
Test Scenarios and Tasks - Usability tests are typically structured around specific scenarios (use cases) and tasks that users are asked to perform with the product. These scenarios simulate real-world usage and may include common tasks that users are expected to complete. For example, when testing Petplan Equine’s Quote and Buy prototype, we asked users to complete each stage of the process separately first, then after iteration on each step, we tested the end-to-end process.
Testing Environment - Usability tests can be conducted in a controlled lab setting, remotely over the internet or in a participant's natural environment, depending on the research goals and resources available. I have even conducted tests in coffee shops, the foyer of Health Data Research and in a branch of Boots in London!
Usability labs are equipped with recording equipment to capture user interactions and facial expressions, which can provide valuable insights but these can be expensive so, from my experience, are rarely used. A typical environment will be a testing room where the participants and a UX researcher (usually called a facilitator or moderator) will be placed and occasionally an observation room, where an additional observer and other stakeholders can monitor the test sessions.
Moderator - A usability test is usually facilitated by a moderator who guides participants through the test, explains tasks and observes their interactions. The moderator's role is to maintain a neutral stance, avoid leading questions, and ensure the test proceeds smoothly.
Data Collection - Usability testing gathers both qualitative and quantitative data. Qualitative data includes direct observations, user comments and feedback during the test, while quantitative data may include metrics like task completion time, error rates and user satisfaction ratings.
Analysis and Reporting - After the usability test, the collected data is analysed to identify usability issues and patterns in user behaviour. Common issues may include difficulties in navigation, confusing terminology, slow task completion and frustration expressed by participants. Sometimes the findings can be subjective such as “I don’t like that colour”, so the ability to decide the difference between subjective and real usability issues is essential.
The findings are documented in a usability report, which includes recommendations for design improvements. There are a number of ways to compile analysis and produce usability reports, I like to use FigJam boards as they are collaborative, easy to use even for novices and it keeps design and testing within the same platform but I also work with Miro, spreadsheets and good old-fashioned Post-It notes too!
Iterative Design - Usability testing is typically an iterative process. After identifying usability issues and making design changes, further rounds of testing are conducted to assess the effectiveness of these improvements. This iterative cycle continues until the product reaches a satisfactory level of usability.
With the increasing adoption of Agile project methodology across various projects, I've developed a streamlined approach that integrates usability testing seamlessly into sprint cycles. While it does require dedication from Scrum teams, the advantages are evident as it enables the rapid detection and resolution of usability issues within the same sprint, followed by retesting before developers proceed.
This approach also necessitates commitment from the development team to embrace the continuous deployment and continuous integration development cycle, which may not always be feasible depending on the technology stack in use. Nonetheless, the potential for iterative design and testing within sprints remains achievable, and the benefits are readily apparent.
Benefits - the benefits of usability testing are obvious as it helps to improve product quality, enhance user satisfaction and reduces the risk of costly post-launch revisions. It also provides valuable insights for designers and stakeholders, helping them make informed decisions about the product's design and features.
In summary, usability testing is a critical step in the UX design and development process, which surprisingly is often overlooked due to budget constraints, access to real users and buy-in from management. When usability testing is conducted, it helps designers and product teams create products that are user-friendly, efficient and aligned with user needs and expectations by involving real users in the evaluation process.
8 Iterate and Refine
In the UX process, the "iterate and refine" stage is a significant, pivotal phase where I meticulously fine-tune the design based on valuable user feedback and the insights gained from testing results. This stage embodies the essence of user-centric design and it's where truly exceptional user experiences are crafted.
By actively seeking out user feedback through various user research channels, such as surveys, interviews and usability testing sessions, I listen attentively to what users have to say about the product, paying close attention to their pain points, preferences and suggestions. This direct interaction with users is invaluable, as it provides me with firsthand insights into their wants, needs and expectations.
Once user feedback has been reviewed and analysed, I look for common themes, recurring issues and areas where the design may be falling short of users requirements and helps me identify key areas for refining or improving.
After pinpointing areas in need of refinement, I start to make necessary adjustments to the designs. This might involve modifying the user interface, simplifying navigation or rethinking the overall user flow. The goal is to address user pain points and make the product more intuitive and user-friendly.
It is important that I remain open to creative solutions and innovate ideas through this process. It's not just about fixing what's broken; it's about continuously striving to enhance the user experience and exceed user expectations. I'm always on the lookout for opportunities to surprise and delight users.
Of course, further testing is conducted as refinements are implemented to ensure that the changes are having the desired impact. Usability testing, A/B testing and user feedback loops are some of the methods I use to validate that the design adjustments are moving in the right direction. This is a continuous and dynamic cycle of iterate > refine > test > repeat. The iterative approach allows the product to gradually evolve in a user-centric manner, improving with each iteration and keeping the design tuned into business goals and user expectations.
9 Development and Implementation
During the development and implementation stage of the UX process, I work closely with developers to bring the approved design to life. Collaboration with the development team is crucial to ensure that the final product aligns with the design vision.
One of my key responsibilities is to make sure that the design is faithfully translated into the actual product. This means that every detail, from the layout and visual elements to the interactions and user flows, should accurately reflect the approved design. To achieve this, I often use tools like Figma hand-off to provide developers with the necessary assets, specifications and guidance. This helps streamline the development process and minimises the risk of discrepancies between the design and the final product.
Regular developer demos during sprint are perfect ways to monitor design-to-development integrity.
10 Launch and Monitor
In this exciting phase, we reach a critical juncture where the team takes the product that we have created and release to the intended audience. This is not just about introducing the product to the real-world environment, nor is it the end of the design and testing process; it marks the start of post-launch nurturing to ensure it continues to meet the expectations so meticulously considered through earlier phases of the process. Quite often, the launch means the end of contract for designers like myself but here are the activities I normally action or at least recommend: -
Product Release - this is usually handled by the development team and often involves a planned rollout strategy to mange the launch effectively from the development/UAT environment to live production.
Monitor User Feedback - After launch, it is important to monitor user feedback channels such as customer support, social media and dedicated feedback channels on the product itself in the form of customer satisfaction surveys (CSAT) or net promotor score (NPS) feedback. Asking users directly for their feedback is n invaluable source of insights but must be used in moderation.
Usage Analytics - I have worked with a range of analytics including HotJar, Google and Adobe and I rely on usage analytics to gain a deeper understanding of how users are interacting with the product. Metrics like user engagement, retention rates and conversion rates provide data-driven insights into the product's performance. This is a fairly specialist area and some organisations engage full-time user analytics experts, especially for B2C websites and applications where sales funnels are paramount for success.
Iterative Process - it is important to be vigilant and track any potential issues such as bugs, performance bottlenecks or unexpected user activity. There should always be an active process in place post-launch to identify and address user issues to ensure the positive user experience is maintained but also to identify opportunities for feature enhancements in a proactive way.
In essence, the "launch and monitor" phase is a dynamic and user-centric stage in the UX process. It involves not only releasing the product but also actively listening to users, tracking performance and making necessary adjustments. This ongoing commitment to refining and perfecting the product ensures that it remains relevant and valuable to its audience in the long run.
11 Post-Launch Evaluation of KPIs
Post-product launch, KPI monitoring is the compass that guides an organisation toward its goals. It involves systematically tracking key performance indicators (KPIs) that are tied to business objectives, user satisfaction and ultimately, product success. These metrics provide valuable insights into the health and performance of the product in the real world.
KPI monitoring allows businesses to gauge the impact of their strategies, identify areas for improvement and make informed decisions. Whether it's measuring conversion rates, user retention, revenue growth or user satisfaction, a well-structured KPI monitoring system empowers organisations to adapt, iterate and optimise their product and marketing efforts to achieve sustainable success in a dynamic and competitive landscape.
12 Maintenance and Updates
Ongoing maintenance and updates of a website or application post-launch are paramount from a user experience perspective. To ensure a positive and effective user journey, it is essential to address evolving user needs and emerging issues. Regular updates allow for the incorporation of user feedback, improving usability and functionality.
Keeping the design and features current ensures that the product remains relevant in an ever-changing digital landscape, ultimately enhancing user satisfaction and engagement. Neglecting maintenance can lead to a decline in UX quality, potentially driving users away and impacting the overall success of the product.
Therefore, dedicating resources to continuous maintenance and updates is a strategic investment in user-centred design and long-term success.