ONYOURMARK X DEVELOP FOR GOOD
Helping tutors track student engagement.
TIMELINE
October 2024- February 2025
(16 Weeks)
ROLE
Product Designer
TEAM
1 Product Manager, 1 Design Manager, 6 Designers
Preview
Check out the demo video to preview the case study!
Introduction
🏃🏻♀️➡️ OnYourMark, get set, go!
As part of Develop for Good’s Winter 2025 Project Batch, I volunteered as a Product Designer to support one of their many non-profit partners. OnYourMark, a nonprofit project of Cambiar Education, provides virtual instruction in foundational early literacy skills that are essential for kids to reach successful reading outcomes. They partner closely with schools to deliver structured literacy instruction to students during the school day for 20 minutes four days a week. Tutors engage their students and build strong relationships with them, making sure to meet students’ individual needs.
My Role
The team consisted of 6 designers, 1 product manager, and 1 design manager. As one of the designers, I was responsible for designing wireframes for one of the features of our product. I also played a role in conducting user research, interviews, design library management, and quality assurance.
Timeline
[DISCOVER]
🖼️Background
Only 30% of students in the U.S. read at grade level.
This alarming statistic underscores the urgent need for effective literacy interventions. COVID-19 only worsened literacy results and accelerated a burgeoning teacher staffing crisis.
it has become increasingly challenging to ensure that students have a highly qualified teacher in front of them who has been adequately trained in the Science of Reading. OnYourMark tutors teach children in K-5th grades how to read, using the Science of Reading and ensuring students’ learning and social emotional needs are met.
With 36,000 vacant teaching positions…
[DEFINE]
🔎Problem
Tutors are dedicated to improving student literacy outcomes by providing personalized support for at-risk students, but it is hard because:
1. It is overwhelming to track real-time student progress without an organized system.
2. Tutors are unable to effectively pinpoint individual students at-risk of failing behind from large student groups.
3. Too much data prevents delivery of actionable insights for students.
🧠How might we…
Help tutors effectively manage student performance and improve their literacy skills?
[IDEATE & DESIGN]
Our project objective was to create an integrated literacy success dashboard. But, what exactly would be in it? Our team brainstormed a variety of ideas before collaborating to decide on what functional features we would be prioritizing.
🤔What will this look like?
Our team’s brainstorm for features on FigJam.
After getting in touch with our client to validate the features we decided to go with, we got more insights on how OYM administrators would be working to manage the tutor’s assignments and scheduling behind the scenes. As a result, our team decided to create an Admin View of the dashboard as well that would have its own features for their administrative needs.
The feature that I worked on and will be discussing in this case study is Student Engagement Tracking and Generating Reports.
When I first started designing for these two features, there were a bunch of questions that I had in mind.
“To generate these reports, where is the data coming from?”
“Where is individual student data being displayed? Stored? Inputted?”
“How will this interact with the other features?”
As a result, I created a flow diagram to map out the access point for these features and what type of data needs to be generated to support its functionalities.
[RESEARCH & ITERATE]
Next, we wanted to learn more about tutors and get direct feedback from them on our initial designs. Since they were one week out from winter break, our team sent out separate user surveys to both administrators and tutors to quickly get feedback before the tutors would be out of office for 3 weeks.
📝User Surveys - validating designs.
Sample of User Survey questions for the Engagement Tracker & Generate Report features.
Key Insights
🤓 Engagement Tracker
4/5 respondents found the engagement trend line graph difficult to understand and interpret.
The star rating system does not provide a way to provide qualitative observations. It also does not provide an accurate quantitative representation of how engaged the student was during a tutoring session.
Current system for tracking engagement is manual and inconsistent across tutors.
We received a total of 8 responses to our surveys. 5 responses for the tutor survey and 3 responses for the admin survey. Since there were a lot of features to cover, I prioritized getting feedback on the engagement tracker and report features.
📝 Generate Report
Current system for generating reports involves a lot of repetitive actions, manual tracking in Excel and limited data to choose from.
6/8 respondents think that customizable reports would be helpful for tracking student progress.
Admins generate reports more frequently than tutors.
🗣️Interviews - A chat with data.
As we moved along the design process, we received the opportunity to conduct a design review with OnYourMark’s Director of Data & Research, Jared Wasilefsky. Since his focus of work was on the data end of things, we directed our questions and review to designs that dealt with data management and visualization.
Key Insights
💻How does data interact with each other across the platform?
Think about where the data your visualizing is coming from.
The types of graphs that we use to visualize data is important to consider.
OnYourMark measures progress in three categories: Beginning, Middle, and End of the year. Including existing measures of progress is vital for successful user integration into the platform.
✒️How did this influence my designs?
We’ve got all these key insights. My next step was translating the research into actionable objectives to inform improvements in my designs.
User Flow + Data Input
Understanding how tutors manage student performance -> Revising layouts + Data displays to prioritize key information.
Listening to tutor feedback on engagement tracking -> Revising data input system to be more objective and consistent.
Understanding tutor preferences -> Implementing features for qualitative data (comments and notes).
Understanding how OnYourMark measures progress -> Revising graphs + Content to align with existing practices.
[DELIVER]
👩🏻🏫Managing Student Engagement
Student Profile Overview
💡 What you can do here
Check on a student’s progress, start an assessment, generate reports, analyze engagement during lessons, or take notes on recent trends.
✒️ Design Choices
Bento Boxes -> Clear structure + Prioritize important information
Tabs -> Find information fast and easy.
Profile Name Drop-Down -> Quickly navigate between student profiles.
Student Profile Overview
Engagement Tracker
💡 What you can do here
Input engagement data after lessons, track data trends over time, manage and reference past form submissions.
✒️ Design Choices
Percentage Input Field vs Rating System-> Objective measure of time + Aligns with tutors’ lesson structures.
Graph Display -> Average engagement score is easy to understand and interpret.
Engagement Log -> Table-view allows for quick comparison + Ability to edit past submissions to reduce margin for error.
Student Profile - Engagement Page
A closer look at the form 👇🏻
✒️ Design Choices
Positive Feedback Loop -> Confirms that form has been submitted.
Summary -> Helps tutor understand how score was calculated and review their submission.
Edit Response -> In case of error, user can easily revise mistakes.
->
Engagement Tracker - Before Submission
Engagement Tracker - After Submission
Generate Reports (Let’s put this data to use)
💡 What you can do here
Generate reports and customize student groups, date ranges, and data types to share progress with schools and parents.
✒️ Design Choices
Group Filters -> Pulls data for any custom group of students that the tutor has access to.
Drop-down + Multi-Select -> Pull data from multiple grade levels or benchmark statuses if needed.
Data Selection -> All relevant data points are selected on default. Option to focus on specific data if necessary.
Date Range -> For tutors to compare progress over various periods of time.
Generate Report Window Pop-Up
📺See it in action!
Student Engagement Tracker & Generate Report.
Check out the Student Engagement Tracker and Generate Report feature in action!
📐Design Systems
I collaborated with my team to establish a design system to ensure consistency across our product. Each designer was responsible for a feature of the product, making it especially important for us to connect our designs together into a unified user experience.
I created components for buttons, tabs, drop-down menus, and text-field inputs.
Using our branding and style guides, I used our primary blue color to indicate CTAs and active selections.
Button, Tab, Drop-Down components.
Text-field Input components.
🧪Putting it to the test.
UserTesting with OnYourMark Tutors & Admins.
Once our tutors were back in office, we sent it out to both tutors and admins through UserTesting to see how they interacted with it.
Key Insights
👥We received a total of 5 responses from 4 tutors and 1 admin.
5/5 respondents found it easy to locate and generate reports.
It took an average of 1 minute and 40 seconds for users to generate a report for an individual student.
Their current process takes an average of 15-20 minutes. In comparison, the new system is about 9 times faster than their current one.
[REFLECTION]
🍎A fruitful 16 weeks!
Impact
Once fully deployed in the 2025 school year, the Integrated Literacy Success Dashboard will support 8,000 struggling readers and 3,000 literacy tutors.
The Integrated Literacy Success Dashboard…
Serves as a comprehensive platform to support tutors in improving literacy outcomes.
Provides insights into student reading scores and identifies at-risk students.
Leverages a flexible tutor workforce for targeted reading interventions.
Challenges
We faced challenges early on with gathering scheduling user interviews to get feedback since tutors were unavailable due to the winter break. However, we were able to overcome this by creating surveys and remote feedback options instead. I also relied on asking our client for feedback during our internal meetings since she knows our users well.
A challenge I faced personally was working out the complexity of our platform and finding a place to put my features. I asked myself, is this going to be a bento box on the dashboard? But if it was, it’d be a lot of information crammed in one tiny space. It was also difficult to balance what information tutors should be able to view about students and what admins should be able to view. However, mapping this out in a flow diagram and chatting with OnYourMark’s Director of Data & Research helped me put the pieces together.
Takeaways
This was such an incredible project and team to be part of! I was inspired by meeting so many creative designers and fellow product enthusiasts. One of the key takeaways that I got from this experience was the importance of communication! Our team spans across various time zones in the US and we work on our individual features remotely outside of set team meetings. Since we only have one opportunity to touch base together as a team once a week, it was crucial for us to be checking Slack, being prepared for meetings, and leaving comments on each other’s work. Upholding this stream of communication made it easier for our team to collaborate and align on project deliverables for the week.
A big thank you to my team, OnYourMark, and Develop for Good!
OnYourMark Team Photo
View the full case study and demo!
This case study covered the sections that I designed and contributed to! If you want to see the full dashboard and case study, you can check it out below.