PrepAnywhere UX Design for an AI-Driven Math Tutoring Platform
UI/UX Design and Marketing
Embedded Files
Context & Challenge
Context & Challenge
The pandemic disrupted traditional learning, exposing gaps in remote education. Students lacked personalized support, teachers struggled to reach diverse learners, and many were unable to get help outside of class. MGL Learning already had a strong AI model (trained by tutors and University graduates) but needed a web-product experience that could deliver accessible, adaptive, and meaningful math learning on a broad scale.
The core challenge to create a web LMS that not only houses content but actively helps students overcome learning gaps, gives usable feedback, aligns with different curricula (US, Canada, South Korea), and engages with users via technology to simulate tutor-like assistance.
Goals
Goals
Improve usability of the web experience so students, parents, and teachers can access learning resources more intuitively.
Integrate features for self-paced learning including uploading photos of questions (US/Canadian/Korea curricula) and getting solutions & video lessons.
Build a “learning path” supported by AI: mapping student’s struggles to video and similar problem practice.
Maintain strong engagement through UX, feedback, and clarity so remote learning is more effective.
My Approach & Design Process
My Approach & Design Process
User Research & Assessment
User Research & Assessment
Conducted interviews with students to understand pain points: where they get stuck, what resources they turn to, and how remote learning challenges them.
Mapped customer journeys (students, parents, teachers) to identify touchpoints: ⇒ question-upload, exploring learning paths, viewing lectures, reviewing solutions.
Information Architecture & Wireframes
Information Architecture & Wireframes
Redesigned site structure to support new features: clean paths to upload questions, find solutions, browse learning videos, and access the AI-driven learning path.
Created wireframes & flow diagrams to align on how users would move through the product.
Feature Design & AI Integration
Feature Design & AI Integration
Designed the “photo upload” feature: for students to snap question images (US/Canadian/Korea curricula), the system detects the topic, suggests a solution, or points to a video lecture.
Built AI Character “Goo” to tag questions, find matching video IDs, fetch analogous problems for practice, and recommend lecture content.
AI/ML Process Behind Tagging Video IDs and auto grading
Visual & Interaction Design
Visual & Interaction Design
Created UI designs that are approachable (especially for students of middle/high school), with clear labeling, consistent typography, spacing, and minimal friction.
Designed an AI character / animation that helps make the experience friendlier and more engaging (“Goo” interacting with prompts) so the system feels less mechanical.
Iterative Testing & Refinement
Iterative Testing & Refinement
Tested designs with users (students) to check usability of flows (e.g. uploading questions, navigating from lecture to similar problem).
Used feedback loops to refine UI, content labels, navigation, and error states (e.g. when AI can’t find a match).
Key Decisions & Trade-Offs
Key Decisions & Trade-Offs
Photo-upload + AI matching vs more basic search: choosing to invest in smarter input (images) because many students have textbooks or printed questions.
Learning path driven by performance rather than static curriculum: helped tailor student journeys rather than forcing them through general grade-level content.
Friendly AI character to reduce cognitive burden and build a sense of trust/engagement vs a purely utilitarian UI.
Prioritizing remote support & video content to offset lack of in-person help during the pandemic.
Outcomes & Impact
Outcomes & Impact
A more usable, clearer website with features that allowed students to directly upload questions and access tailored learning resources.
Improved engagement, as users reported being able to find relevant materials more quickly thanks to AI-tagged content.
Enhanced path for remote learners: especially during COVID, the ability to self-pace, get lectures and similar practice seems to have reduced friction in continued learning.
Positive impact on adoption & retention due to usability improvements and clearer pathways.
Discord Server for Students: Promoting Engaging Communication, Music Streaming, and Collaborative Learning Environment
National Council of Teachers of Mathematics (NCTE-NCTM) Conference - Los Angeles
Reflection & Lessons Learned
Reflection & Lessons Learned
Designing for adaptability is crucial: conditions like remote learning forced us to think about variable access, different needs, and need for strong feedback loops.
AI is only as good as its UX: building powerful backend models isn’t enough. The interface through which students upload, search, see lecture/video, and practice must be seamless, forgiving, and helpful.
User testing early & often matters: small usability adjustments had outsized effects (e.g. how prompt text for uploading images is worded, how learning paths are visualized).
Balancing personality with professionalism: adding friendly elements like “Goo” helped humanize the platform, making students more comfortable, while ensuring clarity and credibility remained.
Page updated
Google Sites
Report abuse