FroggyFriend

Inspiration

37% of youth between 12 and 17 years of age have reported being bullied online at least once. Yet, only 1 in 10 of them have informed a trusted adult about it. Seeing as many children are already going to be using the internet and social media from a young age, we might as well make it as safe as possible. With this chrome extension, we wanted to provide a one-click access to mental health services for children and anti-cyberbullying software.

What it does

Just turn on the FroggyFriend feature and you will get a popup menu in the top right corner of your browser where you can choose one of three quick help options: the KidsHelpPhone main page, phone contact, or a live-chat feature. The extension also protects children from profane language, it analyzes the text on a webpage and replaces hateful words with asterisks.

How we built it

We started by making a manifest.json file to host the chrome extension, using the Chrome extension API. Then, we used HTML and CSS to design a popup menu, you can click on the extension icon in the top right and you have 3 quick access buttons to mental health resources for kids. We used an online resource called Font Awesome to extract fun icons and our signature logo: the frog. With JavaScript, we wrote a content script to extract text from the HTML DOM, to analyze extracted text for profanity using Google’s list of bad words, and then censor them.

Challenges we ran into

Nobody on the team had a very good understanding of JavaScript so we had to watch many tutorials on how to use it. One major issue was figuring out how to get all the words from a text file and use it in the JavaScript file, and ended up solving the problem with a simple Python code. Another major challenge was extracting all text from HTML documents and figuring out how to make changes.

Accomplishments that we're proud of

We would be proud to make a difference in the mental health of today's youth. We are proud that we learned to use new technology, most of us were new to HTML as well. We believe that we created a very reliable and easy-to-use web extension.

What we learned

We all learned to code in JavaScript, HTML, CSS, how to extract text from webpages, and making aesthetically pleasing yet functional technology.

What's next for FroggyFriend

This can be applied to many social media platforms and messaging apps to prevent inappropriate messages or content from being shown, especially to younger children.

Built With

• chrome-extension-api
• css
• html
• javascript
• python