Student Selector Google Classroom
How might we leverage technology to help make the classroom a more inclusive space through class participation?
An mobile Student Selector app on Google Classroom that helps teachers randomly call on students. This ensures all students have a fair chance of speaking and sharing answers. Furthermore, it helps teachers track who has and hasn't participated.
4 Months, Launched October 2018
Google for Education
Sketch, Illustrator, InVision, Material Design
Research, Visual Design,
UI/UX Design, User Testing
Design Approach (End-to-End)
The Student Selector app was the first mobile classroom app tool launched from Google Classroom. I owned and led the end-to-end design process for the student selector app. My design process included:
Project Team and My Role
My team was part of Google Classroom. Since launching in August 2014 Google Classroom has helped teachers easily distribute resources, collect work, and communicate with students and guardians.
I worked closely with PM, Engineering, and UX Research, as well as Educators to better understand the business, technical and user constraints.
I proposed weekly meetings with everyone to be on the same page and participated in design critiques along the way.
Understanding the Problem
Before designing, I wanted to understand the problem space better. I set up an kick-off meeting with the PM, Engineers, and UX Research to:
make sure that we all were agreement about the problem and target user(s).
learn everyone’s preferred working style and meeting availability so that we can best collaborate as a team.
define the timeline of the project and existing research
The target users of the Student Selector app are teachers who spend time randomly selecting students to answer questions during class.
Goal (How Might We)
How might we use technology already in the classroom to enable teachers to encourage class participation?
I wanted to understand the current pain points and workflow of the teachers, so I read literature reviews by looking at blogs, podcasts, videos, play store comments, and analogous products.
Teachers want to make sure they call on everyone equally, but they repeatedly call on the same students because they are busy and forget which ones they’ve called on.
Currently, many teachers use popsicle sticks with student names to randomly call on students to encourage class participation.
Key Research Insights & Design Decisions
Below were some of the key findings I found during my evaluative research and thus what design decisions or principles that I should keep in mind before developing concepts.
Based on my key findings and design decisions, I also compiled all the use cases for calling on students. I met with my PM to scope and reviewed priorities for use cases to make sure I stayed inside business constraints.
Primary Use Cases (P1)
I generate a random name and student is present
I generate a random name and student is absent
I want to reset the bucket of popsicle sticks
Secondary Use Cases (P2)
I generate a random name and want to pick another student
I want to see the students already called on
From the prioritized use cases, I created a user flow for the critical user journey of the MVP Student Selector app.
From these use cases, I looked at different products and Material Design patterns to gather inspiration.
Low Fidelity Sketches
The mobile app needed to be integrated seamlessly in the currently Google Classroom experience, so I explored different entry points. I also sketched low fidelity wireframes from the critical user journey defined earlier.
Concept User Testing
After running past my sketches with the team, I wanted to test the usability, usefulness, and desirability of the app.
I spoke with my the UX Researcher on my team to put together a screener and reached out to 15 participants and schedule user testing sessions with 2 elementary school teachers, 2 middle school teachers, and 2 high school teachers.
I wrote a research protocol and checked with the UX researcher on my team to make sure that I'm following the correct steps.
After the user testing session. I thoroughly synthesize the research raw notes. I wrote a research report so the team could easily see where and how I made my design decisions.
The main findings were:
The ‘Student Selector’ is useful, usable and desirable.
The feature should be found on the mobile ‘People’ tab of Google Classroom
Sessions should persist even when the user navigates out of the app. For example, if a class session ended on Monday and not all students were called on, the app should show the rest of the students during the subsequent class session (i.e. not reset).
Design Decisions & Material Design
Material Design System
Based on the feedback, I iterated my design and moved into higher fidelity. I used Sketch and the internal Material Design spec, even add new interactions to the Material Design system (such as the swiping of the cards).
Below is the final user flow that I tested with the teachers:
An In-Depth Look
Below is more in depth look at the main screens of the app, including the key findings from my user testing that helped shaped the design of the screen.
I wanted to make sure the Student Selector app experience was inclusive and accessible to everyone, especially those using a screen reader. I worked with the engineering team to make sure the user flow for a screen reader was intuitive.
I considered the experiences for landscape, tablet, Material 2, and iOS. For example, in landscape view I made the ‘Next’ button closer to where the thumb touchpoint is.
To take this app further I would consider different learning styles that students have and allow teachers to make notes on on these styles to better cater to their students.
App Launch (October 2018)
The app launched on October 2018 and has received positive review from teachers. Some even have created walk throughs of the app.
I helped prepare for the launch checking in with the engineering teams and submitting bugs.