Sock Finder

Upload a picture of your sock to find its missing pair

Comment

Inspiration

When we were told to make something useless, it took us a while to come up with an idea. After spending almost an hour trying to think of something useless, it hit us, socks. Everyone knows that feeling of missing a sock and not knowing what sock to pair it with. That's where we come in.

What it does

Users will take their shoe off and snap a shot of their sock. Once completed, they can upload it onto our website and instantly find a sock that matches what they are currently wearing. When the user enters their image, it is uploaded into our database. Next, our program detects the color of the sock and matches it with a sock that has either the exact or similar color. This will help users find socks that they can wear with either a missing sock or if they just want to spice up their style.

How we built it

To build the back end, we used Python and the cv2 library to analyze and flatten the images. We then found a large data set of sock images on Kaggle. With these images and the Python code, we analyzed the color contents of the over one hundred socks and placed them into a CSV file. After the CSV file is made, the program analyzes the center pixels of the user's inputted image. Once done, it finds the color of the user's sock, outputting an image of a sock with the same or very similar color/design.

To build the front end, we used HTML, CSS, and Javascript. Using a color palette and design principles, we worked on making a simplistic and usable interface for the user. On the front end, the user is able to click a box and upload an image. Once it is uploaded they are able to see it in the box and then press submit to find a matching sock. On the result page, it shows the user's original sock and matching sock side by side.

For the integration, we used the Python Flask library. We used the routing decorators to use "GET" and "POST" methods so the user's sock could be sent to the Python code. Once the Flask code finds a sock match, it sends the name of the file to the results page, which uses Jinja to dynamically show the image.

Challenges we ran into

Throughout making this project, we ran into a lot of challenges. First, we had never worked with cv2 or any image-flattening libraries. This made it difficult to figure out how everything worked. We also had a major challenge in iterating through the CSV results after the sock images were analyzed. We didn't have many challenges building the front end, but it became really difficult when it was time to integrate the two. We had a lot of challenges figuring out how to get the back end's results to show up on the front end. After a lot of trial and error, we noticed we were printing the result on the backend rather than returning it.

Accomplishments that we're proud of

We are very proud of this entire project. Having it be our first Hackathon, we did not know what to expect going into it. After throwing out the sock finder idea, we were not fully sure if it was even doable. After finding the database of socks, we felt like there was a possibility that we could do it in the time allotted. Once we spent the time to learn the proper libraries and methods that we needed to use, we were able to make a final product that was better... and more useless than we could've ever imagined.

What we learned

Making this project, we learned a lot of useful skills that we will go on and use in our programming future. The major aspect that we learned was image flattening and analysis with Python. We were able to take the color contents of images and figure out the shape of what was uploaded. These are concepts that we have always been curious about and will use them to create even more useless projects in the future.

What's next for Sock Finder

Sock Finder has a very bright future ahead. Once we can connect it to a web service like AWS, our database of socks can become rapidly expanding and will we will eventually expand our services into the tie market.

Share this project:

Updates