Inspiration
A current TikTok trend is to find dupes for popular, trending products at a lower price without sacrificing quality. Everyone loves trends and deserves to feel confident in their style choices regardless of budget. So, we sought to compile available dupes for trending products from a variety of categories ranging from clothing to technology to aid consumers to make wise decisions and feel confident.
What it does
Our website is basically a search engine for dupes of many trending products. From the homepage, you are able to type in the search bar or you can click on the three lines at the left side to expand a sidebar. After clicking on a category in the sidebar, the website will bring you to a page with all the results for that category. The results will be displayed in a table form with three items in each row. Each item will have a picture displayed (both original and dupe) as well as the respective prices below the pictures.
How we built it
The website was built in Github. We used HTML and CSS. We mostly focused on design and color aesthetic, using a pastel color palette and making container objects and grid layout. We made it functional in the sense that you would be able to navigate to all the results. However, due to the time restriction, we were not able to include a search bar that would successfully find results.
Challenges we ran into
Formatting was difficult for us as none of us had used grid layout before and were unfamiliar with all the arguments. However, it often became uncentered and altered the ratio of length to width, so we had to play around with the various numbers. We also wanted the website to fit well on any screen so we turned the hard-coded numbers into percentages. However, this was just as hard since the proportions were extremely specific and one number off would result in an off-set web page. Additionally, we struggled a lot with designing the website because we wanted it to be user-friendly but also interactive.
Accomplishments that we're proud of
We really like the colors and fonts that we chose. Additionally, it took us two hours to figure out how to use grid layout with the help of some of the staff. It started off looking really standard but it ended up being aesthetic. We also thought of many creative ideas that we could potentially implement in the future.
What we learned
One of our team members, who has never made a website before or coded in 10 months, learned html. We were able to learn how to use containers inside of each other as well as how to use Github sites. Going through this experience also taught us how to plan and organize within a strict time limit, as two of us have never completed a project like this in such a short time.
What's next for doop
To make our website more incentive, we will implement a harder scavenger hunt with prizes like coupons or anything else useful. We currently have a scavenger hunt, but we don’t have enough funding or logistics to implement prizes. Furthermore, we will implement a search bar that enables users to directly search for specific products. When clicking on product images, we will edit the code so that it opens a new tab with the link instead of reloading the current tab with the product link. This allows users to just close out of the item tab whenever they want to go back to our website.
Log in or sign up for Devpost to join the conversation.