Select Page

Udemy Course-Taking Experience

The Challenge

Learning on-the-go is a relatively new concept. In today’s constantly-changing world, it seems like there’s always something new to learn or new trends to keep up with. With video as the main vehicle for delivering the ability to learn, we explored how we might create tools and features that aid learning while mobile.

Platform
iOS & Android devices

Role
Lead Designer

How are Students Learning

To determine what course-taking on a mobile device might look like, we first had to look at how people were using their mobile devices to learn. Working with our research team, we looked through usage analytics to see high-level trends, performed user interviews to get anecdotal evidence, and looked through support tickets to see how the app was being used as users encountered issues. Through this, we found two main use cases. The first was that many students were using their mobile device as a second screen to watch video while they practiced on another device (usually a laptop/desktop). The second use case were students who use their mobile device to consume content during their commute, or some other activity while away from home (for example, while on the treadmill at the gym).

Improving the Video Player

For students that were using the mobile app as a second screen device, one of their biggest issues was trying rewatch a part of a lecture if they missed something. Because of how long each video lecture could be, getting to a specific point in the video could be a bit tedious. To help with this, we introduced the ability to jump forward or backward 15 seconds. We explored different time intervals, but eventually decided on 15 seconds as a way to more precisely scrub through the video.

 

The rewind-15 and forward-15 controls next to the playhead so all playback controls are near each other.

For students that were learning on the go, we explored what would provide students with more flexibility with their courses. Two features implemented were bookmarking and background audio mode. The use case for bookmarking was for students that found an interesting point in a lecture that they wanted to revisit at a later time. By bookmarking a point within a lecture, the student could see key points in a lecture and quickly revisit those points. Guiding another designer, we defined where a student can set a bookmark, and how they revisit the bookmarks.

The hero flow when a student bookmarks a point in the video.

Background audio was important for those commuting, since in many cases, it could be difficult to watch the video. A limitation for mobile devices was that video could not stream while the device was locked. We needed to find a way to allow students to listen to the audio track while the device was locked and control the playback. This was accomplished by seamlessly switching between the video playback and audio playback to provide an experience that required no effort. A student would just need to hit the lock button to lock their phone, as they normally would. The app would automatically switch video & audio playback, to just audio playback so that the student can continue to listen to the course. We also used the native playback controls on the lock screen to give students control to go to the next or a previous lecture.

Keep on Learning

While the video player is the main learning vehicle, there were several other opportunities elsewhere in the app to aid re-engagement and provide more learning material. One thing we heard from students was that it was difficult to continue a lecture/course from where they had previously left off. To solve this, we added a call-to-action to the home screen that gave students a way to easily jump to where they had left off in the lecture.

 

We explored different placements for a module to resume your previous course, but ultimately ended on the first 2 variations.

Another improvement was the inclusion of additional learning material. Instructors generally would provide additional information or research in the form of links, text documents, or slideshows (called “Supplementary Material”). All of these were previously not accessible in the mobile app, so we created a way for students to access these materials.

One last frequent request  we heard from students was the ability to still take courses without an internet connection. By creating a mechanism that allowed students to select lectures, sections, or whole courses as available for offline consumption, we give the students control as to how they can take their course.

Animating the download button, to a progress indication, back to the downloaded icon.

And after the student views the course, they can delete it from their phone.