Erwin's Survival

• 

  Game Overview

• 

  Day time resource collection by player

• 

  Dusk time base defenses setup by external ai agent using webMCP

• 

  Night time base defense from red slime enemies.

• 

  Game win screen

• 

  Game lost screen when Erwin's health drops to zero

Inspiration

• Every WebMCP demo we saw was a dashboard or a form filler.
• We wanted to build something where the AI had to act, not just read.
• A survival game where the human explores and the AI plans defenses felt right.
• The first version had the AI doing everything through WebMCP tools (gather water, eat food, chop wood).
• That was boring. Typing "gather water" to an AI when a key press does the same thing is unnecessary friction.
• We pivoted so the AI only acts at dusk, for defense planning.

What it does

A browser survival game with two players: a human and an external AI agent. They cooperate through WebMCP tools.

Three game phases, repeating for 3 days:

Phase	Who acts	What happens
Morning	Human (keyboard)	Cut jungle, collect wood/stone/rope/herbs/berries/water, make medicine, build base.
Dusk	AI agent (WebMCP)	Read threat intel, place spike traps, barricades, fires around the base.
Night	Human (keyboard)	Aim bow, fire arrows at incoming slimes, repair barricades.

Win condition: Survive 3 nights. Base still standing.

Lose condition: Base destroyed (night) or health hits 0 (morning).

WebMCP tools exposed:

Tool	When available	What it does
get_game_state	Always	Returns health, inventory, position, defenses, phase
get_planning_context	Dusk only	Returns expected monsters, defense options with costs
place_spike_trap({side})	Dusk only	2 wood + 1 stone. Kills up to 2 slimes. One use.
build_barricade({side})	Dusk only	3 wood. Blocks slimes. 3 durability. Survives across nights.
set_fire({side})	Dusk only	1 wood + 1 herbs. Kills 1 slime per wave. Lasts 1 night.

Tools auto register at dusk and auto unregister when night falls. The AI must act within a 90-second window to plan base defense during dusk.

Example scenario: The AI reads get_planning_context, sees "Night 1, 4 slimes expected from 2 sides," then calls place_spike_trap and build_barricade with {side: "north"} or {side: "south"}. Each call costs resources and updates the game map live.

The first night has 4 slimes, second has 6 and third night having 9. Each dusk, the AI replans before night falls.

Why WebMCP

Why this use case fits WebMCP: The dusk phase is a planning problem with multiple variables: 4 sides to defend, 3 defense types, limited resources, player health and a different number of enemies each night. A player with keyboard cannot solve that in 90 seconds but if they use Natural Language with an external AI agent - the possibilities start to open up. WebMCP lets the game expose the board as challenges to overcome via tools, and any external AI agent can pick them up.

How it creates a better user experience: Without the AI, the player would need a separate UI for defense placement: dropdown menus for side selection, buttons for each defense type, a cost calculator all on top of a ticking time countdown. With WebMCP, the player says "plan the defense" or "gives a short braindump of the defense" and the AI handles all of it. The game becomes one where the player and external ai agent are dependent on one another.

What was impossible before: A browser game could not hand off a planning decision to an external AI mid-session. The AI had no way to read game state or call game functions. WebMCP added that channel. Now the game exposes get_planning_context and the AI reads it, decides, and acts, all within the same browser tab the player is using.

How we built it

• Solo build over 3 days (Sept 1-3, 2026).
• Vanilla JS + HTML Canvas + Vite.
• No React or other frameworks used. Direct registerTool() / unregisterTool() calls.
• Deployed on Vercel as a single page site. There is no backend.
• Feature detection for both ChatGPT and Chrome: navigator.modelContext ?? document.modelContext.
• Tested with Chrome 152 WebMCP flag + Model Context Tool Inspector extension from Chrome Web Store (offered by François Beaufort).

Day 1: Nailed the project requirements, architecture, full game loop (move, health decay, fog of war, inventory, win/lose).

