Browser game starter
@gameforge/browser-game-starter
Turn a one-line game idea into a complete, playable single-file HTML5 canvas game: game loop, keyboard and touch input, score, best score, game over, and restart. Ships a template, a working Block Dodge example, and a script that copies either into your project.
- Activity
- New: be the first to try it
- Installs
- 0 installs
- Likes
- 0 likes
- Clones
- 0 clones
How this works
- It is a skill: written instructions Claude reads when your request matches what the skill is for. You do not call it by name; just ask for the task.
- While it works, it reads and changes files in the places it lists, nowhere else.
- It runs these commands on your computer: node scripts/new-game.mjs.
- Nothing runs until you choose to use it, and you can remove it any time.
SKILL.md
Browser game starter
Takes a one-line idea ("dodge falling blocks", "catch stars, avoid meteors") and leaves the user with one HTML file they can open in any browser, on desktop or phone, and play. No build step, no dependencies.
Inputs
Ask for anything missing, in one message:
- The idea in one line. If it is vague, propose a concrete version ("You move a paddle left and right; yellow things are points, red things end the run. OK?").
- Title (default: make one up from the idea, two or three words).
- Controls: the template does left and right movement with arrows, A and D, mouse drag, and touch drag. Ask only if the idea clearly needs something else (jump, aim, tap to flap).
Steps
Copy the template into the project:
node scripts/new-game.mjs --title "Star Catcher" --idea "catch stars, dodge meteors" --out game/index.htmlThe script refuses to overwrite an existing file. Ask the user before adding
--force. To show a finished example first, copy Block Dodge:node scripts/new-game.mjs --from example --out game/dodge.html.Read
game/index.htmland shape it to the idea. The file has six labeled sections; change them in this order:CONFIG: speeds, sizes, spawn rate, difficulty ramp. Most ideas are 60% config.STATEandreset(): add any new fields (lives, combo, level, timer).INPUT: keep keyboard, pointer, and touch in sync. Every action needs a touch version (tap, drag, or an on-screen button drawn on the canvas).UPDATE: movement, spawning, collisions, scoring. Usedt(seconds) for every motion so speed is the same at 60 and 120 fps.DRAW: shapes and colors only (no image files), so the game stays one file.LOOP: leave as is.dtis capped at 0.05 so a background tab does not teleport things.
- Keep the guarantees. The finished game must still have: a title screen, a way to lose, a score, a saved best score, restart with Space, Enter, click, or tap, and no console errors.
- Check it by reading: every new state field is reset in
reset(), every key action has a touch equivalent, nothing uses a fixed per-frame step instead ofdt. - Tell the user how to play it: open
game/index.htmlin a browser, or serve the folder with any static server to try it on a phone on the same Wi-Fi.
Output
Made game/index.html: "Star Catcher"
- Goal: catch yellow stars, avoid red meteors. Speeds up with every point.
- Controls: arrows or A/D, drag on touch screens. Space or tap to start and restart.
- Tune it: CONFIG.fallSpeed (difficulty), CONFIG.hazardChance (how mean), CONFIG.spawnEvery (busyness).
- Next ideas: lives instead of one-hit, a combo multiplier, a juice pass (shake, particles, sound).Guardrails
- One HTML file, no external scripts, fonts, images, or network calls. If the user wants assets, explain the tradeoff and ask first.
- Write only inside
game/. Never overwrite a file without the user's yes. - Keep
localStoragereads and writes in try/catch (private windows block it). - Small scope first: get the core loop fun before adding menus, levels, or sound. Offer those as next steps.
README.md
Browser game starter
Give it a one-line idea and get back a complete game in a single HTML file: game loop, keyboard and touch controls, score, best score, game over, and restart. It opens in any browser and plays on a phone, with no build step and no dependencies.
Who it is for: game jammers, teachers, parents making something with their kids, and anyone who wants a playable prototype in minutes instead of an evening of boilerplate.
Example
You say:
Make me a game where you catch stars and dodge meteors. Call it Star Catcher.
You get game/index.html. Open it in a browser: yellow stars and red meteors fall, you slide left and right (arrows, A and D, or drag on a phone), stars score points, a meteor ends the run, and your best score is remembered. Claude also tells you which three numbers in CONFIG to change to make it easier or harder.
Want to see a finished one first? The kit ships examples/block-dodge.html, a dodge-the-falling-blocks game with screen shake and particles.
What it can access
- Runs its own script,
node scripts/new-game.mjs, which copies the template into your project. - Reads and writes files in
game/only. - No network, no env vars, no accounts.
Setup
None. Needs Node.js 18 or newer to run the copy script.
Files
- README.md
- SKILL.md
- examples/block-dodge.html
- kit.json
- scripts/new-game.mjs
- templates/game.html
Did it work?
0worked for them0did not work
Sign in to say whether it worked for you.
Nobody has said yet. Tried it? Tell the next person.
