Core Feature:
Grouper Directory
The Grouper Directory was released in December 2024, following two major scope reductions.
TL;DR
As the sole product designer for Grouper’s member directory, I led the end-to-end design to help senior citizens discover interest-based groups. I crafted user flows, wireframes, high-fidelity designs, and updated the design system in Figma, prepared engineering handoff documentation, contributed to Jira ticket creation, and conducted QA on engineering work. With no research budget, I volunteered with a Grouper-sponsored senior walking group to ensure my designs were rooted in authentic user insights. I also contributed towards the enrollment process and connecting the enrollment and directory experiences together.
Even though the directory launch was de-scoped, its value remained clear. Throughout the design process, our lead insurance partner, Optum, upon seeing the Directory in prototype action, recognized its potential and used it to sell additional plans and ultimately help drive Grouper’s growth. Thanks to the combined efforts with Optum, streamlining enrollment, and the directory offering, Grouper’s membership grew from 3,000 to 40,000 in just seven months.
Though impacted by company-wide cuts shortly after the MVP launch, the experience taught me about shipping a core product from scratch—navigating ambiguity, collaborating with cross-functional teams, and consistently championing user needs while still meeting business goals.
Who is Grouper?
Grouper, formerly known as Element3 Health, is an early-stage digital healthcare startup focused exclusively on enriching the lives of senior citizens. Through partnerships with major healthcare providers like UnitedHealthcare, Grouper is offered as a core benefit to insurance members. Eligible members were 65+ and received free access to a wide range of group activities — from in-person events and instructor-led virtual classes to an active online community of fellow Grouper members. Grouper has proven effective in helping seniors combat loneliness and isolation by promoting social connection and physical engagement.
Directory Overview
Grouper’s mission is to “encourage healthy living through meaningful social connection and shared experiences.” To support this, senior citizen members are given access to a vast database of groups they can browse and join based on their interests. Once they find a group that resonates, they’re able to connect in person through shared social activities. Grouper aims to spark initial introductions and provide a platform for those relationships to grow through mutual experiences.
Goals
Grouper is in a unique scenario where it not only caters B2B, but also B2C- in other words, B2B2C: Healthcare providers to various groups and activities to members.
Directory’s goal was to solve problems for each of those sects through one seamless experience. Groups and activities needed to be collected and added for the healthcare providers, the individual groups and activities needed to be represented well on the platform, and we needed to find a way to connect our members with a group or activity.
Users and audience
Grouper members join through two distinct channels. Healthcare providers, like UnitedHealthcare, directly refer one group, while the other comes through partnerships with national organizations such as the U.S. Bowling Congress or the National Pickleball League. In the latter case, these organizations would promote Grouper to their members. These users would then complete an online eligibility check with us to verify age and healthcare provider. Once deemed eligible, they would proceed with onboarding and gain access to our directory. The primary persona for the Directory consisted of members who did not belong to any national organization or group, as those joining through such organizations were already part of established communities.
Scope and constraints
Grouper is an early-stage tech startup still finding its footing, so the scope of the Directory evolved and pivoted frequently which is something you'll notice throughout this case study.
Time and budget were two of the primary constraints. Other challenges included:
Certain deliverables were committed without sufficient planning or understanding, triggering a chain reaction of changes that significantly impacted the Directory's release timeline
Since the product was being built from the ground up, every pivot or change had a significant impact on engineering efforts, which in turn delayed progress on design work
The budget didn’t account for essential needs like usability testing, which required some creative problem-solving to work around
Roles and responsibilities
As the product designer for the Member Directory experience, I was responsible for end-to-end design - from creating user flows, wireframes, and high-fidelity designs in Figma to building interactive prototypes. I regularly presented my work to key stakeholders throughout the project. I also handled engineering handoff by preparing detailed documentation, writing Jira tickets, and conducting QA testing prior to release.
my process
Problem Definition
I collaborated with Team Groups to design and develop the Directory experience, a new core feature for a startup launching on a brand-new platform. Working alongside a product owner and five engineers, I led the design efforts amid limited user data. To drive clarity, I translated the product requirements into clear problem statements, then crafted targeted How Might We questions to steer brainstorming and prioritize solutions. These tools aligned the team and accelerated our decision-making process.
User Flows
After drafting the problem statements and How Might We questions, I mapped out user flows for the Directory MVP. I designed the experience starting from the Dashboard—where members land post-enrollment and onboarding—ensuring a seamless entry point into the Directory feature.
Flowchart stemming from the Dashboard. Also noted are sections for the new pages.
Design Explorations
The flows indicated a need for a few different pages, so I worked on low and high-fidelity versions of:
Directory Landing Page
Search Results Page
Group Detail Pages
Profile Page
Along with
Error states
Filters
Next, I designed mid-fidelity versions of the required pages. My project manager and I worked closely together to quickly finalize these designs so I could move into high fidelity.
growing out the design system
Grouper UI Kit
For the high fidelity work, I utilized the styling kit we received from an external agency that created Grouper’s distinctive brand before I joined the company. It included key elements such as a small color palette and a few typestyles.
However, the kit lacked certain styles, so I took the initiative to expand it. I developed additional styles to strengthen the hierarchical scale and included mobile-specific styles.
I also broadened the color palette by introducing neutrals, system colors, and various tints and shades to complement the existing brand colors, giving us more flexibility as designers.
To focus on the directory experience, data unrelated to this case study has been grayed out.
After members sign up and enroll with Grouper, they are directed to the Dashboard, where all their onboarding information is displayed. One of the business goals was to seamlessly direct members to the directory where they could begin exploring various activity types. Therefore the “Explore Activities” button takes the member to the directory.
The MVP Directory Landing Page features a column for filters alongside a list of groups. The activity-type filters were selected based on early third-party research, which revealed that these activities are among the most popular choices for senior citizens.
The filters were organized into distinct sections to ensure that users could still easily navigate and understand how to use them when additional filters were added. This was one of the ways I designed for scalability.
Mid-fidelity on left, high fidelity on the right
After clicking a group card, the member is directed to the Group’s Detail Page, where they can view specific information about the group, including the group leader's contact details. If the member wishes to add the group to their list of interests, they click 'Add This Group.' A modal then appears, informing the member that the group will be saved under their Profile settings, along with suggestions for next steps.
Mid-fidelity on left, high fidelity on the right
After clicking a group card, the member is directed to the Group’s Detail Page, where they can view specific information about the group, including the group leader's contact details. If the member wishes to add the group to their list of interests, they click 'Add This Group.' A modal then appears, informing the member that the group will be saved under their Profile settings, along with suggestions for next steps.
Mid-fidelity on left, high fidelity on the right
December 1.0
Before the pixel residue could settle after writing our last ticket in Jira, my team and I were informed of a significant business decision: the directory work needed to be released by the end of the year. We had only a few months to streamline the experience. In response, my team and I jokingly dubbed the project “December 1.0” to highlight the near-impossible task ahead. I immediately collaborated with the team to reduce the scope of the directory, optimizing it for faster implementation while ensuring it remained usable, provided user value, and met business requirements.
For the new Directory Landing Page rendition, I recommended removing the search query functionality and limiting members to search only by zip code. Although this seemed like a drastic change, it was necessary for speed and would be reintroduced as a fast follow. On the card side, we removed the top 'sort by' filter, and the cards' design remained unchanged.
Adding images was a significant lift, so the lead group image was removed from the Details Page. Additionally, the Grouper information at the bottom of the page was removed due to rapidly changing business decisions. It was in the best interest of everyone involved to temporarily remove this section until we had clear and stable information to present to members.
MVP on the left, December 1.0 on the right
The most significant update came when we postponed the Profile Page, which meant one less page to build out. As a result, the 'My Group' information was moved from the Profile Page on to the Dashboard. I collaborated with the dashboard team to implement these changes, while the remaining sections of the Profile Page were planned for future iterations of the Directory experience.
MVP on the left, December 1.0 on the right
MVP on the left, December 1.0 on the right
December 1.0 Thoughts
December 1.0 was challenging to design for due to the rapid pace of change. It became a 'design and build first, ask questions later' situation, where scalability and big-picture thinking were often sidelined as significant pivots with unclear reasoning occurred daily. Despite the frustrations, the experience brought my team closer together. It was a shared challenge that taught me the importance of listening and empathizing with everyone involved and helped me develop resilience in ambiguity - to iterate quickly and not get too attached to any particular solution.
December .5
After completing the sprint planning for December 1.0 and assigning the work, we were notified of another production delay. Engineers on my team were reassigned to handle other emergencies, and I had to support my design teammate with various deliverables. With only four weeks left to launch the end-of-year directory, just as the holidays approached, December 1.0 quickly turned into December .5, requiring another streamlining round.
The new Directory Landing Page of December .5 was further simplified to a single filter—the zip code filter. The search query and activity type pills were planned as fast follows. The search result cards were edited down to display only the essential information—the group name, summary, and a link to the detail page. All images were removed and planned for a separate epic for a future iteration.
The Group Detail Page remained relatively unchanged from the previous version. The logos, which had become part of the image epic, were also removed.
December 1.0 on left, December .5 on right
Finally, the 'My Groups' section on the Dashboard was updated to include cards that called out the added groups. We decided to match the design of the search result cards for ease of implementation. Features for managing added groups, such as joining or removing, were planned as a fast follow-up.
December 1.0 on left, December .5 on right
December 1.0 on left, December .5 on right
The Directory was finally released as “December .5” in December 2024:
Outcomes & Lessons
Grouper’s core mission is to get senior citizens active and social. To accomplish this goal while working within the B2B2C format, members needed to be able to enroll, find and join a group, and report activity.
How was that done?
To grow the user base, insurance plans were needed to serve the senior citizen demographic which was achieved successfully through Optum. After seeing the directory designs, Optum was able to sell additional plans, directly increasing Grouper’s membership.
On the enrollment side, I worked closely with another team to design flows that seamlessly converted Optum subscribers into Grouper members.
For the core directory, I led the design of the "find and join a group" flow. Although the scope shifted significantly, the essential elements to meet business goals remained intact. I adapted designs through each pivot and produced detailed documentation to support engineering.
I also contributed significantly to the member activity reporting experience, just as I had with enrollment.
What’s next?
I was part of the 50% company-wide layoff during the low-fidelity phase of our second MVP. While the future of the directory is uncertain, the experience gave me a deeper understanding of what it takes to bring a product to life—and how clear communication and a growth-oriented team can navigate even the most complex challenges.
