Overview
Recicla+ is a case study developed during the UX/UI course at Coderhouse, in collaboration with a team of five people dedicated to creating an engaging experience for the proposed challenge: a residential recycling app. In this project, we applied our research and prototyping skills while incorporating gamification elements to boost user engagement.
On this page, I detail the UX and UI process we followed, highlighting my contributions across all stages, with special emphasis on interface design and user interviews, where I had the freedom to actively contribute and iterate.
_________________________________________________________________________________________________
💪 Team: Isabel Freitas, Luana Viana, Mauri Júnior, Jair Barros, and Luiz Davoglio
🛠️ Tools: Figma, Adobe Photoshop, Adobe Illustrator
📅 Project duration: 1 month
🛠️ Tools: Figma, Adobe Photoshop, Adobe Illustrator
📅 Project duration: 1 month
🎯 Activities: Desk research, user interviews, Style Guide creation, user flows & information architecture, interface prototyping.
The Beginning
Our first contact with the theme came when we chose to develop an app focused on encouraging residential recycling. The first step was conducting generative research, aiming to broaden our understanding of the subject and guide us toward a viable solution for a social issue.
Initial Research
We focused our research on understanding recycling behaviors among residents of multi-building condominiums, with an emphasis on local characteristics in the state of São Paulo. Our findings revealed that in 2021, the city of São Paulo recycled only 7% of the 12,000 metric tons of waste generated daily by its population. (Source)
Despite significant progress in recent years—driven by public policies like *Law 12.528/2007* (which requires residential condominiums with 50+ units to implement selective waste collection)—there remains a major gap in public education about proper recycling practices. Additionally, few tools exist to help citizens navigate this process effectively.
From this research, we generated several hypotheses about potential users and developed personas. We created a stakeholder map and value proposition canvas to identify all parties invested in both the project and recycling initiative. This process helped us pinpoint key questions and refine our research focus based on the user profiles we identified.
Initial Interviews
The previous research phase was crucial for identifying key questions and shaping our interview script, with the goal of validating and refining our hypotheses about household waste consumption and disposal. In this stage, we conducted interviews with 4 participants. After analyzing the results, we progressed to developing the task flow. It was during this phase that we recognized an effective way to encourage positive behavior would be to implement a user reward system, using this gamification mechanic to enhance platform engagement.
User Journey
It was during the user journey mapping that we began identifying the necessary flows and features for our MVP. We organized the activities into two key stages: Separating Waste and Receiving Rewards.
With this framework established, we moved forward with defining the screen flow.
The Research Process
With the screen flow finalized, we felt confident and well-prepared to begin low-fidelity wireframing. It’s worth emphasizing that research played a pivotal role in shaping the product, understanding its real-world context, and uncovering critical insights. These insights were essential not only for prototyping but also for developing the brand identity, style guide, and market positioning.
Leveraging this foundation, we crafted a cohesive design, spanning branding, UI, and gamification mechanics.
Leveraging this foundation, we crafted a cohesive design, spanning branding, UI, and gamification mechanics.
Prototyping Phase
Alongside the branding process, we developed low-fidelity wireframes—initially without defined colors, fonts, or logos. This was made possible by our established screen flow, which provided the foundation for structuring and organizing components.
The wireframing stage allowed us to test layout concepts (later validated through user feedback), inform the Style Guide (ensuring visual consistency) and pave the way for high-fidelity prototyping.
The product prototype only became tangible after an extensive research process.
With the final prototype ready, we validated our design decisions through a new round of interviews - this time to test user behavior. We conducted 8 interviews in total, each with one interviewer, one moderator, and the interviewee. We documented several necessary changes.
In a living project, this stage must be repeated regularly so new hypotheses can be generated and validated. This aligns with the Double Diamond framework, where iterations are essential for continuous product validation.