CEMI Fútbol — Learning Guide for Teachers & Parents

Start here

CEMI Fútbol is built on one idea: learning is seasoning, never the meal. A "Nerd Engine" sprinkles real facts as flavor after a shot, a save, or an elimination — it never blocks the game. Your job as the educator is simply to notice those moments out loud.

Why it works in class or at home

Ages 8–16. The controls are one-finger simple; the ideas underneath scale from primary curiosity to secondary physics.
No install, no barriers. Runs in any modern browser — Chrome, Firefox, Safari, Edge. No plugins, no downloads.
Free and offline-capable. Once the page has loaded it keeps working without a connection, so it is fine for spotty Wi-Fi labs.
Kid-safe. No account, name, or email is ever required to play. An optional profile is stored only in the browser.
Four languages. English, Español, Français, Português — switchable at any time, which is itself a teaching tool (see Languages below).

The two games: Golden Boot (swipe-physics penalty shootouts with a 32-nation tournament) and Gorilla on the Pitch (survive-and-score against a realistic silverback). Every activity below tells you which game it uses.

Before, during & after play

You do not need to be a gamer to run these. Three light-touch habits turn play into learning.

Before

Play one round yourself. Five minutes is enough to know how a swipe becomes a shot, and how the gorilla telegraphs its charge.
Pick one subject lens. Decide today is a "physics day" or a "biology day" and choose one or two activities below — don't try to cover everything at once.
Set the language. For a languages lesson, agree on which language the group will play in, or plan to switch mid-session.

During

Read the facts out loud. When the Nerd Engine pops a line after a shot or an elimination, pause and ask "wait — is that true?" Curiosity beats correctness.
Ask for a number. Golden Boot reports your shot's speed in km/h and its energy in joules. Have students say the numbers before the next shot.
Encourage a log. A phone or a scrap of paper is enough. Several activities below are just structured observation logs.

After

Round-robin reflection. Most surprising fact, hardest moment, best goal. Thirty seconds each.
Verify one claim. Send students to check a single fact from the game against another source. Was the game right?
Extend into the code. For older or curious students, the Programming guide turns the same games into a reading-real-code lesson.

Physics · Golden Boot

Physics of the perfect shot

Golden Boot solves real ballistics for every shot. Swipe speed becomes launch speed, the swipe's end point becomes the aim on the goal plane, and a curved swipe adds spin. After the ball crosses the line, the Nerd Engine reports the actual numbers — km/h, joules, milliseconds, degrees — from games/golden-boot/shootout.js.

1 The Magnus effect: bend it like the code does

Objective: See that a spinning ball curves, and connect it to the Magnus force named in the game's facts.
Instructions: Play a Quick Match. First take five shots with a perfectly straight up-swipe. Then take five shots that hook sideways as you flick (a curved swipe). Watch the ball's flight path each time. Turn on "Loco Ball" and look for the Banana Spin effect, which multiplies the curve.
Expected result: Straight swipes fly straight; curved swipes bend in the air and can wrap around the keeper. Students should notice that curve is a separate control from power and aim. The Nerd Engine will surface the Roberto Carlos 1997 free kick — ~10 revolutions per second, curving almost 4 metres.
Extension / Teacher's note: Extension: Try the classroom demo — drop two sheets of paper, one flat and one lightly spun, and watch them fall differently. Note: in the code, spin is applied in the line B.vx += (B.spin * B.vz * 0.5 + wind * 0.8) * dt — a sideways push that grows with forward speed, exactly like the real Magnus force.

2 Launch angle: over the bar vs. into the net

Objective: Discover the trade-off between shot height (angle) and staying on target.
Instructions: Deliberately blast ten shots high over the crossbar, then ten low daisy-cutters along the ground. Read the feedback line each time. On a "wide" or "over" miss, the game reports the miss angle in degrees; on a goal it reports the flight time in milliseconds.
Expected result: Students see that a steeper launch buys height but overshoots, while a flat shot is fast but easy to save low. The sweet spot is a modest angle into a corner. They can record the reported degrees for high vs. low misses and compare.
Extension / Teacher's note: Extension: Introduce the idea that on a real (drag-free) pitch, maximum range comes from a 45° launch — then ask why a penalty is never taken at 45°. Note: the crossbar sits at exactly 2.44 m (a rule unchanged since 1866); the game measures your miss against it.

3 Energy in joules: how hard did you hit it?

Objective: Read kinetic energy off a real formula and connect faster shots to more energy.
Instructions: Score five goals and write down the km/h and joule values the game reports. A regulation ball is 0.43 kg. The game computes energy as 0.5 × 0.43 × v² (that is ½mv²). Have students confirm one value with a calculator: convert km/h to m/s (divide by 3.6), then plug in.
Expected result: A ~100 km/h shot (about 27.8 m/s) carries roughly 166 joules. Students should see energy grow with the square of speed — doubling the speed quadruples the energy. Their hand calculation should match the game's number.
Extension / Teacher's note: Extension: The Nerd Engine notes a pro penalty gives the keeper about 400 ms while a blink takes 300 ms. Ask: why does more energy make a save harder? Note: the exact line is j: Math.round(0.5 * 0.43 * v0 * v0) in games/golden-boot/shootout.js — students can read the physics straight from the source.