Day 2: The pivot to dropping AI-driven resource gathering and addition of morning/dusk/night phases. The external AI agent comes in during dusk time.

Day 3: Defense WebMCP tools, night combat with animated slimes, arrows, bow sprites, visual polish (cabin, roads, defense art, pond tiles, animated jungle).

Challenges we ran into

• The first design had the AI call gather_water and eat_food via WebMCP. It worked but was also pointless since a keyboard press does the same thing faster. Scrapped on day 2.
• ChatGPT uses document.modelContext while Chrome uses navigator.modelContext. So we used a one line of feature detection.
• Spritesheets from different artists use different layouts (rows vs. columns for direction). Erwin faced north in all 4 directions until we checked the actual pixel layout. We drew red gridlines over the spritesheet to map which column was which direction. Column 0 was north, column 2 was south, and columns 1 and 3 were mirrors of each other, so we located the eye pixels to tell east from west.
• The timer variable was decremented twice per tick — once at the top of the loop and again inside the action branch. Deleting the second decrement fixed the 4-second window, but that exposed a second bug: arrows now had time to fly, and fast frames made them skip over slimes without hitting. We fixed that by moving arrows in small 0.34-tile sub-steps and testing for a hit at each one.
• Procedural map generation rules fought each other. Trails carved through jungle, then jungle rings around resources closed the trails. Fixed by ordering the generation steps.

Accomplishments that we're proud of

• The dusk phase works where the player(human) must tell the AI "plan the defense" and barricades, spike traps, and fires appear on the map as they watch.
• The game went from colored squares to pixel art with animated jungle canopy, slime enemies, a cabin, and a bow. All of this was achieved in one day. We really Locked In for this one.
• The 5 WebMCP tools with parameterized inputs, real resource costs, and phase-based registration/unregistration.
• Complete 3-day loop start to finish, playable without an AI agent via debug panel fallback.
• The pivot decision on day 2: AI plans strategy, human presses buttons. That separation made both halves better and got them to work together.

What we learned

• WebMCP is best when the AI does what a keyboard cannot. For games, this meant getting the AI to plan, in a short window, where it needs to consider multiple factors such as expected enemies, player health and inventory.
• Tool quality over tool count. 5 tools with a clear lifecycle loop where each tool has an impact.
• A bug can hide behind a feature that is too fast to expose it. Adding arrow flight time surfaced a timing bug that instant shooting never triggered
• We started with CC0 Kenney tiles (free, safe to redistribute). Two paid packs we liked said "redistribution prohibited," so we dropped them. The final mix was one free character sprite (nogardlab Stardew Farm) and three ToffeeCraft packs ($3.20 total) that allowed redistribution. Different artists, different styles, but a character always stands out from terrain, so the mismatch was not noticeable.

What's next for Erwin's Survival

• Sound effects for resource collection, defense placement, slime attacks
• Slime attack animation when they reach the barricade
• Mobile touch controls
• Procedural map generation
• Leaderboard for fastest 3-night survival
• More defense types (walls, moats)

The pattern behind the game

This game shows a co-op pattern that works beyond games.

The pattern	Game example	Real-world example
Human browses structured data	Erwin explores the jungle	A doctor reviews patient charts
AI reads state through tools	get_planning_context returns threat intel	AI reads lab results, medications, allergies
AI acts through parameterized tools	place_spike_trap({side: "north"})	AI orders a specific test or flags a drug interaction
Tools register based on context	Defense tools appear at dusk, disappear at night	Prescription tools appear when viewing a patient, disappear on the dashboard
Neither can finish alone	Human collects resources, AI places them	Doctor knows the patient, AI catches what they might miss

WebMCP makes this possible. The website exposes tools. The AI discovers and calls them. The human stays in control.

The game is the demo. The pattern is the point.

Built With

• html
• vanillajs
• vercel
• vite
• webmcp