Product design lead for a B2B2C startup focused on preventative healthcare actions for communities of color.
Upon my onboarding and auditing as the founding product designer at Coral — I was able to work with the product team and stakeholders to identify three core problems to begin to tackle:
Problem: Lack of a comprehensive design system that can grow and scale
I initiated my journey by conducting an exhaustive evaluation of the existing UX flows and UI elements. It didn't take long for me to spot inconsistencies across various aspects – spanning from color palettes to typography choices. The challenge here was that the previous designs were a patchwork quilt, stemming from a mix of contributions by freelancers and an agency. Moreover, certain pages had been crafted directly through code, making it essential to bridge the gap between design and engineering, and make sure all screens existed in Figma as well.
I chose the atomic design methodology as the foundation for constructing our comprehensive digital design system incrementally, recognizing its efficacy in facilitating cohesive style implementation and component creation within existing designs. My overarching objective was to establish a robust foundation that would not only bring cohesion to the design but also enhance the user experience and expedite the development of new features.
I dubbed our design system the "Coral Reef" and built out the styles that made up our foundational Atoms. Naming conventions and design tokens became a big part of making sure our system was not only well organized, but also more dev-ready. Detailed documentation for these styles lived in Confluence, while documentation for Molecules and Organisms lived both there and directly in Figma.
Once the Coral Reef's foundation was firmly in place, my primary objective revolved around enhancing the existing UI while minimizing design-related debt. This endeavor involved implementing subtle yet impactful modifications, including rectifying color discrepancies, ensuring uniform typography choices, and refining spacing guidelines.To execute this seamlessly, I meticulously curated a unified design library within Figma, complemented by the creation of a comprehensive Style Guide in Zeplin. This strategic approach effectively translated the design system into a tangible asset for the development team, creating a more seamless process for design updates.
One additional and very integral part of our core design system was the use of "Cora" — who users are introduced to in the onboarding process as the "person" who will be helping them throughout their journey. This persona was interesting to work into the product, as we continuously explored when her "voice" would be best used, such as on welcome screens and when delivering results. I also used videos of her likeness for marketing materials.
Problem: Members need easier paths to complete the recommended health actions
Coral Health's first line of action involved providing at-home testing kits for specific health concerns pinpointed through our assessment process. However, these kits were designed to cater exclusively to issues directly related to their contents. Consequently, the default recommendation for other health concerns remained as visiting a doctor. Recognizing a motivation barrier within our target demographic, we sought a solution.
In a collaboration between the Partnerships and Product teams, we embarked on a brainstorming session to explore potential collaborations with CVS Health. It became evident that an integration aimed at creating a more user-friendly and less intimidating in-store or clinic environment would be a groundbreaking development in addressing this issue.
To kickstart the research phase, my initial focus centered on gaining a comprehensive understanding of CVS's existing scheduling and booking process, given the potential constraints posed by the use of their existing API. Additionally, I aimed to delve into the entire end-to-end process, which necessitated a thorough "investigation" into the clinic itself and its in-clinic interface components.
To achieve this, I mobilized a small research team, tasking them with visiting their nearest CVS Minute Clinic. Some team members even went the extra mile by fully booking appointments, such as a Flu shot, to gain not only insights into what we would be designing but also to discern how we could provide ongoing assistance to members once they were in the clinic. This on-site research proved highly enlightening, revealing that the clinics' interfaces varied depending on their age and location. Some featured straightforward digital touch-screen kiosks, while others were equipped with outdated and challenging-to-navigate roller ball selection tools.
Next, our Product team set up digital working sessions with the external CVS digital team to discuss timelines and design, as well as any engineering limitations. Since the team had no insight into what our product looked like, I included some visual mockups for our user flow during walkthroughs:
Given our tight deadline, I swiftly transitioned from conceptualization to creating high-fidelity screens, continuously refining designs based on valuable input from our team. Fortunately, the recent implementation of our design system significantly expedited this process. I maintained a close and collaborative relationship with our software engineer throughout the project's lifecycle, from the proof of concept phase to meticulous QA testing and, ultimately, its successful completion.
In the end, we successfully integrated the clinic's booking feature directly into our web platform, enabling our users to effortlessly schedule appointments at CVS based on our recommended health actions, all within the Coral Health app.
Following the booking process, we diligently followed up with users via email, providing additional tips and insights on maximizing their clinic visit. This approach allowed us to empower users to advocate for their own health while continuing to support their experience, including guidance on navigating the clinic's check-in kiosk.
To enable this, I created multiple landing pages within Instapage, collaborating with our Healthcare Ambassador to customize content for each page based on the type of appointment, ranging from flu shots to mental health consultations. This tailored approach enhanced user engagement and satisfaction, further enriching our user experience touch points.
Coral Health's pricing model is based on "active" members, making engagement a critical component of our overall platform design. However, we recognized that it was easy for members to become "inactive" after completing the initial onboarding assessment and recommended healthcare actions. To combat this issue, we developed the idea of "mini assessments" as a way to notify members of additional relevant healthcare actions, particularly those that are season-based, such as the flu shot.
We designed a flow that could be initiated from email, SMS, or notification alerts — and I worked with engineering to ensure that this feature was seamlessly integrated into the platform design. By periodically prompting users with these mini assessments, we were able to re-engage them with the Coral Health platform and encourage ongoing participation.