Coral

Inspiration

Our team was inspired by the struggles of keeping up with language learning outside the classroom. Students of foreign languages often "use it or lose it" and the pandemic provides unique challenges for those seeking to begin to learn and maintain their language skills with others. We think that the increased screentime of our work and play provides an opportunity for innovation in the education track.

What it does

Learn new languages as you browse! Coral is a Chrome extension that immerses you in foreign vocabulary. Using machine translation models, Coral replaces words in your web pages with those translated into another language of your choice. While learning vocabulary can often be a slow and manual process, learning with Coral is interactive and integrative. When a student reads a news article, for example, Coral will replace certain words into another language. As students progress, they can mark words as already known and increase the difficulty of Coral or add them with their definitions to a flashcard list for future study. Coral allows users to then access an integrated flashcard review page.

With functionality encompassing over 30 languages, Coral provides the flexibility and ease of use that makes learning steady and unobtrusive. The added context of surrounding words in the student's native language allows for greater understanding than simple dictionary entries, and various configurations allow the extension to be adjusted in difficulty, turned off, and modified.

How I built it

Coral is built using javascript, HTML, and CSS, and interfaces with web pages as a Chrome extension. Translation was provided by the Google Translation and Natural Language APIs, integrated with REST calls. Logos and art were created using Photoshop.

Challenges I ran into

This was our first time using Chrome extensions and significant web dev, and we struggled with managing scope and interactivity in the extension. Though we’ve worked with Google Cloud before, we had previously relied on the client libraries, so switching to REST calls proved a challenge. We also spent significant effort on the design and UI of our application, wrangling with hostile CSS and formatting.

Accomplishments that I'm proud of

We're proud of our application and the emphasis we put on functionality and UI design. We believe we've delivered a functioning and sleek product under time pressure. Most importantly, we've expanded our own knowledge on many aspects of web dev.

What I learned

We learned a lot about REST API calls, the elements of UI design, and HTML/CSS pages. Our understanding of working with the DOM increased with some hitches, and we've discovered many ways to make buttons in HTML.

What's next for Coral

We think Coral has great potential for future improvement, including adding features such as word pronunciation, full sentence translation, and additional testing and review tools.