# A learning platform redesign that raised CSAT 74%.

Case study by Gabriel Pauli, Senior Product Designer. Parceiro da Construção, 2021. Source: https://gabrielpauli.com/work/pdc-redesign

Builders and contractors in civil construction use this platform to learn techniques and products. Years of technical debt made basic tasks hard, like returning to a course or downloading a certificate. I redesigned it so students pick up where they left off.

I was the only product designer, from discovery to delivery, working with a product owner, a data analyst and two engineers.

- [Figure] The redesigned course list on the platform’s blue. The page rises into place and its parts settle in one after another: a sidebar with Home, Courses, Trails, Events and Club, the Courses header, a welcome banner reading “Let’s start your journey, partner?” with a stack of course cards beside it, and three suggested courses. It holds a few seconds, then fades and rises again.

## Results

1. **Customer satisfaction (CSAT) went from 54 to 94.** From a 1–5 satisfaction survey, comparing the three months before release with the three months after.
2. **Usability scored 90.5 on SUS, against a benchmark of 68.** Before launch, five students rated the new design on the System Usability Scale. 68 is the average score, so the new design came in well above it.

## The situation: Some of the most visited pages had the lowest task completion.

Usability tests and support tickets pointed at three places. CSAT was at 54 and engagement was going down.

1. **Started courses were hard to find.** The course list opened on badges and points, with every course mixed together.
2. **The class player never said what came next.** Progress was unclear, and PDFs and extra reading were hidden in tabs.
3. **Certificates were buried inside finished courses.** Students shared them with their companies, but first had to find the right course.

- [Image] The old course list: an Achievements box of badges, a points total and a performance index open the page, above recommended courses and every other course. *The old course list, opening on badges, points and a performance index.*
- [Image] The old class player: a video above About this lesson and Support Materials tabs, next to a plain list of classes with no progress. *The old class player: a video, two tabs and a list of classes with no progress.*

## The goal: Show students where they left off and what comes next, so finishing a course takes less effort.

Students needed to get back to their courses, know what to do after each class and reach their certificates without searching.

The business needed better retention and more people using the platform. Several partner brands were on the platform, so the experience mattered for their brands too.

## Decision 01: A student who just signed up and one who just got certified need different first screens.

Before the redesign, I ran [two experiments](https://gabrielpauli.com/work/pdc-experiments) on the platform, and they made the case for rethinking how the pages were organised. Everyone saw the same catalogue, whether it was their first login or they had just finished a course.

My question was what to organise the pages around, and I chose the student’s own progress.

Before redrawing any screen, I mapped what a student needs at three moments: their first login, after their first course and after their first certificate.

That was the minimum we needed to welcome new students and then follow them as they progressed. The map became the reference the team used to agree on scope.

- [Figure] The redesigned course list at three moments, one at a time: a welcome banner and suggested courses for a new student, an In progress card with a Continue button once a course is under way, and a Completed card with Download certificate and Retake course buttons after a course is finished.

## Decision 02: The course list leads with the courses a student is taking.

The old course list opened on badges, a points total and a performance index. The experiments had already shown that returning students need their courses in progress first, so I rebuilt the list around them.

Points and performance moved off the list, to a new page that another designer was working on.

Certificates had to be just as easy to reach, because students used them for work. Once a student finishes a course, its certificate now sits at the top of the list, next to the courses they’re taking.

- [Figure] The old and new course lists, one over the other, with a handle to compare them. The old list opens on an Achievements box of badges, a points total and a performance index; the new one opens on the student’s course in progress, with a Continue button.

## Decision 03: A student should never have to work out what to do after a class.

I wanted each class page to answer two questions before the student had to ask them. How far through the course am I, and what comes next?

So progress sits on every class page, and the classes build up to a final exam that marks the end. The next class is always one step away. It sounds basic, but the old player had none of it.

The support material came out of the tabs, too. PDFs and extra reading now sit on the class page, where students can see them.

- [Image] The old class player: a video above About this lesson and Support Materials tabs, next to a plain list of classes with no progress. *The old class player: a video, two tabs and a list of classes with no progress.*
- [Image] The redesigned class page: 4 out of 12 classes completed above the modules and the final exam, a Next class button over the video, and support materials beside About this class. *The redesigned class page: progress, the next class and the support materials in view.*

## The outcome: User satisfaction nearly doubled in the three months after launch.

CSAT rose 40 points after release, and students got their courses, their next class and their certificates without searching for them.
