Catalia Health is a digital health care management company based in San Francisco, California. Their core product is an interactive personal assistant robot, Mabu. Catalia Health wanted to expand their product line by creating a patient community. The mission was to create a HIPAA-compliant product and experience that could help to improve patients' well-being through access to a greater patient community and personalized resources.
The goal is that by creating a safe space for patients to engage, patients will feel more informed about their condition, more motivated to adhere to their treatment plan, and a heightened sense of social belonging that could ultimately lead to better personal health care management. I worked as the lead UX designer in a small team of 4. Following an aggressive timeline, we were able to successfully research and design a high-fidelity prototype of the app, Flourish, in 5 months.
A high-fidelity prototype, tested with chronically ill patients, which outlines the solution and demonstrates 2-3 user flows of key community features
Our team is made up of four UX experts — based in San Fransisco and Los Angeles, California — with one unified goal in mind: To deliver the most well-researched, usable, and clean design solution possible in order to meet client needs.
We realized that this project would be very research heavy due to a few reasons. Facilitating patient-to-patient interaction through a community was new territory for Catalia Health, whose current research focuses more on patients themselves and their engagement with Mabu and healthcare providers.
Furthermore, recruiting for patients required more effort than other users due to the specificity of their conditions. We chose to narrow our scope and focus on patients with Congestive Heart Failure, as this was an important patient group that Catalia Health was already researching heavily for Mabu. Interacting with patients in interviews and other touchpoints required more care towards their physical and emotional states and privacy due to sensitivity of PII for HIPAA compliance.
In order to become HIPAA-certified, our team completed a HIPAA-compliance training course.
In order to become HIPAA-certified, our team completed a HIPAA-compliance training course. Subsequently, we began our research phase, which consisted of generative research with chronically ill patients, to understand what types of community content offered the most value to patients. We conducted semi-structured one-on-one interviews, a card sort activity, and a large-scale survey as part of our preliminary research.
With regard to the Design phase, we understood the heavy lift regarding research and how this may affect our ability to get to the point of a high fidelity prototype. As the expectation from the client did not expect a higher fidelity prototype, we shot to at least deliver a concept and low fidelity prototypes with next steps. We needed to time box our duration designing, testing, and iterating so we could meet this goal.
Throughout our research and design phases, we followed the Double-Diamond Process Model. Founded by the British Design Council in 2005, this design process model clearly depicts the iterative nature of the design process. To discover and define the problem space, we conducted primary research. We developed our ideas through a series of sketches and wireframes. After multiple iterations and a round of user-testing, we delivered a high-fidelity prototype to our clients.
To get a better domain knowledge of the problem space, Catalia provided the team with data around patients with chronic illness. This helped the team get more context on some of the physical and emotional challenges this group faces in dealing with their conditions. We conducted some additional secondary research to also understand some key areas that helped guide how we approach the generative primary research with them:
We also completed research to understand how a patient community could help patients deal with chronic illness. This helped us build out a competitive landscape for companies providing this kind of service to patients. Some key findings we discovered were:
We sought to complete exploratory research with actual patients to gain a better understanding of the space. We limited our scope to patients with congestive heart failure (CHF) since they are a target demographic for Catalia Health.
In recruiting this specific group of patients, we leveraged existing connections from Catalia Health. As a start, we were connected with a few patients through Catalia Health. One of these patients was also the founder and administrator for a Facebook group for patients with CHF. She let us post within this group to recruit additional participants.
Outside of these connections, we also reached out to chronic illness, heart disease, and heart failure communities on Reddit. We thought this would be a good alternative to groups on Facebook, as there is more anonymity involved with this platform. Lastly, we reached out to those within our personal networks, as our team knew some individuals with CHF.
We were able to recruit 42 participants for interviews and a survey/card sort exercise. Participants were between the ages of 30-65 and lived across the United States. We will discuss our findings in a later section.
Due to sensitivity regarding personally identifiable information for patients, we were required to complete a company training to be in compliance with the Health Insurance Portability and Accountability Act (HIPAA). We needed to become HIPAA certified before interacting with patients from Catalia. HIPAA compliance for patients not sourced from Catalia Health was also ensured in participant agreement forms. We took great lengths to keep patient data private and secure by:
Ensuring HIPAA compliance proved to be time-consuming as it required extra precautions. As a result, our research was delayed for a week or so as we validated with Catalia Health that we were able to work with patient data.
We had a total of 42 participants. We completed remote interviews with 13 chronic heart failure patients and administered a card sort and survey to the remaining 29 participants. From our one-on-one interviews, we hoped to:
Most of these interviews were conducted using Zoom, a video conferencing software. Videos were recorded with patients' consent; However, some participants did not have access to video capabilities or a computer. For these interviews, we recorded phonecalls.
Phonecall participants tended to be older -- in their 60s -- and less likely to engage with online communities, while participants who opted into video chat tended to be younger and more engaged with their respective online communities.
We also sent out a card sort activity and pre-activity survey so that we could:
We completed the card sort activity and survey with 29 participants -- twelve were under the age of 50, while seventeen were over the age of 50. For the first part of the activity, participants were asked to complete a survey that gauged demographic information, behaviors and attitudes surrounding online/offline communities, and devices used to access said communities. They were then asked to sort 17 cards, containing aspects of a patient community derived from our patient interviews, into categories by level of importance (very important, important, somewhat important, and less important).
From our survey of 29 participants, we found that a large majority of the participants engage in online communities and access them using their mobile device. We also found that a little more than half of the participants would meet up with group members located near them.
When asked to indicate their top 3 most important attributes from a list of community attributes, "Respect and kindness", "Access to chronic illness research", and "Info on local support groups and physicians" ranked at the top.
From the card sort, we discovered that the most important community aspects are the ability to discuss a specific diagnosis, educational resources, a safe space to share ideas and experiences, a community that can be checked any time, and low sodium diet information. Meanwhile, intimacy, religious support, and an unmoderated community ranked as the lowest level of importance. Polarizing aspects were amusement/entertainment, comic relief, and companionship.
We uncovered 5 major themes that informed us of patient attitudes and behaviors from our interviews:
To read about findings in more detail, view case study PDF↗.
We found three types of community user archetypes -- two archetypes (contributor and lurker) whose characteristics were independent of their progress in their patient journey and one archetype (mentor) whose behavior was tied to the length of time they had been a patient.
Both “Contributors” and “Lurkers” displayed opposite characteristics in how they interacted with the community. Many of these individuals noted that their affinity for sharing content online or simply sitting back and observing were not specific to patient communities. Contributors were mainly female. This group preferred to be identified and to build relationships with others in the community. Lurkers were mainly male and preferred anonymity. These individuals focused more on finding answers through education rather than engaging in building relationships with others in the community.
“Mentors” were fell further along in their patient journey and wished to give back to the community. Many of them started their own community or served as moderators of communities they had once been a contributor for. They often felt more responsibility for those within the community than for themselves and typically do not join for educational content.
The second phase of our project began after we synthesized the data from the patient interviews, card sort, and survey questions. The insights discovered helped us to define the problem more clearly, so we could focus on designing for the most critical components of a chronic illness patient community. After our presentation of research findings with Catalia Health, it was decided that patient-to-patient and patient-to-education interactions should be prioritized, with patient-to-service facilitations left out in this preliminary stage due to scope. We began the design by asking:
Our North Star was to increase the duration of patient engagement and lead to better health outcomes by through a engaging and dynamic content. Since the requirements for what is considered “engaging” to users is dependent on where a patient is at in their patient journey, we leveraged personas from Catalia Health that aligned with the concepts of a “Beginner,” “Intermediate,” and “Expert” patient. We wanted to create a working prototype of a mobile app that had at least two user journeys completely built out that gives users the ability to:
We began our design process by using Miro to organize our thoughts around a potential concept. Using our north star and understanding of priorities, we brainstormed different aspects of the community by posting these ideas onto the Miro board. This took the form of an initial site map for the community, and included our main topics with pages that could support them, which helped us answer the following questions:
Because of the many different approaches we could take to create a community hub, we split up into two groups to tackle our initial thoughts of a site map. This exercise allowed us to understand the potential information architecture for the prototype as well as higher level features for prioritization.
For the sake of limiting scope, we decided to focus on online community and resource features, saving Mabu integration and in-person interaction features for future development.
Our team met in-person in San Francisco prior to visiting onsite at the Catalia Health office. In an all-day session with our team, we performed a design sprint to prepare the initial wireframes that would be used to test and receive feedback from the team at Catalia Health. Using the initial concepts and ideas within our user story, we began sketching out the interface concepts for the wireframes.
As mentioned previously, the Design phase of the Double Diamond process requires divergent thinking in order to frame the design challenge. We used a few methods to increase the output of creative ideas, beginning with an activity called “Crazy Eights" established by Google. Each of us participated in this activity to generate eight different sketches in eight minutes. We then presented our own ideas to the team and voted on the sketches that most closely matched our intended design direction. Key ideas that emerged from this activity included:
After the “Crazy Eights” activity, we collaborated on developing the wireframes as a team, taking the most compelling sketches and transforming them into a more organized, streamlined set of screens. Because this developmental process yields constant change, we used a whiteboard for the rest of our activities. We first created a hierarchy of navigation menu items, which in turn revealed both the “Explore” and “Community” pages as highlights of the app. “Explore” would act as the homepage for users upon opening the app. After being onboarded (in which data points collected on the user would map them into one of the patient types on their patient journey), content on this page would be catered to the user.
Both content from official publications and the patient community would be featured under “Recommended Articles” and “Recommended Posts.” The article content would either be curated by Catalia Health or moderators within the community, much like editor’s picks for the Apple App Store. Posts from other users would be recommended or featured in the “explore” page based on user preferences. From this page, the user could then bookmark or comment on the posts and articles featured. With those two key features in mind, we mapped out two separate user journeys and used them as a framework to build out the rest of the wireframes. We walked through each journey and made sure to match the users’ mental models.
To maximize our working day with Catalia Health, we began by sharing our developed wireframes, referencing the two main user journeys we mapped out for our prototype. The purpose of this meeting was to show the client our current progress and receive feedback on the development of our work. We also wanted to continue iterating alongside the client to more clearly define and validate the details of each interaction.
For this part of the process, we worked closely with Catalia Health's lead UX designer, Stacey Seronick. She suggested that we implement their existing personas to assist us with the personalization of the user journeys. Working with Stacey, we fleshed out the how the content of the community could change dynamically based how long a patient has been diagnosed. The personas that were of applicable to us were those that represented the “Beginner” and “Intermediate” patient types because these patients would get the most out of engaging with the community and its content.
At the micro level, we still needed to make design decisions, including what information would be important for making the user experience more personalized, but at the macro level, we had completed all of the aspects needed to begin designing and prototyping on Sketch. The collaboration onsite helped us pivot towards making a product that could actually be used by congestive heart failure patients, such as those who have a Mabu.
Our client shared with us their branding specs, such as specific fonts and colors used for both Catalia Health and Mabu. Since they did not have a formal branding guideline, we went ahead and used our best judgement in order to establish the look and feel of the app. While we wanted the design to feel similar to that of the client’s, we also wanted to separate it out from the existing product, Mabu, and present it as its own unique experience because its reach may expand beyond Mabu.
For the main color, we chose a shade of teal (#47bcca ) that both compliments Catalia Health's blue (#458ac9 ) and orange (#f28f1c ) but also stands well on its own. The shade of teal is warmer in comparison to Catalia Blue and represents a merging of the blue and green colors of Earth, which corresponds to genuinity and organic growth. For our text we chose a modern and easy-to-read san serif font, Avenir.
For the look and feel, we focused on making interface appear lightweight and clean through a minimal color palette, careful treatment of white space, and subtle shadowing. We hoped that a clean, bright interface would make the app more intuitive and delightful to use.
We chose the app name, Flourish, because it is a verb that means: to grow in a healthy way from being in a favorable environment. Meanwhile, the logo symbolizes both a flower in full bloom and the intersection of similarities. This correlates with the app because we hope that users of the app can meet like-minded people, grow together, and flourish within the community.
After increasing the fidelity of our wireframes through Sketch, we utilized Figma to create high-fidelity mockups of the design. We then developed a working prototype using the tools available on Figma. Using the user flows previously defined, we built out the navigation bar and each screen as it pertained to those flows.
Upon completion of the first working prototype, we conducted user tests to validate our design work. Feedback was needed on usability, information architecture, interactions, visual design, and the mental model for personalization.
We reached out to many of the original participants from our interviews. In the end, 5 participants volunteered to work with us to test the prototype remotely. The participants shared their screens and provided commentary as we asked them to perform tasks through two main scenarios on the “Explore” and “Community” features.
The goals were to:
While testing, we had the participants walk us through the "Explore" and "Community" screens with various tasks to complete. Most questions were asked as open-ended ones, while some questions required a likert scale rating. We didn’t have all components or clickable icons working on the first prototype, but we wanted to get opinions on an additional personalization feature such as the patient’s journey. We closed each usability test by asking for any recommendations on creating a feature that tracked where the patient felt they were, whether that be a beginner or expert on their personal condition. This helped to brainstorm on the feature we wanted to include in our final prototype and for further investigation.
Our key user testing findings:
Our team was able to provide an interactive high-fidelity prototype, tested with chronically ill patients, which outlines the solution and demonstrates 2-3 user flows of key community features.
Throughout this process, we have learned a lot about how various patients across each part of their journeys wish to engage with the community. We have designed two main user flows and have built the framework for other features to take life.
Areas we recommend building out further are features that facilitate in-person meetups because this is a feature that several participants in our research phase acknowledged interest in -- especially those who prefer face-to-face interactions. Building out this feature would also give Catalia Health a competitive advantage over other community platforms, because this feature does not currently exist in a majority of online patient communities.
In addition, the current prototype features a section for “Resources” in the navigation at the bottom. This was intended to be a placeholder for a future design that could connect patients more offline resources (e.g. carpooling, grocery delivery) that would help improve their quality of life. This was an important finding that was ultimately ancillary to solving the problem of increased patient engagement.
While Catalia Health has already built a great solution in increasing patient engagement with Mabu, we believe the community app will further improve this engagement while enabling richer interactions between actual patients. Another benefit to building an online community is that it is more accessible and does not require users to have a Mabu device, which means it has the potential to reach a much larger patient demographic.