introduction
〰️
introduction 〰️
Redesigning the interstitial page (plan selection)
How I went from this…
…to this!
Chegg is a popular SaaS-based provider of homework help & exam prep for US college students.
The interstitial page is the primary conversion point in Chegg’s lower funnel. Due to it’s financial impacts, this surface had become highly optimized over time through experimentation via A/B testing. Positive impacts to CVR became stagnant or minimal.
This redesign took the interstitial page to a new level, resulting in an unprecedented yield of:
7% Increase in CVR ($10M/YoY)
Product Design Team
Lead Product Designer (Me), Product Designer, Content Designer
Cross-functional Partners
Business-operations, Product Marketing Management, Engineering, Creative Marketing
Problem to be solved
This project began as an initiative to gauge the viability of multi-month plans, with a hefty goal of increasing CVR (conversion rate) by at least 2% on the interstitial page - the main point of conversion for Chegg customers.
Given the financial impact of this surface, the interstitial page had become highly optimized over time, through continuous experimentation. Our working team hypothesized that if we did not approach this initiative with a different, and “bold” strategy, then it was highly unlikely that we would reach our target.
Midway through the project, the business decided to drop multi-month plans, but our team remained keen on testing out these new design explorations.
design process
〰️
design process 〰️
Supporting Research & Data
Foundational
Chegg’s primary customer base are college students, who are generally more cost-adverse. Students tend to be more careful in their purchasing habits, holding higher standards toward personal gained value versus cost. To assess quality, students also gravitate towards products or experiences that are highly rated by their peers.
While Chegg offered a variety of learning tools and supported more than STEM subjects, we had found that many students were not aware of this. When given a more thorough explanation of Chegg’s value in interviews, students became excited and understood the prospect of how this would fit within their own study goals.
The competitive landscape
The student demographic was now primarily Gen-Z. To better understand trends and expectations of this demographic from a visual perspective, I conducted a competitive analysis with primary and secondary competitors. Something that stood out to me was the usage of high-contrast visuals, “catchy” headers and supportive copy.
The design principles
I formulated my concept of “bold” using foundational and new research/data. Given the appetite from the team to try something totally different, this initiative was an excellent opportunity for a design-driven strategy. I created a set of pillars to inform my design iterations which consisted of:
High contrast visual design
Trending with multiple direct and secondary competitors.
Opposite of Chegg’s visual identity and brand, aka a “bold” take.
“Speak the language”
Use a tone and language that is resonates with Gen-Z.
Include more content types that resonate with Gen-Z.
More social proof.
Explore all the possibilities
Provide more details on how things work, and how it can help with student outcomes.
Highlight less-known capabilities.
Designing the first iteration
For my initial design, I chose one of the darkest colors from the Chegg design system to achieve a high-contrast look. I took liberties with rewriting the headers and supporting copy with a tone shifting more towards Chegg’s younger audience. Below the fold, I added in new sections that would house additional information about subscribing and the benefits towards learning outcomes.
Selling “bold” to cross-functional partners
With a visual design approach that was vastly different from the status quo, it was important for me to share and collaborate with my cross-functional partners early and often. I found success through maintaining frequent communication and following up with design walkthroughs and collaborative working sessions to hash out and evangelize ideas.
Refining the visual design
Collaboration with Creative Marketing
I worked closely with the Creative Marketing team to reimagine the visual design language for the interstitial surface.
One of my challenges was to sell this team on the usage of darker colors, as this directly opposed the light and airy nature of the Chegg brand at this point in time.
Visual design exploration with Creative Marketing
Validating the design direction through multi-variant & A/B testing
By this time, the business had dropped multi-month plans, preferring to stick with monthly plans. I worked through this uncertain time with my partners in the product marketing management team to carry on with experimentation, adding some of the initial proposed design changes, but switching to our monthly plan cards. These experiments were pivotal in indicating success with this design approach, and produced tangible value. These results also served as the data needed to convince my partners in Creative Marketing to reconsider Chegg’s visual identity.
Initial Test - Multivariant test
Control
Winning variant
+4.16% CVR
Follow up test - A/B Test
Control
Winning variant
+3.08% CVR
outcomes
〰️
outcomes 〰️
Finalizing the design
With the success of our first set of tests, I continued to refine the “final” vision of this design with my working product design team and cross-functional partners, producing new animations and solidifying the content sections we would continue experimenting on. (It may take a few moments for the prototypes to load below)
Impact
To recap, our Multivariant & A/B tests resulted in
7% increase in CVR, a value of $10M/YoY.
These results had a significant impact, as we had not seen these types of numbers in years. This brought a lot of excitement throughout the business. Other teams were interested in integrating our findings into their own work and leaning more into design-led strategies. Notably, the official Chegg brand, and general visual design language at the company started evolving itself toward this bolder, high contrast palette.
Moving forward, the team is continuing experimentation on this surface, adding in the additional animations and content below the fold.