ClassTable
My Role:
Product Designer
Strategies:
UX/UI design, User Research, Prototyping, Product Ideation
Timeline
January-Present
Tools Used
Figma
How do you get the elementary school experience online?
Design Problem
Due to Covid-19, all learning went online. This created challenges for teachers and students to have the full benefits of a classroom experience.
My goal was to tackle this problem in three steps:
1. User Research - How do teachers operate normally in a classroom? What tools are they currently using?
2. Product/feature ideation - How can I improve their experience so young kids are able to learn and interact with each other?
3. UI design - How do I make a platform that is simple enough for young kids to navigate on their own while also allowing teachers to have full capabilities?
What is ClassTable?
It is a virtual classroom that allows for an elementary school teacher to create interactive activities for students to do inside and outside of class. Children can collaborate in small groups through breakout rooms or the class can do activities with everyone together.
Try the Prototype
My Process
User Research
700+ survey responses
I used a survey to understand the larger picture of what different teachers are going through and the what they like and dislike about the tech the are currently using.
6 Interviews
I interviewed elementary school teachers to go more in-depth into their pain points and used this time to have them elaborate on some of the trends I saw from my survey results.
Day In the life videos
I watched so many videos of elementary school teacher's YouTube videos explaining their teaching setup, their curriculum, how they have moved online and them explaining how and why they use certain online tools.
Persona
From this user research, I created a persona of an elementary school teacher. This is who I am designing for.
Project Ideation
User Flow
I started ideating and created a user flow of what would become Classtable. I wanted to emphasize the separation of creating an activity and the classroom while also bringing it into the classroom.
Features
Activity creation
This page is where the Teacher can create and save activities. It functions like a library drive where they can organize activities and then use this library in the virtual classroom.
Virtual classroom
This is what a class view would look like once you click join the classroom. I thought it is important to have the teacher larger than the children so that they are the focus of the children's attention.
I thought it was important to keep the same language and the organization of the toolbar at the bottom seen in other video applications like zoom and teams to maintain ease of use.
Teacher's overview of the whiteboards
Many teacher's mentioned how they can't see what their students are doing in real time like when they can just walk around a classroom and quickly see who needs help. This view is to try and adjust that problem.
Once students are put into breakout rooms to work on an activity, the teacher can see all of the whiteboards as the students work, instead of the video feed of the students faces.
Working on an Activity
This is the view from a child's perspective of what they see in a breakout room set up for an activity.
The tools are designed so that the shapes don't need to be scaled when you click on a shape and then click on the page it would be placed based on the size chosen from small, medium, large. This limits what the kids can do but it makes the interaction easier for young children.
Conclusion and next steps
I want to keep expanding this especially once I start to do user testing with elementary school teachers to see what they think of this project. I want to look at if it would be usable in their curriculum as well as their thoughts on the usability for children. If I had more time or the opportunity to add more features, I would figure out how to add gamification to the platform in the form of gold stars or a way for students to create avatars with those gold stars so they get some reward for participating and being active. There is a lot more to be explored in young elementary school online learning tools and I am excited to keep looking into the problems in that area.