Case Study: Incorporate MITx courses on OCW

My Contributions

  • Information Architecture
  • UX Design
  • UI Design

Background

In 2012 MIT and Harvard University launched edX, a platform that takes a different approach to distance learning than OCW. In an effort to collaborate within MIT's Office of Digital Learning, we launched a pilot project to offer MITx (MIT's offerings on the edX platform) courseware on OCW.
 

The Problem

OCW is designed around types of content: syllabi, readings, lecture videos, assignments, etc. The edX course platform was built with an entirely different site architecture than OCW. edX is designed around course progress: course text, quizzes, videos, etc, separated into time-based sequential units. When an MITx course ended, it would be taken down, unavailable to people who took the course and anyone else, unlike OCW which keeps courses up in perpetuity.

Solution

OCW publishes new courses and keeps all content free and open to anyone, working with MIT libraries to ensure that all content will be archived for posterity. If we could capture the instructional materials from an MITx course and map it to OCW’s architecture, we could fill this gap in edX’s platform. 

I worked with a team to conceive how we would incorporate an MITx course into OCW. We began by cloning the repository used to create the course and adapting it to fit our open copyright license and site standards. I worked with the production manager to fit the course into our site architecture, which had limits to how many hierarchical sections we could create a feature that edX uses extensively, and a discrepancy that had to be resolved to achieve our goal.

I worked on the UX issues while our team worked on content updates and backend development that was necessary. edX uses a horizontal navigation UI to move between subsections of a course, while OCW uses a vertical navigation to move between major sections. Mapping each subsection to the vertical menu would break the page layout and hit the limitations of hierarchy in our CMS, so I designed a UI based on the horizontal navigation used on edX, but in line with OCW’s design.

Complications arose. The edX platform allows course designers to create as many subsections to a unit as they would like, up to 22 in our pilot course. My first response was to use responsive web design methods to control the display of the navigation, but as OCW is unfortunately not currently a responsive site, it did not work well. Dedicated to making the solution as usable as possible, I developed a UI that was “big enough” to be tappable on smaller screened devices while still being able to accommodate a large number of course sections.

See the Pen Non-Responsive Buttons by Erik Mallinson (@erima) on CodePen.

The Outcome

The pilot project was a success, and opened the door to OCW offering MITx courses on OCW’s free and open platform.