Project Overview

MY ROLE

I worked on this cross-functional project between the business development and product design teams. The company was in the process of launching new products to expand beyond birth control. Over a 5 week period, I was tasked with conducting a competitive analysis, designing 3 wireframes, and high-fidelity prototypes using Figma.

Review of The Pill Club UX

First, I helped review the existing customer flow. This involved analyzing the primary user touch points: the homepage, dashboard screens, and onboarding funnel.

HOMEPAGE

• Users can’t browse all available products
• No distinction is made between goodies, insurance-covered products, one-time purchases, and subscriptions

DASHBOARD SCREENS

• Tasks should be organized by priority
• Add-ons are too tucked away and inaccessible to the user

ONBOARDING FUNNEL

• There should be elements to personalize the user experience
• Make copy more engaging
• Show more product images and user-generated content (UGC)

Competitive Analysis

The competitive analysis was helpful in identifying areas within our competitors' interfaces where add-on products were displayed to encourage product attachment. We analyzed six of our competitors' platforms and from our research, we identified that the dashboard and the onboarding funnel were the main sections within the user experience that strategically advertise add-on products and so my team decided to take a similar approach.

• Dashboard

(test for patient interest by displaying add-on products in the dashboard)

• Onboarding funnel

(Move high-value, high-interest SKUs into onboarding flow to drive uptake)

Design Exploration

After conducting the competitive analysis, I moved onto design exploration to see how add-ons could be displayed within our onboarding funnel and dashboard. On the screens here are two examples of wireframe mockups that I built out and presented to stakeholders.

DASHBOARD EXPLORATION

For the first design direction, I explored how add-on products could be selected straight from a carousel on the dashboard through a modal window. On the modal, I built out a toggle feature so that users could choose their preferred payment type (subscription or one-time add).

ONBOARDING EXPLORATION

In the second design direction, I explored how add-on products could be displayed within the onboarding funnel without causing disruption to the current flow. In this option, I created a wireframe displaying a row of product cards that would potentially feature our recommended or most popular selections.

Solution

After the design exploration, I continued on to work with Sarah Jura, a senior designer, to build out a design option to display add-on products in the onboarding funnel. I designed a high-fidelity prototype using Figma to be presented alongside two other options.

My solution aims to provide an intuitive way for users to choose between one-time add and subscription by highlighting one payment option at a time in the modal.

2-COLUMN PRODUCT LIST

Helps the users concentrate on each individual product card by eliminating clutter

SHOP CHIP

The shop chip state changes to reflect the quantity or the payment type that was selected

TOGGLE IN MODAL

Users can toggle between purchasing a subscription or just one-time add

Outcomes

The final design in product as of 5/15/21 is displayed in the onboarding funnel and the dashboard. The features adopted from the design exploration and prototyping were the product list, the carousel, and shop button with changing states.

Takeaways

This project was one of my favorites that I worked on over the summer with The Pill Club. I was able to work on several areas, from visual to interactive design. I also had the opportunity to work closely with project managers, business stakeholders, and UX designers to develop my ideas.

What I Learned

• Consider the business needs when designing products that go directly to consumers

→ I had the opportunity to collaborate with people on our business development team and through those conversations learned about how to design for the customer experience. We identified how we could display add-on products without disrupting the user flow and potentially causing drop-offs from the site. Also, because this project involved adding a new task to the customer experience, it was important to flesh out how current and new users would be affected.

• Don't get so caught up in the details in the very beginning of the design process

→ This was especially important to remember for this project because I had to incorporate my designs into the existing interface. I had to look at the bigger picture and think about general solutions before I worried about smaller elements of the visual design.

• I learned how to design a scalable solution

→ Because I was designing ways to display products, I had to think about scalability and designing for future scenarios. I thought about how users would be able to quickly browse through items and the ease for engineers to be able to add in new products to specific solutions.