-
Landing page
-
Blockstack sign-in page
-
Redirection to Blockstack browser to sign-in
-
Display of the user's Blockstack name and avatar
-
User's feed displays after they log in
-
User's feed
-
Display of recommended Tailored Brand products
-
Display of the user's friends (people they have followed)
-
Display of a map rendered with OmniSci that displays how many people in different areas have purchased Tailored Brand products
-
Full rendering of the map with colored data points
-
Visualizations created with the OmniSci dashboard
-
Virtual Fitting room page (unfinished)
Inspiration
Buying clothing online is very frustrating when you fall between two sizes or when one company's small shirt is as big as another company's large. The whole experience becomes worse when that shirt looked amazing on the model but looks terrible on you. During the coronavirus pandemic, this problem was also prevalent when shopping in-person as many stores understandably prevented customers from using fitting rooms to prevent the spread of the virus. To address this problem, we created a virtual fitting room where you can try on clothes before you buy them online.
What it does
There are two components to our product: a website and a mobile app. The website provides a space where users can see their friends' purchases, the items most popular in their surrounding area, and add clothes to their virtual closet to try on. The mobile app manages the virtual fitting room where users can try on pieces of clothing that they added to their virtual closet.
How we built it
We used Transposit's Airtable integration to populate the newsfeed showing what each user's friends have purchased. Tailored Brands data and Omnisci were important tools in helping us visualize the most popular purchases in a user's surrounding area. Blockchain and Blockstack was used for user authentication and storing each user's credentials, along with their virtual closet's items. The Polarr API is used to crop out a picture of the user so they can try on clothing in the virtual closet. Snapkit is also integrated so users can take a picture of themselves "wearing" the clothing using their Snapchat account.
Challenges we ran into
When using Transposit, we encountered an error that has never before been seen in the company's history (according to an employee we spoke with as we tried to get help to resolve this issue). Debugging said error took up a very large amount of time.
We had trouble putting pointers on the map using the OmniSci API. We also encountered a multitude of errors when attempting to integrate Snapkit in our iOS app. Lastly, we ran into a couple of programming problems while consolidating different parts of functionalities on our webpage.
Accomplishments that we're proud of
Learning to integrate such a wide variety of APIs (at least TEN!) in such a short period of time was an incredibly challenging, but rewarding experience.
What we learned
We learned to use Transposit, Polarr, and Snapkit. We absolutely loved Transposit and what it gives back to the hacking community, so we plan to use it in future hackathons too.
We also learned to use OmniSci's Immerse dashboard, their Vega and MapDConnector APIs, Mapbox, Apache Kafka, the Blockstack API, and React.js. It was great to learn about the Blockstack platform, which uses decentralized blockchain technology to empower end users where they are in charge of their data. Meanwhile, the data visualization tools offered by OmniSci led us to learn more about how data can help businesses and users to make informed decisions.
What's next for Suit Yourself
We would like to integrate a 3D virtual closet and try to map the clothing onto a person's body so people can get a more exact fit to see which size fits best for the clothes they are shopping for. We also plan to create a marketplace on our platform where people can buy and sell their used clothes, making it easier for users to get appropriate clothing on various occasions at a reasonable price.
Updates from Hacktech 2022
During Hacktech 2022, we decided to revisit this project and add to it as we realized it would be extremely helpful to virtually try on clothes during the pandemic to prevent the spread of coronavirus through in-person contact. During this hackathon, we added more features to the app and website and updated some deprecated code.
Built With
- airtable
- blockchain
- blockstack
- css
- data-visualization
- geomaps
- html
- ios
- javascript
- kafka
- mapbox
- omnisci
- polarr
- react
- swift
- tailored-brands
- transposit
- xcode

Log in or sign up for Devpost to join the conversation.