🎓 Interactive Learning
Math Foundations is an inclusive, web-based educational platform designed for K–2 students that reimagines early math education through playful, interactive digital experiences. Built using React.js with TypeScript for a streamlined developer experience and Tailwind CSS for a consistent, responsive UI, the platform combines thoughtful design with robust functionality. A WCAG-compliant interface ensures accessibility for students with cognitive and physical needs, while Context API manages global state for user progress and settings. The backend, powered by an Express.js server with PostgreSQL, enables persistent tracking of each student’s achievements, creating a seamless and personalized learning journey. The embedded version can be found below, and the full version can be accessed by following this link.
UI/UX
·
Product Design
·
Graphic Design
To ensure all learners can fully engage, Math Foundations integrates a wide range of accessibility features. High-contrast mode, large text toggles, and reduced motion settings support students with visual and cognitive needs, while a clean, child-friendly interface simplifies navigation. The design adheres to WCAG accessibility standards, with thoughtful considerations for neurodivergent learners and children with physical disabilities.
The platform includes four core learning modules, each tailored to introduce fundamental math concepts in an interactive and exploratory way. In Counting Fun, students count objects with visual feedback. Shape Explorer turns geometric discovery into a digital scavenger hunt. Pattern Play allows for creative drag-and-drop arrangements to build and extend visual patterns, and Measure It introduces measurement using virtual unit blocks. Each module is hands-on, intuitive, and anchored in play-based pedagogy.
Representation was a key focus of this project. To promote inclusion and normalize disability, a friendly guide named Sam—a wheelchair user—leads students through the learning experience. Sam not only helps students stay engaged but also reflects a broader range of student identities, creating a more welcoming environment for all.
Interactive features such as drag-and-drop, SVG animations, and real-time feedback were essential to keeping students engaged and motivated. Each interaction was carefully designed to support both educational value and delight, helping students form a positive relationship with math early in their learning journey.
The platform is fully responsive, adapting seamlessly to tablets, laptops, and classroom smartboards. Intuitive navigation and tactile UI elements ensure that even non-readers can navigate the experience with confidence and independence.
This project demonstrates my ability to combine educational design, front-end development, and accessibility implementation into one cohesive, inclusive product. Math Foundations is more than a learning tool—it’s a digital space where every child, regardless of ability, can confidently explore the world of math.
