Inspiration
We increasingly see AI-generated content on social media and wanted a quick and convenient way to check if the content we saw was human or AI generated. We wanted to prevent being mislead and believing false information, increasing AI-transparency in our consumption of media.
What it does
We built a browser extension (Chrome) that allows users to detect AI usage in images and text content. After installing the extension, they can right click on an image or highlight then right click a block of text. This then opens up a content menu where they can click 'Detect AI', which calls the AI detection APIs. This then opens a side panel displaying the results of the detection, including the AI likelihood percentage visually as a colour-coded gauge as well as highlighting parts of the text that were >40% likely to be AI generated.
How we built it
For the backend, we used ExpressJS and TypeScript. For the frontend, we used React, TypeScript and TailwindCSS. We also used APIs for our AI detection: Sapling and SightEngine. Plasmo was used as our development platform to help build and manage our browser extension quicker.
Challenges we ran into
We faced issues getting our API keys because some of them were invalid, so some of us could access text detection or image detection only. We also had other commitments over the weekend so we had to work asynchronously, and some features were dependent on others' implementation so we had wait times in between. Also, since none of us had built an extension before, we had to rely on Chrome and Plasmo's documentation. This was a lot to take in so we missed some parts about special directory names for Plasmo to work, and similar with Chrome as the documentation didn't have in depth examples for some functions so it was unclear how to use them.
Accomplishments that we're proud of
We are proud to get our working MVP with both image and text AI detection which were the most important features we wanted completed.
What we learned
We learnt how to integrate APIs and also work as a team including delegation of tasks to people's strengths. We also learnt how to build a browser extension (with lots of documentation reference)!
What's next for AI Detector Browser Extension
Additional features we had planned was AI detection for video, music and more detailed reasons as to why/why not the content was AI generated.
Built With
- express.js
- plasmo
- react
- sapling
- sightengine
- tailwindcss
- typescript


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