Project RAISE Case Study: Movie Player

Image for post
Image for post
Project is funded by the National Science Foundation for the College of Education.

Mission Statement/Overview

Project RAISE stands for “Reclaiming Access to Inquiry based Science Education”.

We are focused on using “Universal Design for Learning”. A principle that involves designing to encourage learning and stimulate interest. The National Science Foundation awarded $3 Million to the College of Education at UMass Amherst to develop an innovative new model for teaching science to the incarcerated youth. Read more about it here.

I was hired for the project as a User Experience Designer. I am primarily in charge of brainstorming and designing textbook activities which are interactive and fun, while helping students learn more about Ecology. In this series I will go through my design thinking process behind creating the experience of a few of the activities I’m working on. Some topics I have become familiar with while creating the textbook experience include biodiversity, the way that energy is spread throughout ecosystems, and how different animal populations are affected by changing environmental conditions. We go through design and development sprints which involves a series of designing and user testing followed by iteration based on feedback.

Understanding the users

The users are high school students ranging from ages 14–21. They have a very broad range of technical and academic capability. With this in mind it is important to design for all the different types of students that are going to be interacting with the textbook. Many have not been exposed to proper education and may have physical/mental disabilities. In order to maximize students’ learning, the textbook must encourage engagement, and this can be accomplished by building a simple interface filled with actions that are easy to interact and provide instant gratification. When designing for the students I need to keep all information and possible interactions in front of them. For example, there should be no way to minimize or hide actions, to avoid user confusion and distraction. These students have a tendency to go off track and lose focus when taken to a different page for example.

Design Activity: Movie Player

I outlined the core experience the movie player should present as well as some details to keep the experience consistent with the rest of the textbook. The design is structured so on the left side of the iPad will be a reading textbook page and the right side will be a related interactive activity to keep the students engaged.

  • Students can add/delete slides with media and text content. This includes imported videos, photos, and voice recording.
Image for post
Image for post
First version of movie Player(right). Sample textbook page on the left.

Usability Testing Feedback from the Students

We brought out iPads to the students in the correctional center to test the movie player. They were super excited and eager to play with them. We setup the testing in a classroom setting, we gave the students very little instruction besides a brief tutorial video they watched in the app. We wanted to see how much of the functionality and experience was intuitive for them. There were 5 students in the detention center who used the movie player. Afterwards we had them gather in a circle to get their impressions and suggestions. They found it amazing how we were actually listening to their feedback and planning on reiterating accordingly. These students grew up with tough lives and were often neglected. It isn’t normal for people to actually listen to what they have to say. We had also taken into consideration some observations we made when watching the students use the movie player.

We gathered all of the students feedback and compiled it into a document. For the most part, the feedback was positive. We came up with a few suggestions on our own as well. Here is a list of some of the feedback we decided to work with:

  • Iconography used for the buttons was confusing, a student stated that the icon used for picking colors looked like a mountain or a camera feature.
Image for post
Image for post
Image for post
Image for post
Sample Design Notes including how content should be deleted and possible iconography for animation button (requires A/B testing).

Reiteration

I discussed with the team all the feedback and revised the design. Here is the second version.

Image for post
Image for post
Second Iteration of Movie Player

Design Changes

  • I decided to create two toolbars and attach it to the slide so it was clear that the functions were associated with each shown slide. It establishes a distinction.

Next Steps

The next step would be to discuss with the team to get a final verdict before implementation and bringing the iPads out to students to test. The students are very excited to see the new revised version!

Read More Design Case Studies

Simulations Activity

Path Builder

Written by

Product & User Experience Designer | UMass Human-Computer Interaction ’19

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store