Reading Roll Quest – Free Interactive Phonics HTML Game for ESL/EFL Classrooms

Play it here > https://teacherkhen.github.io/phonicsreading/

Reading Roll Quest is a fully interactive classroom-based phonics and reading game designed for ESL/EFL learners. It combines dice rolling, word recognition, teamwork, and competitive gameplay into one dynamic HTML tool that runs directly in the browser. This post will guide you through how to use the game step-by-step, explain all features and buttons, and provide customization prompts so you can easily adapt it for your own classroom needs.

PART 1: HOW TO PLAY AND USE THE GAME (FULL GUIDE)

🎯 1. Starting the Game

When you open the game, you will first see a board selection screen. You must choose between two game modes:

🕹️ Board Style 1 – Connect 3 Mode
- Players compete to connect three claimed boxes in a row (horizontal, vertical, or diagonal).
- Best for spelling, phonics recognition, and accuracy-based gameplay.
🏆 Board Style 2 – Trophy Race Mode
- Teams race across rows from left to right.
- Both teams can share boxes, but only the fastest team to complete a row can claim the trophy.
- Best for fluency and speed reading activities.

After selecting a mode, the game will show a How to Play screen. Press “Start Game” to begin.

🎲 2. Dice Button (Main Game Action)

Click the dice to roll a random number (1–6).
The dice animation will spin before revealing the result.
The dice result helps guide gameplay (used as a reference for rows or movement depending on mode).
Sound effects will play when enabled.

📖 3. Reading and Claiming Words

When it is your turn, click a box after rolling the dice.
Students must read the word aloud before claiming it.
In Board Style 1, the box becomes permanently assigned to your team.
In Board Style 2, both teams can share the same box.

Color Indicators:

🔵 Blue = Team 1
🔴 Red = Team 2

🏆 4. Scoring System

Board Style 1: Connect 3 boxes in a line to earn points.
Board Style 2: Complete a full row and tap the trophy icon first.
Confetti animation appears every time a team scores.

⚙️ 5. Settings Button

Add or edit classroom words (1 word per line)
Turn background music ON/OFF
Adjust volume slider
Export game data (save progress)
Import game data (load saved game)

⏱️ 6. Timer Button

Add or subtract time (+/- 1 or 10 minutes)
Start, pause, resume, or reset timer
When time ends, the game automatically shows final scores

🔀 7. Shuffle Button

Randomizes all words on the board for replayability and practice variation.

🔄 8. Reset Button

Clears scores
Resets board
Removes claims
Restarts game selection

⛶ 9. Fullscreen Button

Expands the game for smart boards, projectors, or classroom displays.

🎉 10. Winning Screen

Final scores are displayed
Winning team is announced
Confetti animation plays automatically

PART 2: CUSTOMIZATION PROMPTS

📚 Vocabulary Customization

Replace all words with Grade 1 CVC words (cat, dog, pen, sun).
Change vocabulary theme to animals, food, or classroom objects.
Increase difficulty for Grade 6 with long vowel and sight words.

🎮 Gameplay Customization

Make the game faster by reducing timer to 30 seconds.
Change board size to 8x8 for advanced learners.
Disable trophy mode and only use Connect 3 mode.

🏫 Classroom Adaptation

Rename Team Blue and Team Red to Group A and Group B.
Add instructions for ESL beginners in simple English.
Make the game suitable for kindergarten phonics review.

🔊 Audio and Visual Adjustments

Turn off background music by default.
Increase confetti animation frequency when scoring.
Change game theme colors to green classroom theme.

📊 Assessment Use

Track how many words each student correctly reads.
Add score export feature for teacher records.
Make the game suitable for formative assessment.

FINAL NOTE: This interactive phonics game is designed to make reading practice more engaging, competitive, and meaningful. It works across laptops, tablets, and smart boards and is fully customizable for different grade levels.