Loop Mobile App
(Re)Designed with reuse in mind
Year
2022
Type of work
App design
Role
UX&UI Designer
Client
Loop (owned by TerraCycle Inc.)
Overview
I was assigned to work on a few improvements for their mobile app during my first year as the new UX&UI Designer. The improvements needed to be completed after the company had received feedback from its users. I worked closely with the BA and developers during a tight timeline.
About the Loop app
Loop is an innovative waste reduction platform that aims to address the issue of single-use packaging and promote a more sustainable approach to consumption.
When a consumer purchases a product through Loop, it is delivered in a specially designed, durable container that can be returned, cleaned, and refilled by the company for reuse. The consumer must use the Loop app to scan the QR code placed on the container at the time of the return.
Understanding the customer's feedback
Through a customer satisfaction survey, Loop received numerous requests for a more well-designed and easy-to-use app. The key functionality and use of the app is the "scan to return" process.
Exploring the app's sitemap
I laid out the sitemap to understand the user's journey in the app. I used FigJam's tools to visualize each main path the user can take in the app.
Improving the ease of use
The final design aimed to help Loop's customers use the app with minimum friction. The always-available scan button on the bottom navigation bar is helping users to quickly scan a product for return, while the app's homepage offers a variety of additional tools that help the user keep track of their progress.
Improving the ease of use
The final design aimed to help Loop's customers use the app with minimum friction. The always-available scan button on the bottom navigation bar is helping users to quickly scan a product for return, while the app's homepage offers a variety of additional tools that help the user keep track of their progress.
A unified design system that promotes reusability
The homepage was reimagined to have a dashboard with a more friendly look & feel, with a progress tracker being added, along with a snapshot of the most recent items that were returned, and a button to find the nearest return points. Moreover, the bottom navigation bar hosts a new option for the catalog of products, and the commonly used button for scanning QR codes is more visible & easy to reach when holding the phone with one hand.
The "Account" page is more easy to understand, and the product images have been added to each transaction, making it much easier for the customer to manage their transactions.
Finding a nearby location for purchase and drop-off is a lot more convenient with the addition of logos to the map, and the bank account setup screens are redesigned to be more intuitive & easy to fill out.
(Hover over the images to see the before & after)
A UI kit for TerraCycle's website, which is currently used for every single website project.
The homepage was reimagined to have a dashboard with a more friendly look & feel, with a progress tracker being added, along with a snapshot of the most recent items that were returned, and a button to find the nearest return points. Moreover, the bottom navigation bar hosts a new option for the catalogue of products, and the commonly used button for scanning QR codes is more visible & easy to reach when holding the phone with one hand.
The "Account" page is more easy to understand, and the product images have been added to each transaction, making it much easier for the customer to manage their transactions.
Finding a nearby location for purchase and drop-off is a lot more convenient with the addition of logos to the map, and the bank account setup screens are redesigned to be more intuitive & easy to fill out.