product designer
illustration-email1.png

Student Planner

edmodo.com ・ spring & fall 2018

Student Planner

EDMODO.com / March 2018 - December 2018

For this project, I was tasked with updating one of the key features of the student side of Edmodo, the planner. The planner hadn't had any major updates for quite some time and was clunky and hard to use. Our goals were to improve the experience of using the planner and make it something that students could easily use on a day-to-day basis. One of the key issues with the current project was that there was no way for students to create their own tasks or homework assignments. This made them dependent on the teacher and we knew that giving the students agency over their planners would improve the usefulness and the experience overall. I led the entire process end to end, conducting user research alongside my PM and working with the crossfunctional development teams for web and mobile. We took a mobile-first approach to this project both due to resource allocation and also because it was a student facing project and that's what they used on a day to day basis.

The starting point for planner on mobile

Initial research

We began this project by conducting lightweight interviews with 8 -10 students grades 6-12. We asked them to bring their paper planners or other ways that they kept track of their work with them. During the interviews we asked them questions about their day-to-day lives, what they did for fun, what classes do they take, etc. We also sent out a survey via Edmodo to understand current planner usage and establish a baseline. We discovered that 52% of students use primarily paper planners and 28% use a combination of paper & digital. We also learned that much like we suspected students found it difficult to create assignments on the Edmodo planner and thought it was hard to use, especially since teachers didn't always add assignments on Edmodo. From these, we were better able to gauge a target demographic and student priorities. We decided to focus on students in Middle school to early high school: at this point, they are starting to balance multiple classes with their own homework, but haven't established study habits

After this, I began an audit of other planner tools on the market. I compared the amount of time it took to create a reminder, features, and customization options. I presented these findings to the team along with the result of the interviews and surveys. I then led a brainstorming/ideation session with the crossfunctional team. Through this process, we narrowed down our focus to a few key features or improvements that we wanted to make a priority: adding a universal composer that allowed students to add their own assignments, additional customization tool track classwork for classes/extracurriculars not on Edmodo, and improving notifications and visibility of high priority assignments.

User Testing

I began wireframing possible solutions but knew that if we didn't user test then we wouldn't have a full understanding of what students really needed as we still had looming questions on how students preferred to see their work organized. So I took my wireframes and began creating lightweight prototypes to put in the hands of students. We gave them paper copies to mark up if they wanted and also let them get their hands on a clickable prototype so they could explore. Through this, I was better able to get an understanding of how they mentally organized their work and what felt natural or easy to them.

I learned that they preferred some sort of simpler designation between work that was due immediately and long term assignments but they definitely wanted them grouped together. We also tested a version of creation that was hopefully easy to find but had additional customization options to understand what their priorities were in terms of custom classes, reminders and adding photos to their assignments.

Paper prototype options

With those findings we decided to proceed ahead with some sort of header that highlighted work due in the near term while adding additional groupings to the list to help student scan and find the work they needed to.

iteration.png

Then it was time to iterate!

I spent a lot of time experimenting with efficient grouping and finding a style for this page that was easy to scan but still felt fun.

Final mobile product

The final design that I reached tried to solve some of the problems that we identified early on in our research. The designs made it easier to scan for due dates and we began grouping homework in a more understandable way. In addition, the iconography attached to each of the cards provided an easy way to scan for class and type of work (assignment, quiz, event or to do) it was pertaining to. Sticky headers maintained date context even if a student scrolled far into the future. Finally, at the top, a drop-down switches the view from upcoming to completed work. For mobile, I prioritized the ability to quickly understand what needs immediate attention and being able to very quickly add your own to-dos or assignments.

After mobile was completed it was time to move to the web version.

Supporting documentation & Flows

Designing the Planner for Web

The old web design

After the mobile flow was designed and passed off to engineering, I began working on the web equivalent. For the web, our goals were slightly different. We knew that students when on their computers, were often there to complete longer assignments or possibly even work ahead. By utilizing the additional real estate, I wanted to highlight additional information attached to the tasks and additional groupings by class. We decided not to pursue a calendar view with the initial launch of the planner instead to keep that for v2 due to the time and engineering constraints. I did want to create a date-based widget that could help bring the planner to both the student home page and any class that they were in. This would create a supportive environment that reinforced work habits and allowed them to quickly see at a glance what was due in the near term.

The Design

Modal view of a task

Completed task view

Task creation flow

Planner Tabs throughout the site

On the student homepage

In a class

Supporting documentation & flows

Conclusion

After everything was implemented and we finally got to launch, we began to see an immediate improvement in the number of students using the planner on a weekly basis. In the two months post-launch, we saw students creating their own tasks go up exponentially. Student-created tasks that weren't tied to a class when up 63% and student-created tasks tied to an Edmodo class went up 32%. We also saw the weekly created tasks numbers jump from around 600 per week in October 2018 (US schools only) to 3200 In January 2019. Seeing the hard work that went into designing and implementing this feature actively pay off was one of the most exciting parts about working on this project.