Re-imagining content for better engagement

MasterClass members stop using our product very early into their membership. They cite lack of time as the main reason. They also express that they don’t feel like they can move onto a new class until they’ve finished the class that they’re currently watching. This project aims to address this user problem and create quick, diverse learnings that bring users back to the app every week.

Client: MasterClass

My Role: Product Designer

Project Time: Three weeks

A cartoon character with a yellow, round face, large eyes, and a wide open mouth, appears to be running or jumping among floating articles including books and papers.

The Challenge

Design a daily editorial native feature that makes it easy for a user to quickly learn something new every day.

My Role

I worked as the lead product designer on this project and mentored a UX Researcher who wanted to transition into design.

There was a 91% increase in frequency for users who engaged with this new feature.

Understanding the Problem

In order to better understand the problem space, I collaborated with our User Research and Insights teams to see what we can learn from existing data.

THE CURRENT EXPERIENCE

“What does our current experience look and feel like?”

Our current experience focusses only on learning through video, which has a high barrier to entry. People learn differently and often need different mediums to process information. With people going back to the office and commuting via different transportation methods - being able to consume something in 2 to 3 minutes would be more realistic.

🎥 Video Only

⏰ 5-20 minute long lessons

Screenshot of a mobile app interface showing a list of culinary lessons by Gordon Ramsay, including a lesson on making mashed potatoes and cauliflower steaks, with images and durations for each lesson.
Close-up of a mobile device screen showing a video playlist with chapters, each with a thumbnail image of a woman presenting and various background colors, with timestamps and chapter titles, including titles like "Navigating the World Around You," "Owning the Room," and "There Is No Such Thing as Failure."

DATA & ANALYTICS

“How is our current experience performing? Where is there room for improvement?”

I partnered with our Insights team to pull statistics about our current experience. We found that very few users engage with MasterClass throughout their membership

Graph showing a 40% drop in active rates from month 1 to month 2, with a confused face emoji beside the percentage.
A statistic showing 55% with an emoji of a surprised person emoji, indicating members who don't start a class after signing up.
Graphic showing the number 3 with the word 'months' next to it, an emoji of a person with a party hat, and text explaining it represents the amount of time a member is active in a year-long membership.

USER RESEARCH

“Why do users stop watching so early in their membership? Why don’t they watch new content?”

I partnered with our User Research Team to better understand the reasoning behind user behavior.

Cartoon illustration of a sad, yellow, chick-like creature with big eyes, standing on a pink and beige platform with its wings hanging down, surrounded by a light blue circular background.

MasterClass Member

“I don’t have the time to sit down and watch a full lesson. I’d like to watch something new but I feel like I should complete the class I’m currently watching first.”

The User Problem

Users want to learn something new every day but they don’t have the time to watch a full lesson and feel like they have to finish a class before starting something new.

Building the Solution

After defining the problem I began my design explorations by brainstorming with my team, wireframing potential solutions, and mocking them up into high fidelity designs for usability testing.

PRODUCT TEAM BRAINSTORM

“How can I generate a large amount of diverse solutions?”

In order to solve our user problem, I conducted a brainstorm session with the product, engineering, research, and insights teams that focussed on key “How Might We” statements. I worked with my PM to identify the best solution based on effort and impact.

A cartoon character resembling a light blue snowman with large glasses, a small mouth, and blue hair on top, standing against a purple background with a large question mark.

“HMW make it easy for users to quickly learn something new every day?”

Organized digital brainstorming session with various sections and colorful prompts for ideas and discussions.

“Create text-based learnings that span a diverse set of topics and take less than 5 mins to complete.”

Cartoon of a smiling yellow character with large eyes, raising a hand, and a light bulb indicating an idea.

VISUAL EXPLORATIONS

“What should quick, text-based learnings look and feel like? ”

I began my design explorations with wireframes and focussed on the discovery of this feature and the user flow. After that, I mocked the wireframes up into hi-fidelity designs and prototyped for user testing.

🥚 Wireframes

