Role: UI/UX Designer
Team: UX Designer, User Researcher, Product Manager, Engineering, Stakeholders
Platform: Web
Overview
ST Math is a PreK–8 visual instructional program that teaches math through interactive puzzles and spatial-temporal reasoning. The Educator Console is the platform teachers, administrators, and math coaches use to:
- Set up classes
- Create assignments
- Monitor student progress
- Evaluate school-wide usage and outcomes
The Challenge
The previous Educator Console was:
- Built in Flash (desktop-only, soon to be deprecated)
- Visually outdated and inconsistent
- Designed mainly for teachers—not scalable to administrators, coaches, or lab coordinators
This resulted in limited usability, accessibility barriers, and a fragmented experience across user roles.
Our Goals
We set out to:
- Redesign the console in HTML5 with a fully responsive layout
- Modernize the UI and apply consistent, scalable design patterns
- Improve accessibility across devices and user types
- Tailor the experience to a broader audience, from teachers to district administrators
Research & Discovery
To ground our design decisions, we partnered with the User Researcher and Product Manager to:
- Audit the existing product—mapping out all screens and flows
- Interview educators across roles to identify common workflows and pain points
- Analyze competitors for industry standards and UI trends
- Develop user personas and functional priorities based on research findings
Concepts & Iterations
Early ideas started with lo-fi sketches and wireframes, evolving into clickable prototypes. As user studies progressed, we refined designs based on:
- Clarity of navigation
- Ease of use for first-time users
- Role-based customization and progressive disclosure
Some features were cut or reworked entirely based on feedback—ensuring the final product stayed aligned with actual user behavior.
Outcomes
The redesigned Educator Console delivered:
- A modern, unified UI experience
- Full responsiveness across devices
- Role-based optimization, surfacing the right features for the right user
- Streamlined workflows for core tasks like class setup and progress monitoring
- Progressive disclosure of advanced features—intuitive for basic users, powerful for experts
UI Library & Visual System
I led the creation of a new UI library based on our evolving needs:
- Identified components needed across use cases
- Applied branding and accessibility guidelines
- Created patterns for buttons, modals, tables, dashboards, and alerts
- Focused on clarity, predictability, and reusability
The UI system ensured visual and behavioral consistency as features scaled across different user roles.
Reflection
This project reinforced the importance of designing for flexibility across roles and supporting scalable, modular UI patterns. I gained deeper insight into cross-functional collaboration, particularly working with researchers, engineers, and stakeholders to align design goals with business needs and technical feasibility.