Inspiration
When we first heard IMC Trading's challenge, the idea of building for charity sounded perfect to us. With both of us having South Asian heritage, we have witnessed first-hand the extremes that people have to go through so that their employer can make extra profit. Many consumers have noticed this and want to shop more ethically, but it can be difficult and tedious to see which companies truly uphold fair labour practices.
What it does
wearFair is a minimalist browser extension that allows users to view an ethical score out of 100 for clothing products when shopping online. When a user is on a product page, wearFair extracts the page's content, analyses it with AI and generates a score based primarily on 3 factors: labour rights, environmental impact and animal welfare. Below the score there will also be a short explanation and, where appropriate, suggestions for more ethical alternatives. Users can customise how much each factor matters to them through adjustable sliders, allowing the final score to be more personalised to their values. By simplifying a lengthy research process into a single, accessible format without leaving the product page, wearFair empowers customers to make informed shopping decisions
How we built it
We built wearFair as a browser extension using HTML, CSS and JavaScript. A content script extracts text from the webpage and applies a lightweight heuristic to determine whether the page is indeed displaying a clothing item. It does this by searching through an array of common shopping keywords such as "size", "fabric" and "add to cart". The information is then sent through the Gemini API with our custom prompt. We are given general scores for each category and the description, then the user's preferred weights are applied locally Products are cached locally with their associated information in a hashmap structure, and they can be accessed at a later point through a side menu. This makes it easier to compare scores across different items rather than constantly rerunning analyses. When a product is analysed for the first time it is saved on a cloud database (Supabase). This means that when another user tries to analyse the same item, the unweighted score and item description is fetched from the database, rather than spending resources on a duplicate LLM request.
Challenges we ran into
One of the major challenges was ensuring that the extension was only run on relevant sites. Many non-clothing pages contain overlapping keywords, so we implemented a check to see if at least 3 words from our array of keywords match with the page. Another challenge was handling malformed AI responses, so we had to carefully engineer prompts to encourage it to stay accurate.
Accomplishments that we're proud of
First of all we're proud of completing an MVP of the product and having a complete submission. This is our first time at a hackathon and whilst competing has been extremely fun, it was quite the struggle at the start to get used to working in this kind of environment. Beyond this, we're proud of building a fully functioning Chrome extension that can extract the page data, generate the scores and also present it in a clear and intuitive interface. Another major accomplishment is our caching/database system which stores previous analyses to reduce API usage and improve performance.
What we learned
We learned how to design and deploy a fully-built browser extension, including passing messages between content scripts, popups and background services. We also gained experience in prompt engineering. Having to craft long, detailed prompts has definitely reshaped the way we will be using AI in the future. As we had an end user in mind whilst building this project, we spent time looking at other sites for UX inspiration and learned what thoughtful UX design means.
What's next for wearFair
At the bottom of the page there are links provided to alternative sites. It would be good to make these into affiliate links, with the charities receiving the proceeds from this. To complement the AI analysis, we want to expand our sources and incorporate data from ethical certification databases such as Ethical Consumer, IAF CertSearch and ISCC.
Built With
- css
- gemini
- html
- javascript
- supabase
Log in or sign up for Devpost to join the conversation.