How I redesigned navigation to keep learners on track.

I designed a universal sidebar to unify all content types during a major content merger. Learners can now track their progress without leaving the lesson, reducing distractions.

MY ROLE ON THE PROJECT

I led product design from early discovery to launch.

I worked closely with Product, Sales, CSM, and Data teams to:

Clarify the problem we were solving
Map how sales reps actually worked
Define what “good” recommendations looked like
Design the end-to-end experience

I owned the UX strategy, interaction design, and prototyping.

Platform migration was a catalyst for change.

At the end of 2023, QA Group reached a pivotal moment: we began migrating clients from Circus Street to the Cloud Academy platform. These clients were used to a simpler, highly intuitive UX—one they genuinely liked and trusted. The pressure to improve navigation and usability wasn’t just a nice-to-have—it was a business-critical need.

This shift gave us the opportunity to rethink our learning experience, starting with one of the biggest pain points: the sidebar(s).

Before, different content types had different sidebars. Learners struggled to understand where they were and how to track their progress. Many were exiting their sessions just to check their status on course landing pages, disrupting their learning session.

Old course and lesson's sidebar compared, showing significant inconsistancies.

The button to open the sidebar was often misinterpreted.

As a result, a significant number of users relied on the breadcrumb navigation to return to the Courses' landing page when seeking information about their progress, disrupting the learning experience.

Key challenges we faced

Inconsistent UI: Different sidebars (or none) depending on the content type
Progress friction: Users often exited sessions to check where they were
Complex structure: Courses, lessons, and programs all had different navigation logic
Unclear content hierarchy: Increased cognitive load for learners

A simplified content structure Illustration depicting a generic program made of 3 courses. One of the courses is displayed in detail and shows its content: 3 lessons, 1 lab and one exam. We can also see the content of a lesson which is: 3 video lectures, two text lectures (named articles) and a knowledge check)

Here's an example of QA’s complex content hierarchy for context.

How might we refine our learning flow while integrating new content from QA and Circus Street?

My process

Here’s a quick list of the steps I took to get to the solution:

Auditing the existing sidebar patterns and navigation behaviors

Mapping the content structure and all possible use cases

Prototyping sidebar layouts for multiple content types

Running unmoderated user tests to validate clarity and flow

Designing accessible, responsive components to support the final UI

Iterating on the designs based on feedback

The solution: a smarter, universal sidebar

I designed a universal sidebar that brings all content types into one consistent experience, so learners can stay focused, see their progress at a glance, and view videos comfortably (no need to toggle full screen!) – without interrupting their flow.

Key improvements include:

Clearer Content Hierarchy:

Supports up to 3 levels of content and has clearer visual cues (icons, duration, locked/unlocked status)

Progress at a glance:

Learners can see course progress, title, and duration at the top—but also at the lesson level, no need to leave the video

Progress at a glance:

Learners can see course progress, title, and duration at the top—but also at the lesson level, no need to leave the video

Seamless Continuation:

On return, learners are dropped back into the exact spot they left off

Seamless Continuation:

On return, learners are dropped back into the exact spot they left off

Intuitive and inclusive navigation:

Next/Previous buttons improve flow and inclusivity

Intuitive and inclusive navigation:

Next/Previous buttons improve flow and inclusivity

Consistent Experience:

One sidebar across lessons, courses, uplift courses, programs and blended courses

Consistent Experience:

One sidebar across lessons, courses, uplift courses, programs and blended courses

FOR THE PIXEL LOVERS

See details about the component I created and multiple use cases it covers

Quantitative and qualitative data

Following the implementation of the improved sidebar and other UI enhancements, user feedback and platform analytics indicated the following improvements:

Snapshot of some positive comments from the users we interviewed

Consistent positive feedback from Cloud Academy and newly migrated users

highlighting enhanced content clarity, ease of navigation, and a more seamless learning experience

Consistent positive feedback from Cloud Academy and newly migrated users

highlighting enhanced content clarity, ease of navigation, and a more seamless learning experience

53% decrease in users exiting the learning flow to check their course progress on the landing page

as key progress indicators are now visible in the sidebar, reducing unnecessary disruptions of the learning sessions

53% decrease in users exiting the learning flow to check their course progress on the landing page

as key progress indicators are now visible in the sidebar, reducing unnecessary disruptions of the learning sessions

28% reduction in the need for full-screen viewing

thanks to improved UI clarity and better visibility of the collapsible sidebar, allowing users to expand video lessons to a larger size by simply collapsing the sidebar

Check out more projects

UI of AI assistant illustrating chat and and text selection

What an AI sales tool taught me about product adoption

Designed an AI tool to help sales reps create learning recommendations faster and reduce reliance on SMEs. Early adoption was promising, but over time the project revealed bigger challenges around trust, workflows, and product adoption.

Time from lead to first offer dropped

Significant reduction in SME involvement

Revealed how AI adoption depends on trust, existing workflows, and user behavior

How a panel redesign helped Sales and Customer Success teams avoid critical setup errors

I redesigned a complex admin tool used daily by Sales and Customer Success teams to configure enterprise client settings. The legacy system made critical errors easy. I rebuilt it around clarity, feedback, and safer workflows, reducing support needs and user stress.

Drop in support tickets tied to misconfiguration

New CSMs reporting higher confidence earlier

+34% Adoption Growth

How I've helped QA users learn more confidently with an AI assistant.

I led the end-to-end design of Ela, QA’s AI-powered learning assistant, transforming an inherited prototype into a trusted and scalable product in just two months. Designed to reduce friction and support learning momentum, Ela is now adopted by 80+ client accounts, holds a 4.5/5 satisfaction score, and has influenced the development of new AI capabilities across the platform.

4.5/5 Avg. Rating

1,178 Client Accounts

+34% Adoption Growth

What an AI sales tool taught me about product adoption

Time from lead to first offer dropped

Significant reduction in SME involvement

Revealed how AI adoption depends on trust, existing workflows, and user behavior

How a panel redesign helped Sales and Customer Success teams avoid critical setup errors

Drop in support tickets tied to misconfiguration

New CSMs reporting higher confidence earlier

+34% Adoption Growth

How I helped Circus Street learners feel at home after a platform transition, without increasing support burden.

I unified QA Learning’s Course and Lesson experience during the merger of Circus Street and Cloud Academy into a single platform, helping Circus Street learners adapt to a more complex UX without increasing support burden or disrupting engagement.

0 increase in helpdesk tickets: smooth client transition

Users relied less (-20%) on secondary tabs after restructuring page hierarchy

Marathon's user dashboard and result page

How I gamified learning at Cloud Academy boosting user motivation and MoM cashflow.

I designed a 3-month challenge that increased engagement, reduced churn, and boosted cashflow. 20% of participants stayed active three months after—well beyond typical subscription periods.

+18% increase in MoM upfront cashflow

1,178 Client Accounts

+34% Adoption Growth