👖🌱 decode (🥈 at SustainHacks 2022)

We decode greenwashing on clothing labels so you can choose clothes that last longer and fight back against fast fashion practices.

This is our submission to Sustain Hacks 2022. To install our extension, please see the installation instructions. Note that the webscraping service may not be live if the backend is being updated.

Table of Contents

• Why We Made It
• How It Works
• How It Was Built
• Installation
• Contributors

Submission Links 🔗

• YouTube Demo
• Devpost
• Backend

Fight Back Against Fast Fashion

To combat greenwashing, we created Decode. Decode helps analyze pieces of clothing and rates how sustainable they are based on what materials they are made of. Users can use Decode in three ways:

1. Download the chrome extension and use it on specific clothing pages as they online shop
2. Copy and paste the URL of a clothing item into our website, or
3. Manually input the clothing information on our website

How It Works

Given an article of clothing from a website (via one of the 3 methods above), Decode will web-scrape the page to determine clothing information like the blend of materials (80% cotton, 20% polyester), clothing type, brand, and weight.

Using this information, Decode will run its sustainability, quality, and number of washes algorithms based on sustainable clothing research. Decode will then give you:

1. A sustainability rating based on the materials (score out of 10)
2. The fabric quality (score out of 10)
3. The estimated number of washes before product needs to be replaced
4. Tips to maximize that specific clothing's lifetime
5. Similar items in the database with high sustainability scores

How We Built It

Like most projects, it all started with a brainstorming session going over different problems tackling sustainability. Fashion just so happened to be the one topic we all agreed upon, and once we decided in this specific direction, we went straight into Figma to start building brand identity, grey-scale and high-fidelity wireframes. We followed the double diamond design process to explore many options in design and synthesizing our findings to build the most compelling solution for our end users.

There was also extensive secondary research done on the sustainability, fabric quality, and number of washes, which was used to create equations in the backend.

Between the two coders, we split responsibilities into frontend and backend. For the frontend, we started by getting the Chrome Extension live, managing the user workflow, and styling the website. The backend was setup with Python/Flask. Then, functions were made using the secondary research to generate the results.

Installation Instructions

1. Download the repository by clicking the green button and downloading the zip file to your PC.
2. In the top right corner of your Google Chrome, click the Extensions Icon and click Manage Extensions. If you can't find this button, just type: chrome://extensions/ into the address field.
3. Click Load unpacked
4. Select the entire folder you just downloaded from GitHub.
5. It should appear as following. Make sure the blue button is toggled.
6. The Chrome extension will now be in your Extensions. Click the Pin to place it on your pinned extensions bar, so you can easily use it when you're on a product page.
7. You're all set to go! Simply click the extension to get sustainability ratings on your clothes instantly.

Contributors

• Shawn Esquivel worked on the frontend in HTML/CSS/JavaScript and built the Google Chrome Extension.

• Jay Esquivel worked on the Python backend in Flask. He also created a custom webscraper to find the information about the clothing. Finally, he made calculations to calculate the sustainability rating, number of washes, and more. Check out his backend Github repo