Green Closet

Inspiration

Recently we have become increasingly aware of the use of fast fashion. Fast fashion is an industry that rapidly produces inexpensive clothes to duplicate trends. Fast fashion is not meant to last a long time and these clothes are often made with exploitative labor. The everyday person can most easily combat their use of fast fashion with self-awareness. Knowing what is in your closet and the sustainability of brands you shop from can help you cut down on your contribution to fast fashion.

What it does

Green Closet helps users identify the items in their closet and how often they use them with a scan feature, an OOTD (Outfit of the Day) feature, a view closet feature, and a sustainability information section. Currently, the working model has a homepage, a scan feature, and sketches of coming features. The scan function allows the user to input the items of clothing they own through a camera feature. The user simply takes a photo of their clothing item, chooses the category (tops, bottoms, shoes), and then names it. The OOTD feature allows users to log the items of clothing they are wearing that day (from the pieces they’ve uploaded through the scan feature), then marking them as “dirty” in the view closet feature. Additionally, this feature keeps a tally on what items you wear most often. This tally is displayed in statistics of individual items in the view closet feature. This allows you to see which items are most infrequently worn and gives you resources to find out where you can donate. The view closet feature allows users to see articles of clothing they have that are clean and dirty. The ability to see what clothes you have that are clean allows users to plan outfits for following days knowing what clothes are in the laundry. This feature also includes a “done the laundry” button which resets the dirty clothes and puts them back into their respective section of tops and bottoms in the clean sections. The sustainability information section provides a sustainability rating and a general price range about brands we have looked into. This allows the user to look at the sustainability of different brands of clothing and decide for themselves what is within their price range that will be the most sustainable.

How we built it

This website used HTML, CSS, and javaScript elements. We also used firebase to implement authentication and later down the road, firestore and other capabilities.

For the scan section, the Javascript starts with a function so that the computer will turn on the user’s webcam when the “Start Camera” button is pressed. Next, if the “Click Photo” button is clicked, it displays the photo the user took on the screen. The HTML part of the scan section has drop down options and user input section for the user to label and name the photo they took.

Challenges we ran into

We were very ambitious with our goals coming into this project. We overestimated how much we could learn to do without running into bugs along the way. This caused a lot of frustration and setbacks. We had issues importing and implementing Firebase which caused us to fall behind schedule. Additionally, one of our coders had little CSS experience causing it to be difficult to manage layout on certain pages, therefore the UI not being as planned.

Accomplishments that we're proud of

Having never been to a Hackathon together, we are proud that we managed to merge our skills together and create a project that can help people organize their closets and be more sustainable with their clothes.

What we learned

We learned a multitude of new coding knowledge. As this is the first time our team has worked together, we had to iron out the kinks. We assigned roles and split work according to our strengths and weaknesses so we could better support each other. We learned how to work collaboratively as a team. This is the first time we have considered the UI/UX of a project, creating a coherent theme throughout our project. A member learned how to incorporate firebase into our project to add a sign-in functionality. Another member learned the basics of HTML. This is the first time we have used GitHub to keep track of versions of our project as well as share our parts of code with each other.

What's next for Green Closet

In future development of Green Closet we would like to continue development of sketched out features, make Green Closet an app, implement a few AI aspects, use a database, add a social media aspect and add supplementary aspects. We believe that making our project into an app will enhance user experience. It makes taking photos and logging outfits easier for the user. In adding an AI aspect we would want to change the OOTD feature to be a camera function which is able to identify all the articles of clothes you are wearing in the frame of the camera. Additionally, we would like to implement an aspect that can produce a description of the articles of clothing you have scanned. For example, it would be able to identify a white tank top regardless of small design detail differences. With this aspect, it would also be able to alert the user of trends that are appearing in the social media aspect of the app. The app would still be accessible for the user without having to participate in the social media aspect. One of our biggest challenges was our inability to save photos because of our inaccessibility to a database. If we had a database we would be able to have a completely functional project. Additionally a few aspects we would like to add in the future is a search bar in sustainability information so that people could easily find brands they support most often to find out. We would also like to add multi-factor authentication for a safer user experience.