top of page

MIKAELA Z BLOCH

QUIZ RECOMMENDATION PAGE

BEGIN | 2024

Product designer in charge of the visual & UX design, competitive research, and usability testing.

MY ROLE

Researching, ideating, testing, and designing the solution took around 1 month.

TIMELINE

PARENTS NEED TO TRUST OUR RECOMMENDATION & UNDERSTAND THE PRODUCT VALUE TO CONVERT 

Research

1

Ideation

2

Internal feedback

3

Usability testing

4

Design iterations & MVP launch

5

Usability testing round 2

6

Design iterations & launch of redesigns

7

Designing a useful and effective quiz recommendtion page required 7 phases:

PROCESS

KEEP IT SIMPLE, BUT ALLOW FOR OPTIONAL EXTRA INFORMATION

  • I spoke with our internal team and various stakeholder to better understand the details of the product we’d be recommending. The product:

    • Is a bundled membership that has different stages relevant to the child’s current ages & learning level

    • Includes digital apps & classes, tangible kits, books, and printables

  • To better understand who I would be designing a page for, I spoke with our Learning Team to learn more about our users. They explained the ideal user we target and their goals and needs for their children. This information is helpful when designing the page so I know what pieces of information to highlight.

  • Quiz recommendation pages on other e-commerce sites:

    • Either served as the product detail page or led to a product detail page

    • Kept the recommendation simple and easy to understand

    • Had concise above the fold information to make it easier for users to continue to checkout.

    • Included any additional information in collapsed items or lower on the page

To begin designing the quiz recommendation page, I first needed to better understand the product we will be recommending, our users we will be showing the product to, and how other companies recommend products to their users.

RESEARCH

DESIGNING BASED ON THE RESEARCH TAKEAWAYS

To start ideating, I began sketching out the layout of what the quiz recommendation page could look like. The main two goals of the designs were:

  1. To put all necessary information about the product on the page, while highlighting the most important information above the fold

  2. To convert users to purchasing the product by showcasing the membership through detailed product imagery and emotionally resonant lifestyle imagery

IDEATION

Including membership details above the fold

Including a membership staging visual explanation

USERS WANT TRANSPARENCY ABOUT THE PRODUCT DETAILS

We ran user interviews on a prototype that led users through the quiz until they saw the recommendation page. There was a generally positive reaction to the recommendation and its relevance, but users were confused about the details of the membership recommended. Based on their confusion, I designed solutions to the following needs:

  • Concisely explaining what’s included in the membership above the fold

  • Explaining how the leveling of the membership works and how users automatically progress to new stages

USABILITY TESTING

COLLABORATING CROSS-FUNCTIONALITY TO LAUNCH THE UPDATES

The updated designs were launched recently and I worked with engineering, product management, and marketing to ensure a fast and seamless launch. We will continue to monitor the data and iterate where needed.

OUTCOME

GIVING USERS THE OPTION TO VIEW MORE DETAIL ALLEVIATES THEIR CONCERNS ABOUT CONVERTING

RECOMMEND A PRODUCT BASED ON ANSWERS FROM A QUIZ FLOW

  • Users need to feel that the recommended product is accurately personalized to them based on the answers they gave in the quiz. Users should trust the brand’s expertise and the recommendation given.

  • The recommendation page is also acting as a product detail page, so it has to effectively present the components of the product and explain to the user what is included. Most of the products recommended are bundles of digital apps and classes, physical activity kits, and books, so the page needs to communicate the breadth of the offering. Users need to understand how much they are getting and the value of the product.

  • If we are able to emotionally connect to parents and effectively communicate that their child will have fun engaging with the product, the likelihood of purchasing increases.

  • The main goal of this page is to lead users to convert. On this page, we need to convince them this is the right product for their child to get them to move forward to plan selection and through checkout.

Begin is launching a new feature, where users can take a quiz that will result in a recommended product with the goal of increasing purchases by allowing parents to efficiently find the best product fit for their child. When starting to design the recommendation page, I had to take into account the following:

THE TASK

LAUNCH OF A NEW QUIZ & RECOMMENDATION EXPERIENCE

After finalizing designs based on the user testing feedback, I worked cross-functionally to launch the quiz recommendation page. I worked with:

  • Engineering to review the new functionality and QA design

  • Data team to run them through the page and conversion points

  • Product management to implement the designs

  • Marketing to ensure the designs aligned with our branding

MVP DESIGNS

ITERATING BASED ON MVP LAUNCH DATA

  • Users incorrectly assumed the recommendation was a completely personalized solution, while it is a set product being recommended to them based on their child’s age & stage. To be more transparent about how this was recommended, we decided to:

    • Reiterate only the age & stage selected in the quiz at the top of the page and omit the other questions selected

    • Remove the title “[Child Name]’s All-In-One Begin Membership” and just display it to the product name

  • To improve overall page conversion, we decided to:

    • Ensure users can easily discover the secondary, lower-priced recommendations in case the reason for not converting on the primary recommendation of the premium membership is due to price

    • Position the secondary recommendations as also related to the stage the user was placed in as they are still based on age

  • Users felt overwhelmed on the page and were unable to find the information they needed, so we:

    • Reduced information overload & redundant information to not overwhelm users

    • Described what is included in the recommendations in a simple list

    • Clearly merchandised the recommended products (primary/premium & secondary) based on their relative hierarchy and business goals

    • Added an FAQ section that can simply answer any questions users may have about the products

  • To allow users to trust our recommendations, we needed to make sure they understand that our products & algorithm are based in research by our Learning Team, which included:

    • Highlighting the skills related to the stage the user’s child was placed

    • Clearly explaining why we recommended the premium membership & relating it back to the skills above

After launching the quiz experience and recommendation page, conversion rates were low at less than 1%, so we decided to iterate on the approach:

MVP RESULTS

Adding tags to reiterate the age & stage answers from the quiz & bringing the stage diagram to the top

Adding a premium exclusives tag to differentiate the primary recommendation

Concisely including more details about the secondary recommendations

USERS’ UNDERSTANDING OF THE RECOMMENDATIONS IMPROVED

We user tested the updated designs with questions directed at the problems of the initial designs.

Positive feedback:

  • Most users thought the page answered all of their questions

  • Everyone found the page easy to understand & navigate


Areas to improve:

  • While everyone understood stage was related to age, most users wanted more explanation abut how the staging worked

  • Most users assumed premium was just a combination of the app & kits options, while it actually encompasses much more and communicating that is key to justifying the price

USABILITY TESTING PT. 2

LAUNCH OF UPDATED DESIGNS INCORPORATING USER FEEDBACK

  • To better explain the staging, we brought back the visual stage diagram used in the MVP designs to clarify where the child was placed in the overall journey

  • To clearly communicate the value of the premium membership, we added a “PREMIUM EXCLUSIVES” tag above the items that are included in premium, but not included in the secondary app & kits options

REDESGINS

bottom of page