DEV Community

Cover image for Practice Spelling Bees with Spelling Hero
Kevin Lewis for Deepgram

Posted on • Originally published at

Practice Spelling Bees with Spelling Hero

The Scripps National Spelling Bee is America's longest-running educational competition - its primary goal being to help young people increase the size of their vocabulary through practice and a friendly competitive atmosphere. The team behind Spelling Hero wanted to simulate this great educational experience in the browser. I sat down with Judah Daniels, Leon Zhang, Saksham Shah, and Saomiyan Mathetharan to ask them about their project.

Spelling Hero is a spelling bee simulator to emulate the experience of participating in a spelling bee competition. Users select a difficulty level, and the browser speaks a word aloud. Players then have to spell out the word to complete the level.

Easy mode. Word 1 of 5 with a score of 1. The word 'answer' is in green and displayed as correct. Several buttons read start spelling, repeat word, definition, language of origin, type of word, and example of sentence.

Spelling Hero's data was manually curated in this first version, and each word also includes a definition, origin, type, and a sample sentence - all options given to spelling bee participants.

The team used the Deepgram Speech Recognition API to understand a user's voice input, basing their code on our Browser Live Transcription tutorial. The user interface was built with P5.js (see our P5.js tutorial here), and you can check out the code on GitHub.

Top comments (0)