I redesigned QA's platform navigation to keep learners on track

MY ROLE ON THE PROJECT

I led product design on the universal sidebar from early discovery to launch, working with the Product Manager and engineering to shape what was feasible on the Cloud Academy platform, and with the Data team to measure how learners behaved before and after the change.

My objective was to help newly migrated Circus Street clients settle into Cloud Academy without losing the simplicity they were used to, which meant keeping learners inside their lessons and making their progress easy to find.

I owned the UX strategy, interaction design, prototyping and user testing, and I created the component that now supports every content type.

MY ROLE ON THE PROJECT

I owned the UX strategy, interaction design, prototyping and user testing, and created the component that now supports every content type.

Migrating Circus Street clients to Cloud Academy made navigation a priority

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.

Learners got lost because every content type behaved differently

Main issues we were dealing with:

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

• 4. 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.

I set out to find one structure that could work for every content type

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

A universal sidebar replaced the separate navigation for each content type

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.

Learners can now see where they are and how far they have come without leaving the lesson

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 CRAFT LOVERS

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

Fewer exits to the landing page and less need for full screen video

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

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

Snapshot of some positive comments from the users we interviewed

Check out more projects

From manual curation to self-service: an AI advisor that improved learning adoption and retention

63%

Adoption of AI generated programs

2.9X

Higher retention than standard programs

From manual curation to self-service: an AI advisor that improved learning adoption and retention

Enterprise learning relied heavily on admins to curate and assign training, which made personalization hard to scale. We used existing AI infrastructure to let learners create personalized learning paths based on their career goals, shifting learning discovery from an admin-led process to a more scalable, self-service experience.

63%

Adoption of AI generated programs

2.9X

Higher retention than standard programs

Ekho: an agent that keeps teams aligned, while the decision stays human

Multi-agent system design

Responsible AI

Human in the loop

Ekho: an agent that keeps teams aligned, while the decision stays human

Ekho AI was designed to catch team misalignment before it turns into rework, by acting as a project memory system that makes a team's decisions and their lineage visible across messy, fast-changing sources of information.

Multi-agent system design

Responsible AI

Human in the loop

What an AI sales tool taught me about trust and adoption

Time from lead to first offer dropped

Uncovered AI adoption barriers

What an AI sales tool taught me about trust and adoption

I 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

Uncovered AI adoption barriers

From guesswork to guardrails: a panel redesign that cut client setup errors by 26%

Drop in support tickets tied to misconfiguration

New CSMs reporting higher confidence earlier

From guesswork to guardrails: a panel redesign that cut client setup errors by 26%

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

Helping QA learners learn more confidently with an AI tutor built for trust

4.5/5

Avg. Rating

1,178

Client Accounts

34%

Adoption Growth

Helping QA learners learn more confidently with an AI tutor built for trust

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

Helping Circus Street learners feel at home after a platform transition, without increasing support burden

increase in helpdesk tickets

20%

reliance on secondary tabs after redesign

Helping 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.

increase in helpdesk tickets

20%

reliance on secondary tabs after redesign