HU
Hu was a five-day team design sprint dedicated to creating an engaging, student-centered app to address the challenge of food waste.
The goal of the project was to develop an app that educates students about food waste while incentivizing usage by offering service hours. Targeting middle schoolers, we designed interactive games to keep them engaged, making learning fun and encouraging friendly competition with classmates.
Project Length
5 Days
My Role
End - To - End Designer
Year
2024
Tools
Figma, Figjam, Google Meets.
The Challenge:
Design a platform that is fun and easy to use for middle school students, integrating it into schools where they can learn about food waste while also earning service hours. This way, they will learn how to properly dispose of waste while gaining the service hours required for graduation.
The Solution:
Since our target users are middle schoolers, we decided to gamify the app by allowing points earned to go towards their community service hours. The features we included are a leaderboard within their class, interactive games, and a camera feature to identify how to dispose of certain items. This way, students can learn about food waste while earning points and competing for the number one spot.
We decided to structure this 5-day sprint by focusing on a specific task each day to keep us on track.
This approach allowed us to dive deep into user needs and be thoughtful through each step of the design process come up with ideas and how to make them come to life.
Day 1: The Research
The first thing we did was dive into understanding the problem thoroughly by conducting secondary research and gathering statistics on the issue.
This allowed us to understand the current issues faced by high schools, as well as the practices being used today.
We also conducted interviews with middle schoolers, and we were fortunate that one of our team members had a brother within our target user demographic!
This proved to be pivotal to our research. We aimed to understand the challenges students face, their food waste practices at home and school, and what would incentivize them to use the platform.
From the interviews, we came up with the idea to gamify the app, allowing students to earn service hours in exchange. Initially, we considered offering extra credit points, but all the interviewees expressed a preference for receiving service hours instead.
The Design Challenge:
How might we educate public high school students to reduce food waste and make more sustainable choices in their daily lives?
Market Research:
To create an innovative, easy-to-use app, we researched successful educational platforms that combine play and learning effectively. We looked at companies like Duolingo and Khan Academy, which have successfully blended gamification with education, providing both engagement and valuable learning experiences.
We also drew inspiration from Headspace for their use of bold colors and a recognizable avatar. We aimed to give our app a similar feel, creating an inviting and visually appealing experience that is both engaging and easy for students to connect with.
The Target User:
After conducting interviews and analyzing our research, we created Timmy, our user persona, to capture key insights from our findings. This persona helped us maintain a user-centered focus, guiding us to develop solutions that directly align with the needs and behaviors of our target audience.
Day 2: Sketching
Once we had a clear understanding of the problem, we began sketching to bring our ideas to life.
Since this was a group project, each team member used the Crazy 8 method to brainstorm different approaches. Through this process, we were able to collaborate and agree on the screens we wanted to create and how to best approach them as a team.
We were all aligned on the app's functionality and the features we wanted to include, ensuring a cohesive vision for how the app would work and what it would offer.
Day 3: Define
The decision-making stage of the sprint was crucial to the process, as it allowed us to collaborate closely and develop the best user-centered solution to the problem. Through open communication and teamwork, we were able to refine our ideas and reach a consensus on the most effective approach.
Timmys Journey:
By leveraging teamwork and our collective creativity, we developed a storyboard that showcases Timmy's journey using the HU app. This helped visualize how the app would function and how it could best serve the needs of our target user.
In the storyboard, we depict Timmy at school, throwing away his uneaten food, which leaves him feeling guilty and frustrated because he doesn't know how to properly dispose of it. Later, in class, his teacher introduces the HU app, explaining that it will help students learn the proper way to dispose of food while earning service hours. This gives Timmy a sense of empowerment, and he becomes excited to not only learn about food waste but also earn service hours and challenge his classmates.
The Result: Hu
We created HU, an interactive educational app designed to teach students about food waste through engaging games and tangible rewards. The app is intuitive, easy to use, and seamlessly integrates into school programs, making learning both fun and impactful.
The goals of HU:
Deliver an engaging educational experience by using interactive games to teach students about food waste in a way that keeps them interested. Instead of traditional learning methods, HU incorporates dynamic visuals and hands-on activities to ensure an enjoyable and effective learning process.
Gamify the learning experience by introducing friendly competition in the classroom. Students can track their progress, earn points, and compete on leaderboards, reinforcing positive habits related to food disposal and sustainability in an exciting way.
Offer tangible rewards by allowing students to earn service hours—an essential requirement for graduation. This incentive motivates participation and provides a meaningful way for students to contribute to their community while learning about responsible waste management.
Day 4: Prototype
During the prototyping stage, we had the opportunity to bring our sketches to life by developing a high-fidelity prototype in Figma. This was one of the most exciting phases, as we transformed our initial concepts into a fully interactive and visually polished experience.
This step was crucial in ensuring that our design was not only aesthetically appealing but also functional and intuitive for our target users. As a team, we collaborated closely—iterating on ideas, refining interactions, and carefully selecting colors and visual elements to give HU a cohesive and engaging feel. Through this process, we aligned on a design that balanced playfulness and usability, ensuring a seamless experience for middle school students.
The Sign-up Screen
On the sign-up screen, we incorporated a feature that allows students to personalize their HU avatar, creating a more engaging and user-centric experience.
This interaction not only adds a layer of fun and creativity but also fosters a sense of ownership and familiarity with their profile.
By giving students the ability to customize their avatars, we enhance user engagement and establish a stronger emotional connection with the platform, ultimately making their learning experience more immersive and enjoyable.
The Home Screen
The HU home page is designed to provide a personalized and engaging experience for students. It features their selected avatar color, name, high school, and grade, creating a sense of familiarity and ownership. To reinforce engagement, students can track their progress with a preview of their accumulated XP points, motivating them to stay active on the platform.
The home page also includes educational cards that highlight the "Lesson of the Day" and offer informative videos on topics like composting, making learning easily accessible.
Additionally, intuitive navigation tiles guide students seamlessly to their learning journey and profile, ensuring a smooth and user-friendly experience while keeping them motivated to engage with sustainability-focused content.
The Features
To create a playful and engaging experience, we incorporated interactive features that encourage student participation. One key element is the Journey Map, where students can visually track their progress, reinforcing motivation and a sense of achievement.
The Library serves as a comprehensive learning hub, offering a variety of educational activities tailored to different learning styles. Students can explore games, videos, books, and Q&A challenges, making the process of learning about food waste both fun and impactful. These features ensure that education feels less like a requirement and more like an immersive, rewarding experience.
The Games
Recognizing that our users are familiar with online competitive games, we designed the Versus Game, allowing students to challenge each other for points. This feature enhances engagement by making the learning process both educational and exciting.
To further encourage interaction, we integrated a camera identification tool, enabling students to scan items and receive instant guidance on proper disposal. Additionally, the HU Chat provides real-time answers to their questions, fostering curiosity and proactive learning while reinforcing sustainable habits.
Profile and Leaderboard
The Profile Section provides students with a personalized overview of their progress, featuring their chosen avatar alongside key performance metrics. It displays accumulated service hours, XP points, and their current level within the Journey Map, ensuring they stay motivated and on track.
To enhance engagement, we incorporated a Leaderboard, which reinforces the gamification aspect by fostering friendly competition among classmates. By seeing who ranks at the top, students are encouraged to actively participate and improve their standing, making the learning experience both interactive and rewarding.
Day 5: Testing
On the final day of our sprint, we focused on usability testing to assess the functionality, engagement, and overall user experience of our prototype. Our goal was to identify any pain points, refine interactions, and ensure the app delivered a seamless and enjoyable experience for students.
We conducted testing sessions with our classmates, gathered valuable feedback, and iterated on the design by making necessary refinements based on our findings.
This process allowed us to optimize the usability and engagement of HU, ensuring that it effectively meets the needs of our target users.
The Final Prototype
The final prototype successfully seamlessly integrates the educational goals of the app with an engaging and gamified experience. We focused on creating an intuitive and user-friendly interface, ensuring that students could easily navigate the platform, participate effortlessly, and stay motivated.
By implementing clear navigation and interactive elements, we designed an experience that encourages exploration while reinforcing learning. The combination of game mechanics, progress tracking, and rewards keeps students engaged, making HU not only an educational tool but also an enjoyable and immersive experience.
Key Learnings:
Understanding the User: Having a clear understanding of our users and their needs was essential in the development of HU. Recognizing that our target audience consists of young students, we strategically incorporated gamification elements to enhance engagement. By leveraging competitive and interactive gameplay, we designed an experience that aligns with their interests, ensuring they are more motivated to participate. The combination of fun, educational challenges and rewards creates a learning environment that is both enjoyable and impactful.
Importance of Incentives: The importance of incentives plays a pivotal role in motivating students to engage with the app. By offering service hours as a reward, we provide students with a tangible, real-world benefit tied directly to their educational journey. This not only makes the learning process more rewarding but also encourages ongoing participation.
Importance of Intuitive Design: This cannot be overstated, especially when developing educational tools for younger audiences. By focusing on a seamless user interface with clear navigation and visually engaging elements, we ensured that students could easily interact with the app without frustration. This streamlined design helps maintain focus on learning, reducing barriers to engagement. It also reinforces the value of intuitive design in creating a positive user experience, making it essential for ensuring that students stay motivated and effectively use the app to reach their educational goals.