Cornerstone OnDemand

Cornerstone onDemand e-Learning

Cornerstone On Demand is a cloud based learning and talent managing solutions provider. I was tasked to redesign the Curriculum Player in the Learning Platform. It allows administrators to assign a set of training to employees to learn about different topics. This platform provides organization and structured learning and it is used by 80% of our clients.

Role

Product Designer

Tools

Jan 2019 - Aug 2019

Skills

Sketch, Adobe Illustrator, Invision, Craft, Zeplin

Overview

The Problem Space 👻

Corporate online learning has evolved over time, however the old adage of their actual effectiveness can surely be debated. Many companies invest in individualized learning which mimics educational institutions to cultivate learning and knowledge. Through research, I found that many members believe using the player is a difficult and time consuming experience that is out of necessity from upper management. 

I wanted to rethink the way people could engage with the current player in a more meaningful way, especially showcase its benefit to those who want to learn from their corporate prospective libraries. 


The Solution ✨

I redesigned the curriculum prioritizing its information architecture and behavioral design regarding progress in mind. My solution optimizes and eases navigation within the player through a renewed horizontal navigation bar as curriculums often have nested sections upon sections which initially discouraged users to explore the curriculums in the first place.

With the goal of increasing user engagement with the learning modules, I designed progress bars in order to create a sense of reward after finishing their modules.


Research Process

User Interviews

Participants: 13 participants, 4 different geographical locations (in office, usertesting external participants)

Goal: To get a detailed understanding of the type of people that used the player and their workflow using the curriculum player, task by task, including emotional their pain points.

Outcome: I was able to distinguish the target users that utilized the player including their pain points within their journey. These pain points provided me a starting point for redesigning this experience.


Competitive Analysis

Key Takeaway: Current competitors offer massive libraries comparable to Cornerstone’s own product library with extensive ways to organize their content. Other extensive products even provide personalized content based on browsing history. However, I knew that it was important to stay within my scope and time constraints. Therefore, I noted how competitor products’ organized their content and their current library’s interactions. 


Online Learning Competitors

Target Users 👩🏽‍💻

Main Findings & Pain Points

01 - Hierarchy Navigation

All current and new users of the curriculum player had difficulty finding the curriculum that they were supposed to do. Therefore, 80% users in turn forfeit from even starting the task. Showcasing a system’s status to a user is one of Nielsen’s Heuristics that the experience already failed to accomplish.

  • “Couldn’t find a way back” 
  • “Tried to go back to view summary but started over”
  • “Couldn’t figure out how to go ‘one level’ back up”
02 - Notification of Completion & Progress

This was another missed opportunity to showcase the system’s or their curriculum’s status. Something simple as displaying completion and their progress can change user behavior towards motivation in completing these curriculums.

03 - Mental Model Disconnect

Some users who were assigned tasks were unsure of what the hierarchy was in a curriculum. Some were unable to distinguish the differences between a curriculum and an online class because of the similarity of the icons.


Design & Testing

User flow

After researching the flow to multiple audiences and gathering constraining data that currently exist with the current curriculum library. I created a simple flow of how the information correlates with the decisions users make and see.

Prototyping & Testing

I created and brainstormed iterations upon iterations of the curriculum player based on the information that I was provided. One of the main problems were nested sections on subsections. The current library would house nested sections on sections that would make it more difficult to navigate for the user. Based on this information, I outlined simple tasks for the new prototypes to be tested.

Outlined Benchmark Tasks
  1. Task 1: Navigate to the overview.
  2. Task 2: Navigate to a subsection of a learning module.
  3. Task 3: Navigate to a section within the subsection of the same learning module.
  4. Task 4: Watch and finish a learning module.

Iterations

Concept 01 - 

Visual Redesign on the current player without sacrificing its current information architecture. At this iteration, I was unaware of the current amount of data that curriculum libraries held, which made this iteration impractical. 


Concept 02 - 

I redesigned the navigation to allow for a user to understand where the section was nested within another section. This follows a common design pattern within products that house multiple subsections also such as public museums or scientific libraries. 

Concept 03 - 

This navigation closely resembles Concept 02, however, the user would be able to see the entirety of the subsections offered instead. However, this also was impractical and showcasing the entire library would overwhelm our users in addition to lose our window of opportunity in showcasing progress. 



Outcome & Results

After creating prototypes and mockups, I needed more data on what design patterns were working or easing the struggles of my end users. Primarily, I user tested the mockups through UserTesting.com, where I was able to screen my users and write a script of the scenario. I tested the designs of that aimed to solve the pain points.

I consulted my fellow design team for other design patterns they have commonly seen in the web or throughout their career that could potentially help my redesign.

Hierarchy Navigation

Information Architecture is tough and challenging.

When given a robust library of information for users, there will be a learning curve for any user. Since the curriculum player was a tool that users often spent a large amount of time on, I chose to design navigation behaviors that were already a cultural norm to users. I used a horizontal navigation bar because it has a shallow learning curve as it was a design pattern used by sites with multiple levels of information. Instead of reinventing the wheel, I thought it would be appropriate to imitate patterns that already exist in current industry trends.

Understanding Progress

Users were often unaware of their progress within a learning module. With the goal of increasing user engagement with the learning modules, I designed progress bars in order to create a sense of reward after finishing their modules. 

I designed 2 types of visualization for progress. 

  1. First, I created a donut progress bar to indicate how much progress has been made in the entire curriculum
  2. Second, there would be a horizontal progress bar for each subsection to help users understand their position relative to completion.

Final Product

Check out my Figma Prototype here!

Takeaways

Design is adaptive, it really transforms depending on users and the scope of the problem! Being a designer and a problem solver, I often want to solve all the problems, however, it is important to take a step back and focus on the given problem. 

Every step in the design process is important! As much as prototyping is critical to a redesign, it is important to keep in mind the research and the testing needed to improve on the product.