Overview
Empowr is an Atlanta-based nonprofit focused on uplifting the Black community by creating a strong school-to-career pipeline. Working with them through Develop for Good allowed me to contribute to their mission of empowering minority, low-income youth who face systemic barriers in education. By helping students develop critical math and science skills, Empowr opens doors to better schooling and career opportunities.
For this project, I designed Trailblazer, a mobile app that creates AI-powered personalized learning plans for students. The goal was to improve math and science proficiency and boost test scores. With two other designers, I developed the entire design system for the app, built a seamless onboarding experience, and created an engaging, gamified learning environment. This included leaderboards, interactive activities, and an AI-chat assistant to make learning more dynamic and enjoyable for students.
Research
We began by conducting comprehensive research, including user personas and competitor analysis, to guide our design decisions. By identifying the needs and pain points of our target users and evaluating existing educational platforms, we gained the insights needed to create a robust foundation for the app.
Key Design Decisions
Based on our findings from user personas, we focused on making learning enjoyable and motivating for students. This led to several key features in Trailblazer:
Leaderboards & Streaks: To encourage healthy competition and sustained engagement, we introduced leaderboards and streaks, taking inspiration from Duolingo. We found that these elements motivated students to keep progressing through their lessons.
Friending Classmates: Our research also revealed that students were more likely to engage with learning when it had a social component. By allowing users to friend classmates, we added a layer of community, which boosted motivation and made the app more interactive.
AI-Chat Interface: The AI-chat assistant emerged from our exploration of how students might need quick help without interrupting their learning flow. This feature allowed students to ask questions or get hints in real-time, making the learning experience more fluid.
Gamification: We leaned heavily into the gamified experience, designing activities that felt fun but remained educational. This kept students invested in their progress and made learning less of a chore.
Design Challenges
One of the major challenges we faced was organizing the hierarchy of information. The app needed to cover all high school math and science subjects, with the ability to eventually expand into middle school, elementary, and other subject areas. Each subject, such as math or science, contained units, and each unit had multiple activities.
We drew inspiration from Khan Academy’s structure for information separation, particularly their method of organizing vast amounts of content across multiple grade levels and subjects. This helped us build a scalable structure that could grow with the app as new subjects were added.
To tie everything together, we incorporated the idea of an adventure, which aligned with Empowr’s request to connect the app’s content to historically significant figures and areas important to the African American community. We developed a map feature that students would progressively uncover as they completed activities, offering a sense of discovery and purpose that made the learning experience more immersive and meaningful.
Design Process
We started with lo-fi designs, sketching out rough wireframes to map out the basic structure and flow of the app. Each week, we worked independently on our assigned sections and then came together as a team to review our progress with the client. These sessions allowed us to gather feedback, refine our ideas, and determine the next steps.
As we moved forward, I took the lead in creating the design system, which ensured that the app’s visuals and components remained consistent across all screens. This system helped unify the work as different team members focused on their respective areas.
With the design system in place, we transitioned to building high-fidelity designs, bringing the app to life with polished visuals and a cohesive user experience. Once the high-fi designs were finalized, we moved on to prototyping, creating clickable versions of the app that we could test and iterate on.
Each phase of the design process involved constant collaboration and refinement. By working independently but regrouping frequently with the client and team, we ensured that the final product met both the functional and aesthetic goals of the project.
Results
Trailblazer is set to be deployed in high schools across Atlanta this school year, providing students with an innovative tool to enhance their math and science skills. By integrating the app into classrooms, we aim to complement traditional teaching methods and offer students a new, interactive way to improve their academic outcomes.
Thank you for reading my case study!
Make sure to check out my other projects too!
Delta Air Lines
I interned at Delta to optimize their digital platforms, making travel more accessible for all passengers.
Read More
