Bright Minds

Service

UI/UX Design & Prototyping

Date

January 2025 — March 2025

Team

Amar Pattabiraman, Regina Hairston, Samantha Bernstein, Harshith Royal

Tools

Figma (Wireframing & Prototyping), Adobe Creative Suite (Asset Creation), Zoom (Usability Testing)

Click to Enlarge

PROJECT DESCRIPTION

Bright Minds is an educational platforms built for tablet and desktop designed to bridge the gap between grade school teachers and students. In collaboration with my team, we designed a gamified reading experience for students and a data-tracking dashboard for educators, developing our project from initial ideation and research to a high-fidelity tested prototype.

WORK COMPLETED
  • Design Strategy: Co-developed primary user personas and mapped out user stories to design the flow for our dual-channel prototype.

  • Information Architecture: Determined the logic flow for progression from reading assignments, knowledge tests, reward feedback, book browsing/sharing.

  • UI Design: Designed a playful and eye-catching mood board and translated those themes into a style guide with high contrast and childlike imagery.

  • Prototyping & Iteration: Developed Mid-Fi and Hi-Fi interactive prototypes in Figma, refining our Mid-Fi prototype after user testing sessions.

Bright Minds desktop and tablet mockup
Bright Minds desktop and tablet mockup
Bright Minds desktop and tablet mockup

Click to Enlarge

EMBED

Figma Prototype

VIDEO

Narrative Digital Prototype

VIDEO

Final Presentation

THE CHALLENGE

Many standard educational tools used in classrooms such as PDFs or worksheets can feel passive for students and overwhelming for teachers. The scope of this project was to create a cohesive experience that engages children in a positive manner and simultaneously functions as a professional data-tracking tool for a teacher while maintaining accessibility for varying literacy levels.

THE GOAL

Our focus was on increasing student engagement in reading through gamification and provide educators with personalized data to tailor instruction to every student's specific learning needs.

RESEARCH METHODS

We analyzed existing educational apps to identify engagement gaps. We used this information to develop our two user personas, Mrs. Brown the teacher, and Grace the student to map out those contrasting needs. Upon creating our Mid-Fi prototype, we conducted feedback sessions via usability testing to identify any navigation friction or issues with cognitive load.

We conducted usability testing with our mid-fi prototype by creating a structured test plan. Users were asked to complete the four major tasks based on the user stories and tasks outlined in our logic map. Our observations included the ease of navigation and task completion, any points of confusion or difficulty, and feedback on UI elements, engagement levels, and overall usability. We had four participants with various backgrounds that were relevant to garner feedback from (high school student, college student majoring in education, game studies graduate, and preschool teacher). Each participant was asked to complete the four main tasks while providing feedback.

Tasks:

  • Completing an Assignment: Users needed to navigate to their assignments and complete them.

  • Taking a Knowledge Test: After finishing a reading assignment, users were tasked with taking a test and sharing their results.

  • Checking Academic Progress: Users needed to locate and interpret their progress reports.

  • Unlocking a Level & Receiving an Award: Users explored how rewards were displayed and accessed.


RESEARCH INSIGHTS

Our research highlighted that teachers require "at a glance" data visualizations, while students need minimal text and high visual feedback. Students are more likely to complete lessons when they can view their progress, such as levels, rewards, and badges.

Our usability testing with our Mid-Fi prototype revealed that users liked that the app was engaging but not overwhelming, some navigation elements were confusing (e.g., “See Assignments” was unclear), the reading section felt monotonous and needed more interactivity, and the Rewards Page was cluttered, causing cognitive overload..

USER STORIES

We built our logic map and prototype around four different user stories that we developed based on our user personas. This was done to ensure that the app effectively supports both teachers and students in an educational environment by keeping them engaged and on track.

  1. Grace browses the available books, she either shares a book with a friend and rates the book through the app.

    • Corresponding Task: A student should be able to find and complete their assigned work easily.


  2. Grace completes a knowledge test.

    • Corresponding Task: Users should be able to take quizzes and assessments to track their learning progress.


  3. Grace checks her progress through the app, clicks a button to share it with a parent.

    • Corresponding Task: Students should be able to view their grades and progress in a clear and motivating way.


  4. Grace redeems a reward through the app, picks her reward, clicks a ‘send’ button or message to notify Ms. Brown.

    • Corresponding Task: The gamified elements should allow students to earn rewards and track their achievements

USER PERSONAS

Click to Enlarge

IDEATION

We developed a moodboard and style guide focused on a playful, educational, and inclusive theme featuring bright colors and imagery of students interacting with technology. Our sketches and wireframe explore the layouts for the "Home", "Progress", "Profile", and "Share" screens.

STYLE GUIDE

Click to Enlarge

SKETCHES

Click to Enlarge

WIREFRAME

Click to Enlarge

LOGIC MAP

Click to Enlarge

PROCESS DESCRIPTION

The project evolved from discovering our design needs via persona development to concepting through sketches and our moodboard. We then developed a digital narrative of our user stories to solidify a logic flow. Using this logic flow, we designed our wireframe, which then became our Mid-Fi prototype in Figma. After conducting usability testing, we applied our feedback to create our final Hi-Fi prototype with a strong focus on accessibility.

DESIGN CHANGES

Based on our usability testing, we made various design changes. On the home screen, we switched the placement of “Assigned to Me” and “Learn and Play” to better match user expectations. For assignments, we added short-answer prompts to keep students engaged while reading. We updated the rewards page to reduce the number of buttons to streamline the experience and reduce cognitive overload. Our progress tracking became a separate section for grading and performance feedback to make information clearer.

FINAL FEATURES

Our final features include a multi-channel interface for both teachers (desktop) and students (tablet). We integrated lesson plans with short answer prompts/discussions and knowledge tests to develop and track reading comprehension. Progress on modules and tests engage students with customizable profiles, rewards, and certificates. Students are able to read assigned books, view books in their library, rate books, and share their reports and certificates with others such as their parents. Instructors are able to customize lesson plans (books, knowledge tests) for each student and view progress and reports based on each module assigned. Our style guide for this prototype includes a eye-catching and vibrant color palette for students, and a readable typography system.

IMPACT

Bright Minds transforms static reading and worksheets to a digital gamified plan to provide clear progress of student achievement. Students gain satisfaction through rewards and certificates, progress trackers and reports, and the ability to share their achievements with others. Teachers can assign customized lessons and track their students' progress in one centralized hub. Through iterative design, the final prototype successfully addresses the friction points of both user types.