Duration
Team
My Role
Tool
What we archived in 2026 Q1
15+
new school district contracts by enabling more flexible, classroom-ready delivery.
94%
Learners were satisfied with their Hats & Ladders experience (Youth Survey 2025)
10+
new industry partnerships with insturctional leaders including IBM SkillsBuild, the NFL, and AT&T.
14%
increase in 30-day retention by launching a gamified career exploration experience
The importance of career education
As students get ready to leave school and step into their futures, many still lack clarity about who they are, what they want, and how to take the next step. Hats and Ladders turns career exploration into a gamified experience that helps students discover pathways aligned with their strengths, interests, and future goals. This product launch focuses on expanding collaboration with middle school districts and refresh the overall product look.
Challenges
Students couldn't name what they wanted next — and our content pipeline was too rigid to help them find out.
Rigid Assignment Framework
The existing assignment framework and content-to-design flow slow down our ability to build scalable, brand-aligned gamified experiences.
Hard to modularize district-mandated curriculum
Districts need structured, standards-aligned content — but Coaches need the flexibility to adapt delivery in real time.
What are our solutions?
The experience centers on discovering different Career (“Hats"), or in-demand careers across 16 clusters, presented through engaging, easy-to-digest content. Our gamified learning moments supports holistic skill development across areas like discover "Your Top Hat", "Hat Packs Streaks" and "Scenarior Game". It also integrates instructor-led lessons, enabling educators to guide structured classroom experiences or workshops.
Feature 1
Students didn't lack skills. They lacked the reflection.
Build up the modular experiences for middle schools and empower them to have personalized career recommendations based on each student’s learning history.
Feature 2
Small moments, made permanent.
Build up the modular experiences for middle schools and empower them to have personalized career recommendations based on each student’s learning history.
Feature 3
Put one Hat on. See who you sound like.
“Hat Finder” helps students explore new possibilities by recommending different career Hats to try. Inside each Hat card, they can dive deeper through interactive Hat cards.
Advocating for research
Due to the timeline constraints, I partnered closely with the sales team to synthesize their deeper industry insights from direct conversations with school and district purchasers.
"What meets the needs of school district purchasers?"
Districts want middle schoolers to explore a wide range of career possibilities, understand key information like salary and required knowledge, and connect those careers to external activities offered by the school. To support that, the career related information needs to be easy to find, not buried — and accessible as quickly and intuitively as possible.
"What are our key market differentiators?"
I also dug into previous user research files based on our defined user personas and facilitated a workshop to drive decisions on design priorities that could differentiate us from competitors.
Customized Career Parkour for Kids
Self-discovery, exploration, and planning are woven into one connected journey
Interactive & Real-World Game
Game-like challenges and simulations build teamwork, and problem-solving skills.
Step-by-step AI-powered guidance
Personalized learning can adapt to each learner’s stage, supporting confidence from middle school.
Built for Student's Personalized Journey
Personalized learning can adapt to each learner’s stage, supporting confidence from middle school.
How to motivate young learners?
One climb at a time — the game unlocks the next career, and AI explains why it fits students explore 16 career clusters ("Hats").
They don't get all 16 at once. Content reveals progressively based on what they actually engage with, and AI turns their learning history into pathway recommendations they can read without a chart.
Showing all 16 clusters at once looked generous and behaved like a wall. A student who can see everything picks the one they already knew about — the vet, the athlete, the YouTuber — and never leaves it. So we gave them three.
AI Transforms the new work flow
I utilized AI-assisted workflows to normalize legacy UI patterns and optimized the current user flow.
Refactored scattered documentation into reusable templates with clear guidelines, with the goal of creating scalable Figma make templates for future usage, activity, progress, and completion tracking while reducing engineering lift.
Instead of following a traditional design iteration process, I began building coded prototypes with Claude Code and colloborate with engineers to polish implementation details with engineering. During this phase, I partnered closely with the entire team to improve AI quality through experiments, prompt engineering, and rapid code tweaks.
Key UX Challenges
Working in the agile mode and we planned from Sprint 28 - 40 by setting up the CMS for cross -product feature and launched the main Cluster Exploration Feature in app. During the process, we were able to validate some design questions with along the iterative design.
Design Challenge 01 - Actionable Dashboard Activities
From school purchasesr's feedback, lack of structured guidance and actinable next step, making it difficult for coaches to ensure learners are making connections across different types of Climbs (Assignments) or progressing with intention—especially for self-directed users. Coaches need a goal-directed dashboard to instruct students effectively.
Design Challenge 02 - Minimize unnecessary scrolling on the Hat page
Reduce unnecessary scrolling on the Hat page to make assigning modular content faster and more intuitive for coaches.
🤯
Information layering on the image is hard to read.
🤯
Bottom Nav limits the scalibility for adding more activities
🤯
Each Hat activity need larger screen real estate
Design Challenge 03 - AI-powered Career Fit Results
Profile page should be more living and breathing to act as the treasure box for students. We need to increase ways of working “dream interests” into what people actually do in high school, in classes or extracurriculars
Design Challenge 04 - Profile Page Layout Optimization
Profile page should be more living and breathing to act as the treasure box for students. We need to increase ways of working “dream interests” into what people actually do in high school, in classes or extracurriculars
Take Aways
We Validated and improved:
1. Work-aligned assignments create a bridge between exploration and real-world readiness, enabling systematic skill-building through simulated work experiences paired with structured reporting.
2. The early kernel of lesson histroy tracking (piloted with Northeast) shows strong potential to scale into a more robust system that captures, validates, and showcases learner progress over time.
3. Aligning activities with Hat interests increases relevance and motivation, while also providing clearer next steps—especially for learners without access to formal Pathways in their local context.
4. Expanding Hat Details with tangible signals—such as technologies used (via O*NET skills) and more accurate salary data—can support more informed, ROI-driven decision-making.
