My Journey to improve Pluralsight’s learner experience!
Details
My role
Pluralsight
I worked on my own as a user researcher and product designer during my internship.
Tools
Figma, Google forms, Illustrator, Adobe analytics, Zoom
Sponsor
Methods
Competitive Analysis, Internal interviews, Co-design sessions, user Interviews, click tracking
May ‘20 - Aug ‘20
Timeline
Opportunity area
While on boarding myself to the Pluralsight platform I noticed that the course page and the accompanying video player was the area most in need of attention. The course page and the video player are the main points of contact for Pluralsight learners (users).
Thus, if Pluralsight can improve learner experience in those areas it can improve their ability to learn and the likelihood that they stay engaged.
Prototype
1 Course preview
To inform people what skills are going to be covered.
2 Pause screen
A place where people can dig deeper into the course materials or pivot to related courses.
3 Hover states
Hidden table of contents and browse bar that show on hover so that there are fewer distractions.
Course exploration
Tool Tabs
1 Info page
Access to the most pertinent information needed to determine what a course covers.
2 Notebook
Quick notes that include screen grabs so that they can be references easily later.
3 Transcript
Auto scrolling transcript that can be searched and highlighted, as well as easy quote generation.
4 Discussion
A place where people can share code and ask each other as well as the author questions.
The tool tabs pop up as windows when in full screen mode so that they can be placed on a second screen.
Full screen
Becoming a “learner”
People come to Pluralsight to learn tech skills. So they are referred to as learners. In order to understand Pluralsight learners I had to become one myself.
During my learning process I took note of times when I ran into road blocks.
I then talked with my team managers and told them that I would like to work on the course page (shown on the left) because it did not function as I expected out
Competitive analysis
Now that I had my focus on the course page. I started looking at how others in the online learning space structured their course pages.
I decided the best way to experience the competition was through the courses that they offered, so I signed up for courses from the top five tech learning platforms.
Visits: Coursera (50,884,863) Egghead (401211) Udemy (<10,000) Treehouse (<10,000) LinkedIn Learning (full site (1,170,522,123)
Takeaways
Structured lesson plans gave me confidence
Helpful tools increased my enjoyment
Too many distractions made it hard to focus
Voice of the customer
In order to understand how learners view the current course page I set up a few interviews.
Takeaways
People want to be able to use the course page as a summary of what will be covered in the course.
Learners want the tools and the material to be easily accessible.
Many people do not know that the course page exists.
Now that I had talked with learners and understood the state of the competition it was time to start scoping the project. I started by digging up any related internal research that I could find.
Past research
A researcher named Rich had looked into the functionality of the course page back in Q1 of 2018 (no visuals here since it was an internal report and I did not create it).
He created a set of recommendations based off of his findings. His recommendations were in line with my own findings.
Unify the course page and the video page
Make content easier to find for new learners
Make exercise files easier to find and use
Internal interviews
Empowered by Rich’s findings, I began setting up interviews with fellow product designers/managers and interns at Pluralsight to get their opinions on the course page. The questions I wanted to answer were:
How do people withing Pluralsight view the course page?
How do the various teams that own parts of the course page communicate?
What people at Pluralsight want the course page to do for them?
Breakdown of who would be responsible for what part of the new course page.
Takeaways
Agreement on the part of all teams that the course page needs a change.
For the course page to work properly many teams will have to work together.
If done properly the course page could improve the ability of other teams to deliver for the learners.
At this point I felt I had a design that was ready to be tested. So I began testing and iterating on it with internal and external stakeholders.
During my testing sessions I evaluated the course pages ability to complete what I had determined to be the three main learner jobs to be done
When learners arrive at the course page they want to figure out if the course is going to teach them what they want, so that they can start learning as quickly as possible.
“Combining the video player and the course page would decrease learner confusion and increase the utility of our learning tools.”
Product researcher
Inspired by
I chose to combine the video player and the course page(info page) for several reasons;
It decreases time to engagement and increases retainment.
It makes it easier for learners to access the learner tools.
It better resembles known entities such as YouTube and other major online learning sites
“I don't want to see the transcript. I want to see the video and I want to see it within the first 10 seconds.”
Author Evangalist
I chose to include a course preview video at landing so that learners can get an immediate visual representation of not only what is covered in the course, but how the material is presented. Both of which are considered of utmost importance to learners when they pick a course to take.
“The most important info to me is the table of contents
because
it allows me to see what the course is actually getting into.”
Machine Learning Engineer
I chose to auto collapse the table of contents once the video starts playing. That way the learners can keep an eye on their progress while not being distracted.
The table of contents will be on full display when learners first get to the course page so that they can evaluate the course content.
“The first things that I look at are the course title and the release date and then if I want to know more I’ll read the description.”
UX Designer
The course title, the release date and the description were shown to be the most important information based off of the interviews and data that I analyzed. Thus, I placed that information at the top of the course information architecture.
“So one key piece of information for me when evaluating things is the certification prep tags. ”
Information Security Officer
I wanted to make sure that learners could quickly understand how each course fits into their larger learning goals.
“I immediately go to my channels because that’s my safe space.”
Educator
I did two things to improve learners ability to add content to save their content for later. I created two places they can add to their channels and bookmarks.
I also changed the icon for offline downloading because the previous icon was too similar to the “exercise file download” icon
“It is important to allow people to keep moving forward.
To redirect rather than have to go backward.”
Leader of Discovery Team
Browsing content can be a discouraging task so I wanted Pluralsight learners to be able to easily pivot from one course to another without having to backtrack. I did not want them to feel like they hit a dead end, but rather that they are working on the right track.
To do this I made related content show up on the video player after the initial trailer and also always present at the bottom of the page, similar to how you would find related content on Amazon or eBay.
“If we could get learners to help us tag course
content it would greatly increase their accuracy.”
Head of Discovery Team
I know that tags are an important part of the content discovery process. So by crowdsourcing the tagging of content, hopefully it will be easier to find.
I hope that by surfacing all decision making data and allowing easy access to bookmarks and related content that learners will be able to find and engage with content quickly.
When learners are watching content they want a clutter free environment, so that they can focus and retain information.
“The top bar feels really cluttered and could be distracting if the video does not open in a new tab.”
Graphic Designer
One of the most visually dense objects on the original course page was the navigation bar. So in order to keep its functionality, but to limit its distraction I have it collapsed at resting state and expand upon hover.
“I don’t like how you have to scroll away from the video to see the stuff below.”
Author / Sr. Director of Engineering Practices
Since there is a lot of functionality below the video player I included a window within a window player that pops up so that learners can continue to view content while they post questions or highlight quotes in the transcript. This design idea was directly inspired by Coursera.
I hope that by minimizing both the top bar and table of contents, as well as offering continuous viewing while scrolling I can improve learners ability to stay focused.
Learners want to be able to apply their learning in real life.
“Exercise files are the only thing that I use on the course page.”
Software Engineer
The exercise files and the learning checks were shown to lead to the highest levels of engagement.
I integrated them into the table of contents so that learners know when the files are going to be used in the course as well as giving them one more place to find them.
“When I take some notes at a particular point of the video, I would like to have the screenshot of the video attached with that note automatically.”
Software Developer
Notetaking has been shown to strongly increase knowledge retention. More than that thought I wanted to create a tool that would allow learners to combine visual ques with their notetaking.
I included a screen grab and time stamp with each note for quick referencing. I also made a universal notebook shelf so that learners can organize their notes based on paths and courses. There is also the option to open any of the tools in a new window for those with multiple monitors (this will be the native action while in full screen mode)
I decided to evolve the transcript into an interactive document, where learners highlights will be added to their notebook and where they can follow along while the presenter is talking. Listening and reading at the same time has been shown to increase retention.
Also being able to search the transcript will give learners another way to find a part of the course that they want to review.
We hope that having everything on one page will make our powerful learning tools easier to access and learners will feel more gratified when they are rewarded for learning.
It is critical to release course page updates in a methodical manner so that we can measure each change as we make them.
Overall value added
By improving the learner experience and overall appearance at the course level we can increase engagement, learner satisfaction and conversion from free to paid subscriptions.
Next steps
1. Trouble shoot for accessibility
2. Increase gamification integration
3. Polish graphics and flow