Circuits / General Assembly

A platform for taking GA courses online

portfolio-circuits-dashboard-final.png

Problem
Create an online course platform with completion rates on-par with in-person courses.

Solution
A student facing platform for delivering interactive content, and an internal course management tool.

Outcome
An online course with completion rates above 75%.

Role
Lead Product Designer, Front-end development, Mentor

 

Overview

One of my main areas of focus at General Assembly was online education. Early on in my time at General Assembly I was the lead designer on GA’s first online offering, Front Row, a subscription service for on-demand video classes.

My second project in online education, Circuits, was a much more ambitious project. Circuits were 5-10 week cohort-based courses. The goal was to help GA scale their courses to customers outside of the cities where they had established their campuses.

We wanted to create an online course experience with a completion rate on-par with our in-person classes. GA’s main value was in creating outcomes for students, and the first step in helping students achieve their outcomes was to ensure they finished the course.

We knew that our core challenge would be keeping students engaged over the course of the roughly 12 week course, given that online courses historically, such as MOOCs (Massive Open Online Courses) , had very low completion rates.

Role

I was the lead designer responsible for:

  1. The student UX across digital and non-digital touchpoints including the learning platform and synchronous learning sessions.

  2. The admin tools that our team of course producers and curriculum designers would use to manage cohorts of students, as well as upload an iterate on the course content.

Research

To kick-off the project we did research with our target end user, as well as internal stakeholders. Below were our main takeaways.

Target user (students who’d be interested in an online course):

  • Most students who came to GA had previously tried to teach themselves and hadn’t gotten the results they were seeking. They felt in-person learning would help hold them accountable, and would provide a community to help them succeed.

  • Many students were at least partially employed and valued a blend of synchronous and asynchronous learning.

  • Many interested students were actually located in markets where we had campuses (e.g New York, London, LA) but had life circumstances that prevented them from being able to attend in-person courses (e.g. they were parents).

Internal Stakeholders (curriculum designers, course producers, and instructors):

  • Mentors and producers needed to be able to easily keep track of the progress of many students at any one time.

  • Instructional designers needed to be able to iterate on curriculum based on feedback, without disrupting the experience of students who were in-progress.

  • We wanted to launch in < 3 months, meaning the first cohorts would start before all the curriculum had been finished.

Process

Customer Journey map

portfolio-circuits-journey-map-zoom.png

One of the first steps I took was to facilitate a workshop which culminated in the creation of a customer journey map. This enabled us to visualize the experience through the lens of different student personas. We used this to inform marketing, onboarding, and the course experience, including student interactions with their course producers and mentors.

Experience Attributes

portfolio-circuits-attributes-3.png

Another activity I proposed and facilitated was the creation of Experience Attributes. Experience Attributes, a tool described by Kim Goodwin in Designing for the Digital Age, are “adjectives that describe the messages or personality the product should convey”. While originally intended to inform the look of a product, I felt it was a useful tool for describing how the product and service we were developing should both look and feel as students interacted with it through various touchpoints.

At the time, our team of instructional designers, mentors, customer service, designers and engineers was rapidly expanding and I wanted to ensure that we were working from a shared set of principles.

These attributes informed design decisions, such as that the platform should convey the human aspect by focusing on highlighting classmates and instructors in the UI.

Information architecture

portfolio-circuits-wireframes.png

The core goals for the design of the platform were:

  • Make it easy to understand. The course material should be challenging. Figuring out how to use the platform shouldn’t be. Students should be able to easily understand their progress, what they need to do next, and be able to complete activities easily.

  • Encourage completion. GA’s main value was on providing outcomes for students, and that started with helping students finish the program.

  • Encourage community. Given our user research suggested that many students came to GA because they tried to learn on their own and failed. We looked towards our in-person courses, which had a high completion rate, for inspiration. In addition to having in-person 1:1s and group sessions, we wanted the platform to reflect that students were taking this course with a group of students.

This project had an ambitious timeline. We were given a goal of launching the first course in less than 3 months. We had to design and build the platform UX, as well as create dozens of hours of video, quiz, and in-browser code challenge content.

We took an iterative approach. I started by establishing the information architecture and main screens and states. This enabled engineering to start building the app, while I worked with Product on fleshing out the details.

Dashboard

portfolio-circuits-dashboard-final.png

The concept for the course dashboard was to be an overview of the course content and other key information. We wanted to make it easy for students to figure out where they left off and what to do next.

Unit page

portfolio-circuits-dashboard-unit-page.png

Each week students would progress through a new Unit. Units included a series of videos, assessments, in-browser code challenges, and final projects. One of the key design decisions was to show the progress of each member of the cohort. The goal was to motivate students to want to keep pace with others. Feedback from students was that this detail was highly effective in motivating them to finish each unit.

Assessments

portfolio-circuits-quiz.png

Assessments included a series of multiple choice questions. Quiz scores were viewable to admins and curriculum designers who used that information to figure out which students needed support and which parts of our curriculum might need work.


Code Challenges

portfolio-circuits-code-challenge.png

One of the more challenging UI challenges were the interactive code challenges. Starting with our SQL course, we built an entirely new CMS and student facing experience.

One challenge in ensuring the code challenges were easy to understand was access to usage data. Unlike a quiz, where we could see which questions students were struggling with, writing code is a much more complex interaction. In order to figure out where students were having difficulty, we used a screen recording tool that enabled us to watch along as students attempted the code challenges. We were then able to pinpoint exactly which steps were confusing and then work quickly to iterate on the content.

Mentors

portfolio-circuits-book-one-on-one.png

“Mentors” were internal staff who led in-person sessions, gave students feedback on their work, and generally helped students when they were stuck. They were a big part of the value prop for Circuits considering most students had previously had trouble learning on their own. We wanted to make sure that students could easily book time with their mentors. To to do this, we built a simple system using Calend.ly. Each mentor had a unique calendar that students could access from within the UI.

Profiles and Projects

portfolio-circuits-profile.png

In order to encourage students to create high quality work we created profile pages that emphasized their projects much like a portfolio site would.

We also created versions of project pages that non-logged in users could see so that students could share them. This also helped us spread the word about the product and gain new customers.

portfolio-circuits-project.png

Admin tools

portfolio-circuits-admin-curriculum.png

We also created versions of project pages that non-logged in users could see so that students could share them. This also helped us spread the word about the product and gain new customers.

Besides the student experience, the other stakeholders for this project were our team of internal course producers and instructional designers.

We decided to build a CMS to ensure we’d have the flexibility to deliver the highest quality experience we could. The CMS enabled producers to create curricula, as well as create and manage cohorts of students.

One design challenge was that we wanted to be able to iterate on curricula based off feedback without it impacting students who were already taking the course. To achieved this, we built a versioning system which allowed curriculum designers to version the curricula. Course producers could then choose the latest version when creating new cohorts. This was key to helping us quickly iterate on the product and scale it quickly.

Outcome

When I left GA in 2016 over 2,000 students had taken Circuits, and the completion rates were inline with our in-person course completion rates, at around 75%.