Brook
Sexual health & Wellbeing experts
Project
My Brook
Digital platform to access sexual health services
Role
Product Designer
Year
2023
Background
Brook—a free & confidential sexual health and wellbeing services in the UK. I was the main product designer for Brook from 2022 to the end of 2023 during my time at Mindwave Ventures. This case study delves into the intricate design process of digital front door that resulted in a seamless and user-centric platform, redefining the way users access sexual health services.
Problem & Objective
To design a personalised digital space
Brook's existing digital portal allowed patients to order STI kits online and make requests, but communication and interaction with clinical team was limited to phone calls and SMS. This led to prolonged wait times and inefficiencies in addressing patients' inquiries or requests related to their sexual health. This problem necessitated a personalised digital space to streamline communication and enhance patient experience in managing their sexual health. The primary goal of our digital platform was to empower patients to View STI results, Request Chlamydia treatments, Order Contraception Kits, Book Appointments Online.
Design Process
Discovery
The project kicked off with intense collaborative sessions, we involved all stakeholders including service users, clinical representatives from Brook and our team.
During discovery, we learned users seek accurate info for self-management, valuing community, respect, choice, discretion, and privacy. Staff prioritise efficient access to updated info, reliable integrations, and a strong brand message.
We also conducted a comprehensive scope refinement activity which involved defining 5Ws 1H, key user scenarios, value proposition, and also MoSCoW exercise to extract the MVP of the product.
During discovery, we learned users seek accurate info for self-management, valuing community, respect, choice, discretion, and privacy. Staff prioritise efficient access to updated info, reliable integrations, and a strong brand message.
We also conducted a comprehensive scope refinement activity which involved defining 5Ws 1H, key user scenarios, value proposition, and also MoSCoW exercise to extract the MVP of the product.
.jpeg)
.jpg)
What's needed in this phase:
Online Chlamydia treatment
Contraception treatment
Online Appointments
Online STI results
Clinical team portal
Upon initial analysis, it became clear that designing and developing each module individually would be time-consuming and jeopardise meeting the deadline. Understanding the urgency and complexity of the task at hand, there was a need for a shortcut that wouldn't compromise the robustness of the solution.
2. Define
A quick zoom out...
Workshops often generate a wealth of information, guiding our direction, but we faced challenges in deriving a functional solution. I decided to zoom out to identify commonalities among the requirements. I believe this was one of the significant step of the overall project as it paved a way to move forward. Surprisingly, three of the five journeys shared a common thread: each involved a series of questions and answers, guiding users to the next steps based on their selections (like a form with conditional branches). This insight became our foundation for a more streamlined approach.
.jpg)
2. Define
Key trio
We had an existing questionnaire builder (built and tested), a core component of our company’s own SAAS platform. With a few logical and UX adjustments (like adding new question types, removing CTAs where required), we will be able to seamlessly align with the three key requirements of project. Considering the tight timeline, repurposing existing features was the best approach to move forward.
With the foundational elements in place, I began mapping out and validating the flows, refining them to make it effective and seamless. Thoroughly mapping out user flows with meticulous detail was crucial in this project, particularly due to the varied experiences for different age groups (under 16, 16-17, and above 18). This approach ensured a professional and tailored user experience across all demographics.The final result is a set of functional flows for providing remote Chlamydia treatments, handling Contraception kit orders, and Appointment booking.
With the foundational elements in place, I began mapping out and validating the flows, refining them to make it effective and seamless. Thoroughly mapping out user flows with meticulous detail was crucial in this project, particularly due to the varied experiences for different age groups (under 16, 16-17, and above 18). This approach ensured a professional and tailored user experience across all demographics.The final result is a set of functional flows for providing remote Chlamydia treatments, handling Contraception kit orders, and Appointment booking.
.jpeg)
.jpeg)
.jpeg)
2. Define
Decreasing onboarding dropout rate
Brook's current platform requires extensive information about user's health when they want to make a request, which lead to high dropout rates during onboarding. To prevent repetition, users who completed this process shouldn't undergo it again on the new platform.
I thought about simplifying the sign-up process, one of the feasible, efficient way was by automatically pre-populating the personal/demographic information they’ve provided initially during an request. I incorporated this step into the flow, and received a go from tech team.
I thought about simplifying the sign-up process, one of the feasible, efficient way was by automatically pre-populating the personal/demographic information they’ve provided initially during an request. I incorporated this step into the flow, and received a go from tech team.
.jpg)
.jpg)
2. Define
More personalisation to increase engagement
In the existing online ordering portal, users can make requests anonymously, using different names, emails, and phone numbers. However, in the new personalised space, users must create an account for streamlined access to sexual health services.
The question was,
How might we personalise their experience by seamlessly syncing their previous STI results and other historical data in one account, even if they've made multiple anonymous requests in the past?
After rounds of discussions and work arounds we decided to use the combination of phone number, email, postcode and date of birth as a matching criteria and completed the data flow. This implementation played a crucial role in meeting regulatory standards and ensuring error-free matching of results. The flow was seamless and provided a clear picture to all stakeholders.
The question was,
How might we personalise their experience by seamlessly syncing their previous STI results and other historical data in one account, even if they've made multiple anonymous requests in the past?
After rounds of discussions and work arounds we decided to use the combination of phone number, email, postcode and date of birth as a matching criteria and completed the data flow. This implementation played a crucial role in meeting regulatory standards and ensuring error-free matching of results. The flow was seamless and provided a clear picture to all stakeholders.
.jpg)
2. Define
Seamless experience for admin team
Brook possessed a well-established STI order management portal (Brook staffhub) on the clinician/admin side. The challenge was integrating this into our new platform seamlessly. We opted for a Single Sign-On (SSO) approach, using Microsoft account credentials to auto-sign clinicians into the new tool. This streamlined the experience, eliminating repeated logins and fostering continuity and unity across both portals. Throughout the implementation, user experience remained at the forefront
.jpg)
2. Define
SMS Management
The existing SMS system operated in a fully automated mode, leaving Brook admins and clinicians with minimal control. The team needed the ability to trigger SMS directly from the portal. In the sensitive context of STI results, the inability to trigger, pause, or edit SMS communications posed a significant challenge.
We started mapping out various use cases for SMS communication. The content for each case was meticulously defined to ensure clarity and compliance, especially considering the sensitive nature of STI results.
The urgency of STI results, coupled with stringent regulatory requirements, demanded a solution that could adapt to dynamic changes. The breakthrough came in the form of SMS templates. The idea was to allow the team to create templates for different use cases – results, reminders, etc, and enable/disable sending SMS and editing the content when required. This approach empowered the admin and clinical team to take full advantage of SMS management, without the need for technical intervention.
This system not only addressed the immediate need for control but also future-proofed the system, allowing instant adjustments as regulations or requirements evolved.
We started mapping out various use cases for SMS communication. The content for each case was meticulously defined to ensure clarity and compliance, especially considering the sensitive nature of STI results.
The urgency of STI results, coupled with stringent regulatory requirements, demanded a solution that could adapt to dynamic changes. The breakthrough came in the form of SMS templates. The idea was to allow the team to create templates for different use cases – results, reminders, etc, and enable/disable sending SMS and editing the content when required. This approach empowered the admin and clinical team to take full advantage of SMS management, without the need for technical intervention.
This system not only addressed the immediate need for control but also future-proofed the system, allowing instant adjustments as regulations or requirements evolved.
.jpeg)
.jpg)
2. Define
User stories
With the foundation set, we meticulously mapped out the final flows, user stories and acceptance criteria to set the stage to design wireframes and final screens. Every step was validated through continuous feedback loops with clinicians and users, ensuring alignment with client expectations.
We established the clear requirements in the user stories for distinct age categories—under 16, 16-17, and over 18—ensuring a personalised and meaningful engagement for each demographic.
The backend development work began simultaneously as we clearly defined the rules for each feature in the user stories and acceptance criteria(e.g., the result SMS should be triggered only between Mon - Fri, 10 AM - 4 PM). These acceptance criteria served as the single source of truth for designers, developers, and the client.
We established the clear requirements in the user stories for distinct age categories—under 16, 16-17, and over 18—ensuring a personalised and meaningful engagement for each demographic.
The backend development work began simultaneously as we clearly defined the rules for each feature in the user stories and acceptance criteria(e.g., the result SMS should be triggered only between Mon - Fri, 10 AM - 4 PM). These acceptance criteria served as the single source of truth for designers, developers, and the client.
2. Define
Information architecture
Following the sign-off of user flow and user stories, I then started mapping out the higher-level architecture for both patients and the clinical team. This map aimed to integrate repurposed features from MAIA seamlessly, ensuring a cohesive platform that catered to the unique needs of Brook.
2. Define
Prototype
The next step was to translate finalised user flows and stories into mid-fi and high-fidelity screens. Around 400 screens were designed and prototyped over a period of 3 weeks, each screen was meticulously crafted to embody the user-centric design philosophy. Validated designs with clinicians and users, incorporating their insights to enhance the overall user experience, and handed off the design to the development team, providing detailed documentation to guide the implementation phase.
2. Define
Outcome
My Brook is an online platform that allows you to access our digital sexual health services including :
2. Define
STI testing
Ordering an at-home STI test kit, accessing your recent test results and ordering treatment if you need it.
Contraception
Requesting your repeat contraception or getting in touch about starting a new method.
Appointments
User can get in touch and see if you can book an appointment online.
2. Define
Styleguide
Leveraging established colour palettes, typography, and design principles from the existing styleguide ensured a uniform and recognisable visual identity across the platform.
2. Define
Key screens
Results
2. Define
Despite the initial challenges and tight deadline, the My Brook Portal was successfully launched within the stipulated deadline.
A remarkable 30% daily growth in user sign-ups, indicative of the portal's rapid and widespread user adoption.
The product had positive feedback for its intuitive design, well informed step-by-step journeys and the ability to engage with their sexual health information digitally.
The platform enabled users to view STI results, request remote Chlamydia treatments, order contraception kits, and book appointments, significantly improving the patient-clinician interaction.
A remarkable 30% daily growth in user sign-ups, indicative of the portal's rapid and widespread user adoption.
The product had positive feedback for its intuitive design, well informed step-by-step journeys and the ability to engage with their sexual health information digitally.
The platform enabled users to view STI results, request remote Chlamydia treatments, order contraception kits, and book appointments, significantly improving the patient-clinician interaction.
A solution to benefit
40,000+
young people by
2025
Reflection
Communication
Working in a project within tight timelines underscored the paramount importance of effective collaboration and communication.
Regular and transparent interactions with team members, and stakeholders proved instrumental in ensuring a streamlined workflow and timely delivery.
Regular and transparent interactions with team members, and stakeholders proved instrumental in ensuring a streamlined workflow and timely delivery.
Zooming in & out in ideation
The ideation process demanded a flexible mindset—zooming in for detailed analysis and zooming out for a holistic perspective. This dual perspective during research and ideation proved key in identifying both granular details and overarching patterns.
Validation & feedback loops
Continuous validation and feedback loops emerged as a cornerstone for success. Regular engagement with stakeholders, including clients, clinicians, and users, facilitated an iterative refinement process. This ongoing dialogue ensured that the end product met evolving expectations, fostering a refined and user-centric design.
Adapting exisiting solutions
Repurposing features from our MAIA showcased the efficiency of leveraging proven elements to meet specific client and user requirements.
This approach not only saved time but also ensured a tailored solution aligned with the project's objectives.
This approach not only saved time but also ensured a tailored solution aligned with the project's objectives.
2. Define
In conclusion, this project served as a dynamic learning experience, emphasising the critical roles of collaboration, adaptability, stakeholder engagement, and a flexible ideation process. These key learnings will undoubtedly shape future endeavours, ensuring a nuanced and effective approach to user experience design projects.
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
Version
2024Location
London, UKContact
