top of page

ACTIVITY PAGE

KIDPASS | 2020

Sole product designer in charge of the visual & UX design, competitive research, user research, usability testing, data analysis, and strategy.

MY ROLE

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

TIMELINE

LOW BOOKING CONVERSION RATE FROM THE ACTIVITY PAGES

    • The CTAs to book and other actionable items on the page were not prominent enough and got lost with the rest of the content displayed

    • It was difficult for users to easily find the important information, which cause high drop off rates

  • Due to the large amount of information on the page, users were not easily able to navigate the page to find the information they wanted. For classes that had multiple booking options, the secondary option was hidden behind a tab, which users often did not click to because it wasn’t evident enough and it did appear to be a clickable element.

  • While ~50% of users were on mobile devices, these pages did not have good responsive design. Due to all the information on the page, a lot of scrolling was required to see the desired information, which caused the CTA that led to booking to get lost.

  • The visual design was outdated, too condensed, and there was inconsistent styling between sections on the same page.

THE PROBLEM

REDESIGN THE ACTIVITY PAGE TO INCREASE CONVERSION

To address the problem, we had to design a page that was responsive, had organized information hierarchy, and prioritized showcasing the CTAs that led to booking.

THE SOLUTION

THE INFORMATION DISCOVERY WAS CHALLENGING TO USERS, CAUSING HIGH DROP OFF RATES & LOW CONVERSION RATES

Research

1

Ideation

2

Internal feedback

3

Design iterations

4

Designing a useful and effective solution to the problem required 4 phases:

PROCESS

MOST USERS ONLY SCAN THE PAGE TO DECIDE IF THEY WILL BOOK

  • After analyzing page & conversion data, we discovered:

    • 9% click through rate

    • 6% booking conversion rate

    • 36% dropoff rate


    All this data indicates users only scanned the top of the page and dropped off after not being able to easily find the information they needed.

  • Other popular two-sided marketplaces have fixed booking buttons as the user scrolls the page and a sticky navigation for users to discover information on the page and navigate between different sections easily.

After analyzing data on the current activity page and conducting competitive research, we determined users do not want to spend a lot of time reading the details on the page to determine if they are interested in booking.

RESEARCH

DESIGNING BASED ON THE RESEARCH TAKEAWAYS

To start ideating, I began sketching out the layout for the new activity page. The goal of the new design was to incorporate the patterns users are accustomed to based on the competitive research, while also organizing the information on the page in a way that users can discover what they need to know quickly.

IDEATION

DESIGNING THE PAGE TO BE MORE SCANNABLE WILL LEAD TO INCREASED CONVERSION

CONDUCT USABILITY TESTS WITH INTERNAL STAKEHOLDERS

After designing lo-fidelity mockups of the activity page, I conducted usability tests with internal stakeholders that are less familiar with our product. They went through the pages and spoke aloud as they did. Afterwards, I asked them questions to asses the information they retained. Getting their feedback in this phase of the design process is crucial as it allows me to validate assumptions and iterate on the designs before the engineering team begins developing. Using their feedback, I moved on to designing hi-fidelity mockups.

STAKEHOLDER FEEDBACK

USER-FRIENDLY & RESPONSIVE ACTIVITY PAGES

After incorporating the stakeholder feedback, I worked cross-functionally to ensure a seamless launch of the redesigned pages. I worked with engineering to discuss feasibility and QA designs and with product management to scope out the different sections of the redesigns.

The redesigned pages include:

  • Cleaner visual design with caonsistent styling

  • Better information hierarchy & discovery, including:

    • A sticky navigation to easily see the sections on a page and link to them without having to scroll

    • Succinct information previews for important details, so users can assess how and if they want to book from a glance

  • Improved UX components, including radio buttons to select different booking types

  • Sticky booking buttons, so users can click to book at any point on the page

FINAL DESIGNS

CONVERSION RATE INCREASED 95% & BOOKINGS INCREASED 48%

After launch, the data proved that the redesigned pages were a success. Drop off rates decreased 12%, time spent on the page increased 7%, and the click through rate on the booking button increased 15%, which led to increased conversion & bookings.



 

The biggest takeaway from this project was to always keep the user in mind when designing. While there may be a lot of information we want to communicate internally, most users only care about the high level details.

Moving forward, we will continue to monitor the data and iterate where needed.

OUTCOME

THE REDESIGNED PAGE ALLOWED USERS TO SCAN FOR IMPORTANT INFORMATION & BOOK EASILY

bottom of page