Recycle Right
Mobile App
Project Overview
Less than 5% of what’s recycled in the US is successfully processed - the rest gets thrown away. With recycling rules varying across the US and policies changing constantly it can be difficult for users to keep up. Most of the time we recycle improperly, which contributes to entire recycling bins being tossed in the trash.
Problem
Create an app that will improve education and awareness on the topic of recycling and help users stay current on recent news and recycling rules in their area.
Solution
8 weeks
Timeframe
Visual Design, Research, UX/UI Design, Art Direction, Prototyping, Testing
Contribution
Individual project mentored by Anna Brenner
Team
Research
Empathizing with users
10 individuals completed a survey regarding their recycling experience. Results show that most users aren’t familiar with their local recycling rules and don’t feel confident that their actions are making a difference. The feedback generated by this research made it clear that users feel lost when it comes to recycling and need help navigating the nuanced, constantly changing rules.
Competitive Audit
Understanding competitors in the market
I analyzed 2 apps and 2 websites dedicated to recycling education in order to compare the strengths and weaknesses of direct and indirect competitors in this field. My goal was to gain a better understanding of what is currently offered within the recycling education space, what were areas that could be improved, and if there were any gaps or needs in the industry.
Early Sketches and Low Fidelity Wireframes
Ideating and early stages of design
In the early stages of designing I experimented with several different layouts for the main screens. I wanted the app to draw upon familiar recycling/environmental motifs but I wanted it to have a bit more luster than what you’re typically used to seeing with products in that sphere. It was important that information was presented clearly and that the UI felt friendly and clean.
Usability Testing
Iterating and improving designs
An unmoderated usability study was conducted with five participants using the high fidelity prototypes. Each participant was given 10-15 minutes and asked to complete a series of tasks on the app. My primary research goal was to determine if the user flow for item lookup was easy and intuitive and expose pain points users might be running into during the process. After completing their tasks, participants completed a follow up survey regarding their experience. Insights from the study were used to improve upon designs.
Visual Design
Brand identity and visual language
When most people think of the recycling industry, an uninspiring image of the recycling sign probably comes to mind. I spent a long time trying to figure out if there was a way we could create a visual language that clearly identified the app and its purpose without the dated graphics.
Instead of the usual recycling triangle I chose to create a logo that was reminiscent of the 60s (a pivotal time for the recycling and environmental movement in the US). The floral shape is also very nature inspired, falling in line with themes of conservation and environmental awareness. This was a playful way to express the themes of mindfulness for the planet without using the same old icon we’re all tired of seeing.
Logo
Since I took a bit more creative freedom with the logo I kept the primary color for Recycle Right green - a very recognizable and universal color for nature, the environment, and sustainability.
Color
Onboarding
App introduction and feature walkthrough
I wanted the splash and onboarding screens to effectively introduce the app and its functionality. A combination of low and high fidelity graphics were used to gently highlight key features without overwhelming the user.
Home
A scannable and intuitive landing page
Careful consideration was given to the homepage given the knowledge that many users would be approaching the subject of recycling with reservation and anxiety. I always liked the idea of an image grid as it makes for quick and easy scanning. However, insights from the usability study showed that users were still having a hard time identifying items at a glance. After taking another pass at the UI I realized that sometimes, less is more. By reducing the grid to two items per row and allowing for more white space the homepage immediately became much easier to scan.
Search
Creating shortcuts and alternative ways of finding information
The value that an intuitive and efficient search adds to any product can’t be overstated. Perhaps the user has a very specific item in mind that might not be displayed on the home grid or maybe they simply prefer to navigate to their findings by searching. Whatever the case, a clear and comprehensive search can help users find what they’re looking for. Users can either scroll through the clearly listed index of materials or type the item of interest directly in the search bar.
Item Details Page
Recyclability of an item, helpful tips, and nearby drop-off locations
A distinguished label is located front and center of the page allowing users to easily identify if an item is recyclable or if it should be tossed in the trash. The use of a bottom sheet allows textual information to be clearly presented without compromising on the size or quality of the product image. Simple line work and iconography is used to group the information into sections, making it easy for users to scan and read up on what they’re interested in.
Discover
Current news and audio stories to explore
The discover page functions as a feed for users to explore and learn from featuring news articles, audio stories, uplifting environmental findings, and more. In earlier iterations of the design the search did not dock at the top and users expressed frustration at having to scroll all the way back up in order to access the search bar. By keeping the search bar docked users can now easily search while they scroll. This is a great example of how testing exposed pain points in the user journey that I overlooked as a designer and how, sometimes, simple solutions can make a large impact in improving the user experience.
Drop Off Locations
An interactive map
The Drop Off feature helps users look up nearby recycling/waste management facilities in their area. Labels at the top of the page allow users to sort by type of facility or search for certain keywords directly using the search bar.
User Profile & Settings
The right most tab of our main navigation is where user profile and settings information is housed. Featuring a simple list view this is an adaptable page that can host a myriad of user related items.
Reflection
This project fueled my passion for contributing to digital spaces that promote social good. It was incredibly rewarding to consider how design can be utilized to inform and empower users towards the goal of a greener world. It also taught me the importance of frequent user testing and iterative design. Sometimes we miss things as designers that can seem so obvious in hindsight. We need insights from our users to help us improve designs and make each iteration better than the last.
Continuous Improvement and Next Steps
I’d love to explore how this app can continue to improve and serve its user base. Here are a few areas that I think could further propel this product and make it event more enjoyable to use:
Expanding the Profile tab to include a schedule tracker for curbside recycling.
Adding more visual affordance to the map so users can see the different types of drop off locations at a glance - perhaps different colors for each type of facility with a legend or color coding the labels accordingly?
Conducting another round of user testing to identify pain points and user needs.
Takeaways