top of page
Ecopoints image.png

Ecopoints

Transforming a recycling rewards app into an engaging, planet-saving experience that inspires users to take action and make a positive impact on the environment.

Overview
This project was part of an internship with the app’s development company, focused on redesigning the app to improve the current, the UX/UI and introduce new features.Beyond locating collection centers, earning rewards and transferring points, the redesign expanded functionality to include scanning products, useful tips for recycling creating a more engaging and user-friendly experience.

Goal

The objective of this project was to completely redesign an existing app to make it more user friendly by enhancing the UI/UX.
The initial version posed usability challenges and readability issues, needing a redesign for more user engagement.

Role

Lead UX Designer

Tools

Figma,Miro, UXMetrics, Google Analytics

App mockup.png
App mockup.png
App mockup.png
Research Phase

To kick off the project, I began with a UX analysis to assess strengths and areas for improvement in the current app. I held stakeholder interviews to understand new requirements and how they could integrate with the existing architecture.

​

Next, I researched comparable apps to identify design patterns for inspiration in the redesign of Ecopoints. Since user personas were already established by the company, I focused on conducting interviews with people matching these personas to gain insights into their pain points, motivations, and user journeys.

Interviews

After the project kickoff, we defined our research strategy and objectives. Understanding the target audience and their challenges were our priority so we conducted a brief interview with pen ended questions to 5 people. Based on these, we identified common pain points like nomenclature issues, difficulty on finding collection centers etc and also we could determine the most used app functions according to this users, which lead us to the next step.

Insights of user interviews

Costumer Journey

We mapped out the customer journey to get a clearer picture of how people find and interact with the app and to uncover ways we could make their experience even better. This process highlighted some key challenges and opportunities.

Insights of user interviews

Card Sorting

To ensure the site’s information architecture met user expectations, we conducted 10 remote card-sorting sessions using UX Metrics. Our goal was to evaluate the effectiveness of the current structure and identify any gaps. Users were encouraged to create new sections if the existing categories didn’t quite fit.

​

After analyzing the results, we refined the architecture into six clear main categories, including a new one suggested by users. We also adjusted several subsections—relocating some and renaming others to address naming inconsistencies.

​

In addition to this we also analyzed traffic data in Google Analytics to identify which sections users were most interested in and to understand the behaviors of each persona within the app. This helped us align the site structure more closely with real user needs and engagement patterns.

Wireframes

I used Figma to turn my initial sketches into low-fidelity wireframes. At this stage, the wireframes were detailed enough for early user testing, so I conducted five tests. Feedback on the profile and points calculator was positive, while the catalog section needed further adjustments. After making these tweaks, I moved on to building high-fidelity prototypes.

Wireframe Black and White.png
Usability Testing
Phones.png

Using Figma, I created a fully-functional, high-fidelity prototype for the new flows. Simultaneously, we began recruiting test participants who matched our user personas and criteria. We conducted 15 usability tests with these participants.

Key Findings:

  • Users found the exchange, news, and help sections easy to navigate.

  • The search for collection centers wasn’t always intuitive, though users were able to complete the task. Enhancing the visual hierarchy of the search bar could improve usability.

  • The scanning icon should be more prominent and visually distinct from the recycle section.

  • Opinions were split on the placement of the point transfer feature; some users expected it to be in the exchange section, while others looked for it in their profile.

UI Design

After addressing the usability issues, I proceeded to design the final screens in Figma. With an established brand identity already in place, I adhered closely to the brand guidelines to ensure consistency with the company’s branding.

Nokia XR21.png
1ecopoints.png
2ecop.png
3eco.png
Outcomes

The addition of new features, such as scanning functionality, along with the updated UI and improved information architecture, led to a measurable increase (approximately 64% of users at a meaningful level) in user engagement following the launch of the new version.

Check out more UX projects

HNN App

App for helping parents to navigate the Costa Rican Children’s hospital

Hnncov.png
Churuca App

App designed to make farmer’s market easier

Churuca.png
Pancake App

Website design for virtual interior design sessions with clients, designers and administrators.

© 2023 by Daniela Solano Brenes

bottom of page