DEV Community

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

Posted on • Originally published at developers.deepgram.com

10 2

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.

Image of Datadog

The Essential Toolkit for Front-end Developers

Take a user-centric approach to front-end monitoring that evolves alongside increasingly complex frameworks and single-page applications.

Get The Kit

Top comments (0)

Billboard image

The Next Generation Developer Platform

Coherence is the first Platform-as-a-Service you can control. Unlike "black-box" platforms that are opinionated about the infra you can deploy, Coherence is powered by CNC, the open-source IaC framework, which offers limitless customization.

Learn more