Biology · Gorilla on the Pitch

Gorilla biology & behavior

The gorilla in this game is not a cartoon. It knuckle-walks with real diagonal limb pairs, beats its chest as an honest warning before it charges, hunts the most isolated player like a real predator, and runs on stamina it must recover. Its behavior is a living observation subject.

4 Behavior observation log

Objective: Practice scientific observation by logging an animal's behavior states.
Instructions: One student plays; the rest are field biologists. Watch the gorilla and tally each behavior you see: patrolling (wandering), stalking (following a player), chest-beating (rearing up), charging (the fast rush), carrying a player off, and resting (tired). Note what happens just before each charge.
Expected result: Observers discover a repeating sequence: patrol → stalk → chest-beat → charge → tired. The chest-beat always precedes the charge — it is a warning, not the attack. Students learn that behavior can be broken into observable, predictable states.
Extension / Teacher's note: Extension: Compare with an ethogram — the real charts biologists use to catalog animal behaviors. Note: those states are literally the gorilla's finite state machine in games/gorilla/gorilla.js (OFF → ENTER → PATROL → STALK → CHESTBEAT → CHARGE → CARRY → TIRED).

5 Honest signals: why bluff before you charge?

Objective: Understand honest signaling — costly displays that communicate real intent.
Instructions: Focus only on the chest-beating. Count how many chest-beats happen before a charge (the game plays a burst of them). Discuss: in the wild, why would a 200 kg animal announce its attack instead of ambushing?
Expected result: Students realize the display gives everyone a chance to flee, avoiding a costly fight that could injure the gorilla too. Most real gorilla charges are bluffs — chest-beating and a short rush that stops early. The signal is "honest" because only a genuinely strong animal can afford to make it.
Extension / Teacher's note: Extension: Find other honest signals in nature (a stotting gazelle, a peacock's tail, a rattlesnake's rattle). Note: in later waves the game shortens the warning window — read setWave in games/gorilla/gorilla.js to see the telegraph time shrink as anger rises.

6 Speed & strength comparisons

Objective: Put gorilla facts into human-scale comparisons using the game's own data.
Instructions: Collect the biology facts the Nerd Engine shows between waves and turn each into a comparison. Examples to look for: silverback mass (~200 kg), arm span (~2.6 m — wider than the 2.44 m goal is tall), charge speed (up to ~40 km/h), and that gorillas share ~98% of human DNA — all while being herbivores.
Expected result: Students build a comparison chart: a silverback outweighs 2–3 adults, out-sprints Usain Bolt over a short dash, and reaches across a full goal — yet gets all that power from eating plants. The 98% DNA fact reframes "monster" into "close relative."
Extension / Teacher's note: Extension: Graph gorilla charge speed against a walking human, a sprinter, and a car in a school zone. Note: the charge speed lives in the SPD table in games/gorilla/gorilla.js as pixels per second (~40 px per metre) — students can convert it themselves.

Languages · Both games

Four languages, one game

Everything in both games is translated into English, Español, Français and Português, switchable any time. Because the same action produces the same word in every language, the game becomes a natural vocabulary machine.

7 GOAL in four tongues

Objective: Learn that the same concept has different words across languages, and notice patterns.
Instructions: Score a goal in each of the four languages, switching the language between shots. Write down the word that flashes: GOAL (en), GOL (es/pt), BUT (fr) — and note the game's fact that in German it is TOR. Say each one out loud.
Expected result: Students build a four-column word: GOAL / GOL / BUT / GOL. They notice Spanish and Portuguese share GOL, while French and English each go their own way. The Nerd Engine adds that Brazilian announcers hold the "O" in GOOOL for over 20 seconds.
Extension / Teacher's note: Extension: Have each student "commentate" a goal in a language that is not their first. Note: these words come from the shared fact pool in cemi/facts.js — the same data structure teaches vocabulary and stores the game's trivia.

8 Football idioms around the world

Objective: Explore how each football culture invents its own colorful vocabulary.
Instructions: Trigger the language facts by taking shots that miss (the Nerd Engine surfaces language trivia on misses). Look for the "nutmeg" fact: a ball played through the legs is caño (pipe) in Argentina, petit pont (little bridge) in France, and caneta (pen) in Brazil.
Expected result: Students collect a small dictionary of idioms and discover that each language pictures the same move differently. Ask them to invent an English nickname for the same trick and defend it.
Extension / Teacher's note: Extension: Research one more football-mad language (Italian, German, Arabic) and add its word for nutmeg. Note: idioms are stored with a language tag in cemi/facts.js; the game picks them by context so they feel fresh each session.

9 Play in your second language