Mobile app interface displaying daily quick learnings with a highlighted lesson titled 'What’s Your Conflict Type?' with a 'New' label, and other lessons such as 'How to Combat Jetlag' and 'What’s Your Chronotype?'. The screen also shows original series, instructor names, class names, and a bottom navigation bar with 'Home,' 'My Progress,' and 'Library' icons.
Mobile app screen with gray background displaying Welcome to Daily Learnings message, information about conflict types from Esther Perel, and a placeholder for an image.
A mobile app screen with a gray background displaying daily learning content about conflict types and relationships.
Blank screen on an editing app titled 'Esther Perel Editorial Screen' with icons indicating multiple pages and sharing options.
A digital interface screen with a grey background showing a communication completion message: "Nicely done, Michel! You learned something new today." It features a checkmark icon at the top, two placeholder sections for instructor information with image icons, text placeholders for instructor names and class names, a section titled "More on Relationships," and a button labeled "Start Next Lesson" at the bottom.
Screen with a message about an inspirational takeaway that summarizes recent content watched.

🐣 High Fidelity

Screenshot of a mobile app with a dark background, showing sections titled '2 Minute-Learnings' and 'Daily Moments'. The '2 Minute-Learnings' section includes cards with titles and images of diverse people, such as a man with a bald head smiling and a woman with short hair. There are navigation icons labeled 'Home', 'My Progress', and 'Library' at the bottom.
A digital screen promoting 2-minute learning modules covering topics such as developing personal brand, exercise benefits, conflict types, and food relationships.
A marketing webpage discussing how Joel Greenblatt finds hidden value in the stock market, featuring his photo and biography.
A guide or presentation slide about investing, with a bar chart that features a stylized dollar bill background. The text reads, '2. Buy assets that aren't just cheap, but good.' It explains that assets should demonstrate growth potential using metrics like return on capital.
Confirmation screen indicating the user has learned something new today, featuring a photo of four professionals and a link to develop a personal brand.
A slide with a blue and black background displaying three points about investing, labeled as 'Recap'. The points are: 1. Use a margin of safety to buy cheap assets. 2. Only buy cheap assets that show growth potential. 3. Buy assets across a mix of industries to protect against market swings.

Testing the Solution

After designing the solutions I built prototypes, conducted usability tests, and iterated on my designs based on the feedback that I received.

USABILITY TESTS

“Are there any major usability issues? How can we improve?”

I conducted usability tests on usertesting.com with 12 participants on mobile devices. The goal of these tests was to determine if there were any major usability issues and to discover opportunities for iteration.

A digital illustration of a smiling, stylized purple cat with its eyes closed, standing in front of a plain beige background.

“I don’t need a tutorial to get started. Two Minute Learnings is pretty self-explanatory”

A cartoon illustration of a yellow, round character with large eyes, curly hair, and a small mouth. The character has thin, curved arms, one arm raised, and is wearing light blue pants and yellow shoes. The background is pale pink.

“I’m confused by the button at the end. Where does it take me?”

Cartoon character of a cactus with glasses and a smile, wearing blue pants, standing against a light purple background.

“I prefer to swipe between the different cards instead of clicking. This didn’t behave how I thought it would. ”

 The Solution

After iterating on the feedback, I handed off the designs to our engineering team

SOLUTION REVIEW

“Do these designs meet the product requirements and solve the user problem?”

I iterated to the final version based on user feedback and handed off the designs to the engineering team. We built the new feature and launched it for A/B Testing.

Visual Prominence on HP 👋

Learning tiles stand out from the rest of content and communicate that a user can expect a different kind of content.

Bite-sized Learnings with Structure 🧠

Each 2-Minute learning includes:

  • Quick introduction to what will be learned

  • Visually stimulating screens that are easy to skim

  • Summary of learnings with a delightful sense of completion

Seamless Interaction 🫥

Each 2-Minute Learning flows into the next which helps keep users learning and eliminates decision fatigue of what to watch next.

Winner

🤑

Winner 🤑

This design won and was productized 🎉

We increased active days by 3%

Increased frequency

📈

Increased frequency 📈

Reflecting on the Process

Once I finished the project, I reflected on what I would have done differently and provided next steps.

 REFLECTION

“What would I have done differently?”

  • I would have connected with our engineers earlier in the process because they were incredibly innovative during this project and had capabilities that I wasn’t aware of at the start of this project. It would have helped have a clearer picture of what was feasible to build.

“What would I do next?”

  • I would create a more involved learning experience that includes video and checks for learning to make it feel more practical and fun.

View Other Projects

The image features a dog standing on a rocky beach with a sunset sky in the background.
A black and white image of a full moon in the night sky.

MasterClass 🤖 AI Team

Pioneering a voice-first AI product

This is a black and white illustration of a fish with detailed scales and fins.
Black background with white text that says 'What’s in this image? Respond in American English.'

MasterClass 📈 Growth Team

Designing with AI-powered tools