GAME BUILDER
Turn an idea into a working game without guessing what code to write.
The game sentence
Force your idea into this sentence:
Example: The player moves around a cave. They must collect 5 diamonds while avoiding a bomb. They win at 5 diamonds. They lose if they touch the bomb.
Step 1 — Find the objects
Every noun that matters is probably an HTML object.
Player collects diamonds and avoids a bomb.
playerdiamondbombscoreTextgame
If an object must move, be touched, disappear, or change, give it an id.
Step 2 — Turn rules into WHEN → THEN
This is the most important skill in game coding.
THEN score +1
THEN diamond moves somewhere new
THEN show “GAME OVER”
THEN show “YOU WIN”
ALWAYS keep player inside game
Step 3 — Write pseudocode
Pseudocode is not fancy English. It is the game rules in code order.
score starts at 0
arrow keys move player
WHEN a key is pressed:
keep player inside game
IF player touches diamond:
add 1 to score
move diamond somewhere random
IF player touches bomb:
say GAME OVER
IF score is 5 or more:
say YOU WIN
Step 4 — Translate wishes into library tools
arrow keys to move something
moveWithKeys()
to know if two things hit
touching()
to add/subtract score, health or lives
changeNumber()
an object to jump somewhere random
randomPosition()
to stop player leaving the game
keepInside()
to change a message
setText()
something to disappear / appear
hide() show()
something to chase another thing
moveToward()
Worked example — watch the translation
Rule
WHEN player touches diamond → add 1 → move diamond.
Pseudocode
IF player touches diamond:
score goes up 1
diamond moves randomly
Code
if (touching(player, diamond)) {
score = changeNumber(score, 1, scoreText);
randomPosition(diamond, game);
}
Now remove the stabilisers
Rule and pseudocode are given. You choose the library function and write the code.
Game sentence is given. You write WHEN → THEN rules, pseudocode, tools and code.
You invent the sentence and do the whole process.
Do not move every student to the same level at the same time. A slower student can still finish an independent game by staying longer on Level A/B.
Practice 1 — finish the translation
Game: Collect stars. Each star is worth 1 point and jumps somewhere new.
Rule: WHEN player touches star → score +1 → move star randomly.
if (__________(player, star)) {
score = __________(score, 1, scoreText);
__________(star, game);
}
Check
if (touching(player, star)) {
score = changeNumber(score, 1, scoreText);
randomPosition(star, game);
}Practice 2 — write the pseudocode first
Game: A robot gets a key. The key disappears. Then touching the door wins.
Objects: robotkeydoormessage
Write 2 WHEN → THEN rules on paper. Then write pseudocode. Only then open the hint.
Possible pseudocode
hasKey starts false
IF robot touches key:
hasKey becomes true
hide key
IF robot touches door AND hasKey is true:
say YOU ESCAPEDPossible code
let hasKey = false;
if (touching(robot, key)) {
hasKey = true;
hide(key);
}
if (touching(robot, door) && hasKey === true) {
setText(message, "YOU ESCAPED!");
}Practice 3 — one sentence only
Game sentence: The player collects 10 coins while an enemy chases them. Touching the enemy loses. Reaching 10 coins wins.
- Circle the objects.
- Write every WHEN → THEN rule.
- Write pseudocode.
- Circle the library tools you need.
- Build the smallest version.
- Test ONE rule at a time.
Your own game — MVP card
My game sentence:
Objects I need: _________________________________________________
Rule 1 — WHEN: ____________________ THEN: ____________________
Rule 2 — WHEN: ____________________ THEN: ____________________
Rule 3 — WHEN: ____________________ THEN: ____________________
I need these library tools: _____________________________________
Debug without panic
- What exact rule is broken? Do not say “my game doesn't work.”
- Does the object exist? Check the
id. - Does that rule ever run? Add
console.log("rule ran"). - Does the IF become true? Log
touching(player, coin). - Change one thing, test again.