Internship @ Osmo | Jan 2021 - May 2022
Byju's Future School
Reimagining the future of education: a mixed reality remote learning platform for children aged 5 - 14.
Byju’s Future School is a remote learning platform with not only live face-to-face classes, but also mixed reality and computer vision-based in and post-class experiences.
As one of the first designers on the project, I worked alongside a team of designers, engineers, and PMs, collaborating and leading end-to-end iterative design cycles of key experiences in the app.
Designed for 5 key experiences.
Student-side class experience
Teacher-side class experience
Magic worksheets for D4 and Web
User Profile
Leaderboard and gamification
My Role.
Interaction design
Visual design
Prototype
Design system
Platforms.
Desktop web
Mobile app
D4 app (a tablet w/ desk camera)
Design Principles.
Simplicity and Intuition
For brand new experiences that users have not experienced before, coupled with designing for children and younger users, simplicity and intuitiveness became more important than ever. This meant a focus on more straightforward CTAs, efficient content design, and an end-to-end flow built on affordance.
Guidance
Some of our newer experiences can't just be designed to have a simple UX. We needed to focus on guidance and education for our users on the more cutting-edge experiences. This was built into our design system through hover states and tooltips, onboarding flows, overall messaging, and more.
Over 15 months, I led design workstreams on 5 key experiences...
Student-side class experience
Live Annotation guidance and application
One of the app’s signature features is the live annotation experience, exclusive to the D4 device . It uses the D4’s desk camera to capture the student’s paper with computer vision tracking, allowing the teacher annotate on the students’ papers via their device.
Our key challenge was creating a guided, intuitive and easy-to-follow flow, especially for users as young as 5 years old.
Class completion flow: rewards and feedback
What does it look like for students to finish their class? Our focus here was to 1) instill a sense of accomplishment and fun, and 2) get feedback and ratings from the student about their experience.
Teacher-side class experience
Live Annotation activation
The flip side as the above flow, we needed to design a way for teachers to activate the live annotation view for their students.
Magic and web worksheets
Worksheets are a quintessential aspect of BFS’ post class experience, allowing students to practice their new skills with both instant and written feedback. Within worksheets, theres two key flows: the desktop web flow, and the D4 computer vision-aided walkthrough.
A guided solving experience, with animations and notices for flow education.
Worksheet completion experience based in Computer Vision, with instant feedback.
Post completion grade report with written teacher feedback.
A web-based interactive worksheet.
I also designed for a desktop worksheet solving flow. Designing this experience involved not just the primary function of solving the worksheet, but also thinking through the post-submission states while the student is awaiting teacher feedback, and the flow to resubmit and view past submissions.
Community profiles
Community profiles were integral to the social aspect of BFS, allowing students to see their badges, course progress, projects and more. I worked with other designers to craft the project display experience, incorporating different states for projects such as unpublished, pending confirmation, published, and more.
Weekly leaderboard
The weekly leaderboard allows students to compare their process and points with other students within the same course. The leaderboard would be reset every week, allowing students to earn badges and coins based on their standings.
Key takeaways.
Building and using design systems
Components, colors, typography, grids.
BFS not only taught me how to work with deeply complex, rule-based design systems, but also how good design systems are organized.
I was able to easily pick up on the states needed for different buttons, and even contributed some components and states.
Working remotely across time zones
Crits, syncs, work sessions with large teams based in timezones up to 11 hours apart.
With my team spread across the IST, PST, and EST timezones, I learned how to both meet and work remotely and also how to provide consistent and strong channel for communication async.
User experience for cutting-edge technologies
Computer vision-aided worksheets and in-class flows.
As BFS heavily relied on computer vision for the worksheet completion flow and in-class live annotation, I came to realize designing unfamiliar and cutting-edge experiences required prioritization of two elements: simplicity and guidance.
I needed to design a flow that was intuitive to follow and understand, and also provide adequate guidance and education for how to navigate the experience, especially considering BFS' young user demographic.
Reflections.
Being able to see a product come so far was such a gratifying and amazing learning experience for me, and I am beyond thankful that I got the opportunity to work on this project with such an amazing team. From learning how to design with intentionality, to working with other designers, project managers, and engineers, this 15 month journey showed me how product design was in the real world, outside of 3 month internships, school and side projects.
My biggest thank you goes out to my manager and mentor, Tony Aube, not only for the amazing guidance and support, but also giving me the confidence the speak out and share my work!