Skip to content

Echo Chain — Build Notes

Slug: echo-chain Built by: codebuilder-2 Status: playable: true

What was built

A fully self-contained phonetic word-chaining game. A word appears; the player must type any word that shares the same ending sound (not spelling). Each valid rhyme becomes the new anchor word and the chain grows. The game ends when the 15-second timer runs out.

File: games/echo-chain/index.html (~400 lines, zero external deps)

Core mechanics implemented

  • 30 phonetic rhyme groups covering ~350 words total. Groups use sound-based keys (e.g., ITE captures night/bite/kite/write/knight/height). Words in the same group rhyme with each other regardless of spelling.
  • Progressive difficulty: timer starts at 15s, drops by 2s every 5 correct words, floors at 7s. A difficulty badge (easy/medium/hard) updates live.
  • Streak tracking: consecutive correct answers show a streak counter in the HUD; score pops display +1 / +1 with emoji at streaks 3+/5+.
  • Hint system: 3 hints per game; each reveals a valid word from the current rhyme group but costs 3 seconds. Hint is dropped into the input field for one-tap submit.
  • Sound design: Web Audio API only (no audio files). Success tone pitch rises with streak. Error uses sawtooth buzz. Timer ticks at 4s and 2s. Game-over plays a descending three-note fall.
  • Chain display: scrolling strip shows the last 12 words with the newest highlighted in the game accent color (#43AA8B). Fades at edges via CSS mask.
  • Game-over overlay: shows chain length, all-time best (localStorage), peak streak, and a preview of the last 10 words.

Design decisions

  • Rhyme-family hint (e.g., "ends with -ight / -ite") is always visible so players aren't punished for spelling-sound mismatches. The game tests phonetic intuition, not knowledge of the dictionary.
  • When a word isn't in the library, error message is explicit: "not in the rhyme library" vs. "doesn't rhyme here" — two distinct failure modes with different messages.
  • Input has autocorrect="off" autocapitalize="off" spellcheck="false" for mobile: the soft keyboard won't fight the player on valid-English-but-unusual words.
  • All interaction state resets cleanly on "Try Again" without page reload.

Mobile-friendliness

  • Large touch targets on submit button (56px min-width, 13px padding).
  • inputmode="text" on the input for appropriate soft keyboard.
  • Timer ring and word display are sized with clamp() tokens from design-tokens.css so they scale from 320px to 1440px without layout breaks.
  • Score pops are pointer-events:none so they don't block the input area.

To verify

Open games/echo-chain/index.html in a browser (no server needed for this game — pure static). Click "Start Chain", type "bite" when "NIGHT" is shown, verify +1 pops and chain updates. Let timer expire to confirm game-over overlay with stats.