ProductLed provides cohort based training and courses for product managers. The course content was organized using a LMS. I had the opportunity to redesign the structure of the course page.
UX Design, UI Design, Wireframing
While looking through the student feedback form, ProductLed realized there were repeated complaints from students about not knowing which course to take next. This impacted the business as student were less engaged which in turn led to drops in course completion rates.
The student dashboard simply listed the courses, however, some courses were live while others were on-demand. There was also no indicators of what courses were required for the current week.
After gaining clarity on the challenges of the existing course structure, the goals were broken down into 3 major parts:
While keeping the goals in mind, I created a user flow for an ideal scenario. Since this was for a 6 week program, I decided that grouping the courses by week was the way to go. It would make it easier for students to keep track and also know if they were falling behind.
Once I was settled on grouping the courses by week, I brainstormed multiple ideas with quick sketches. This exploration led me to two different layouts.
The layouts for both concepts were converted to wireframes to get a better sense of the experience. These two concepts were presented to the team and a choice had to be made
The layout utilized the accordion component for exploring courses.
This layout utilized the side navigation for drilling down into courses
After a presentation of the two concepts, Option A was chosen because of its simplicity. Also, given the time and resource constraints, it was also the most cost effective option. Another reason was the ease of making it responsive for mobile devices compared to option B.
This component was designed to keep students engaged throughout the course. Having a visual representation of their progress would serve as an extra motivator as the bar fills up.
Another solution to the sequence of courses was to add a link to the next course on the current course page. This saves users the time of going back to the course page to continue learning
After a few iterations and revisions, we finalized the design
We took into account that students may be on the go or in transit while taking the course so we maintained a consistent experience with the desktop version.
0% Student complaints on course sequence.
ProductLed also saw an increase in course completion rates. This had the potential to generate more course sales as students were more likely to refer others.