Objective: Use immersion: navigate menus and instructions in a language you are learning.
Instructions: Set the game to a language the student is studying and play a full round without switching back. They must read the menus (PLAY / QUICK PLAY), the prompts ("SWIPE TO SHOOT"), and the fact lines in the target language.
Expected result: Students realize they can understand a lot from context even when they don't know every word — a core language-learning skill. Afterwards they list five new words they picked up.
Extension / Teacher's note: Extension: Pair a native speaker with a learner for a two-player match narrated in the target language. Note: every string lives in a four-language table (see cemi/i18n.js), so the whole interface really is fully translated, not machine-swapped on the fly.

Math & Geography · Golden Boot

Math & Geography

The 32-nation tournament is a powers-of-two machine, the flags open a world map, and the leaderboards are a statistics dataset waiting to happen.

10 Brackets are powers of two

Objective: Understand knockout brackets as repeated halving — powers of two.
Instructions: Start a World Tournament (32 nations). Before playing, have students predict how many rounds it takes to win. Then play and count: Round of 32 → Round of 16 → Quarter-finals → Semi-finals → Final.
Expected result: Students find it takes exactly 5 rounds, because 32 = 2⁵ and each round halves the field (32 → 16 → 8 → 4 → 2 → 1 champion). They can also compute total matches played across the whole tournament (31).
Extension / Teacher's note: Extension: Ask how many rounds a 64- or 128-team cup would need, then generalize to log₂(N). Note: the round names are the ordered list ROUND_KEYS in cemi/tournament.js, and the bracket starts with 32 teams in alive.

11 32 flags, 32 countries

Objective: Connect flags to countries, capitals, and continents.
Instructions: Open the nation picker and browse the 32 flags. Each flag in the game is drawn from simple shapes, not an image. For each nation a student is dealt, have them name the country, its capital, and its continent. The game also shows how many World Cups each nation has won.
Expected result: Students build a table of country / capital / continent / titles. They notice the geographic spread (South America and Europe dominate the trophy count) and can rank nations by titles.
Extension / Teacher's note: Extension: Locate all 32 nations on a blank world map and shade them by continent. Note: the nations, their names in four languages, skill ratings, and World Cup titles all live as data in cemi/nations.js — a clean dataset to read.

12 Leaderboard statistics

Objective: Practice collecting data and computing simple statistics.
Instructions: Have several students each play the Daily Challenge (a 10-shot gauntlet where corners and combos score points). Record everyone's score. Compute the mean, median, range, and mode of the class scores.
Expected result: Students produce a real dataset and its summary statistics, then discuss which measure best describes "typical" performance and how one very high score skews the mean but not the median.
Extension / Teacher's note: Extension: Because the daily challenge is the same for everyone on Earth today, compare your class median to friends elsewhere. Note: the fairness comes from a seeded RNG in cemi/challenge.js — the same date produces the same challenge worldwide.

Programming · Both games

Programming — the code is open

Both games are zero-build, readable JavaScript with learning-oriented comments. The whole engine is meant to double as a programming lesson. These three activities are a taste; the full Programming guide has a file-by-file map and a live source viewer.

13 Read the physics you just played

Objective: See that a "game feeling" is really a few lines of math.
Instructions: Open the Programming guide and click the source link for games/golden-boot/shootout.js. Find the update method and read the four lines that move the ball each frame (gravity pulls vy down, drag slows vz, spin nudges vx).
Expected result: Students recognize the exact forces they felt while playing, written as short arithmetic on the ball's velocity. "The Magnus effect" stops being a mystery and becomes one readable line.
Extension / Teacher's note: Extension: Ask "what would you change to make the ball float like it's on the Moon?" (Hint: gravity.) Note: no setup required — the source viewer fetches the real file and shows it with line numbers in a pop-up.

14 Find the state machine

Objective: Recognize a finite state machine as the "brain" behind the gorilla.
Instructions: Open games/gorilla/gorilla.js in the source viewer and find the big switch (this.state) block. Match each case (PATROL, STALK, CHESTBEAT, CHARGE, CARRY, TIRED) to a behavior you observed in Activity 4.
Expected result: Students map every behavior they watched onto a named block of code and see that "intelligence" here is just a set of rules for switching between states.
Extension / Teacher's note: Extension: Draw the state diagram as arrows between boxes — which states can lead to which? Note: the header comment of games/gorilla/gorilla.js even draws the same diagram in text.

15 Everyone gets the same day

Objective: Understand deterministic randomness — how a "random" daily challenge can be identical for everyone.
Instructions: Open cemi/challenge.js in the source viewer. Read dayKey (today's date as a string) and dailyRng (which seeds a random-number generator from that date). Discuss: if the seed is the same for everyone today, what does that guarantee?
Expected result: Students grasp that a seeded generator is repeatable: the same seed always produces the same sequence, so every player worldwide faces an identical challenge each day — fair to compare, yet different tomorrow.
Extension / Teacher's note: Extension: Ask why true randomness would make leaderboards unfair. Note: the generator is mulberry32 seeded by hashStr, both in cemi/core.js — small, readable, and reused across the whole engine.

Ready for more? The Programming guide maps every engine file to what it teaches and shows students how to clone and run the whole thing.