Princeton Tower Defense

A full-featured tower defense game set on Princeton-inspired battlefields, built entirely in the browser with React, Canvas 2D, and Next.js. No engine. No sprite sheets. Hand-rolled renderer.

• Repo: https://github.com/Kevin-Liu-01/Princeton-Tower-Defense
• Live: https://www.ptd.quest
• Tagline: "Defend the campus. Command heroes. Master the arcane."
• GitHub signal: public TypeScript repo, 10 stars, 2 forks, pinned on Kevin's GitHub profile as of 2026-06-25. Source: raw/github/kevin-repos-2026-06-25.json; raw/github/kevin-pinned-repos-2026-06-25.json

What It Is

A browser tower defense game with 26 campaign + challenge levels across 5 biome regions (grassland, swamp, desert, winter, volcanic), 7 campus-themed towers with branching upgrades, 9 heroes, 6 spells, 100+ enemy types, a sandbox mode, and a custom level creator. The entire rendering pipeline is procedural Canvas 2D - no sprite sheets, no commercial game engine.

Kevin built it at Princeton and reports that it went viral on Fizz, making it part of a campus-game arc with PawPointClicker and Lootbox Simulator. The public evidence is the repo/deployment/build-in-public trail; the Fizz distribution is user-sourced because Fizz is not publicly indexable. Source: User request, 2026-06-25; raw/github/deployment-check-2026-06-25.tsv

Content Scale

Princeton Theming

Tower and hero names map to campus culture: Nassau, Firestone, Blair, E-Quad, Eating Club, Dinky, Palmer. Level names reference real locations: Poe Field, Carnegie Lake, Nassau Hall, Frist Outpost. The rendering module princetonBuildings.ts procedurally draws 15+ named campus buildings - Princeton Chapel, Firestone Library, Blair Arch, Whig Hall, East Pyne, Prospect House, Clio Hall, McCosh Hall, Robertson Hall, Holder Hall, Cleveland Tower, Alexander Hall, Fine Hall, Foulke Hall, Tiger Stadium. Source: User, 2026-04-22

Rendering Architecture

Entire pipeline is procedural Canvas 2D with layer caching and adaptive quality:

• Offscreen caches for static terrain, paths, and decorations
• Separate fog/atmosphere layer
• Dynamic entity layer for towers, enemies, projectiles, particles
• Quality scaling (high/medium/low) triggered by frame drops
• Cached getBoundingClientRect to avoid layout thrashing on pointer/zoom
• Isometric-style grid with batched strokes, integer-rounded positions, gradient caching

Notable scale: updateGame.ts exceeds 5k lines, renderDecorationItem.ts exceeds 33k lines - unusual for a browser TD. Source: User, 2026-04-22

Artifact Review Notes

The day 1 artifact shows the early proof that the browser runtime could carry a real isometric tower-defense surface: a hand-rendered path, fogged battlefield, campus-themed towers, selected hero, spell buttons, wave timer, currency/lives HUD, and camera controls. The self-reply frames the target correctly: make it feel like a game system, not a canvas experiment. Source: X/@kevskgs and local image review, 2026-07-04

The day 2 artifact shows the combat-vocabulary expansion: a darker isometric battlefield with visible tower fire, projectiles, particle effects, a selected Engineer hero, 50 PP, 20 lives, wave 1/8, next-wave timer, tower tray, spell tray, and camera controls. The durable lesson is that adding heroes and particles multiplies simulation state immediately: more projectile/effect cases, more transitions, and more visual observability pressure on the Canvas layer. Source: X/@kevskgs and local image review, 2026-07-04

The day 3 artifact shows the first content-pressure test. The screenshot has a selected Mathey Knight, 213 PP, 15 lives, wave 9/10, visible tower and spell trays, speed/camera controls, and a swamp battlefield with enough hazards, lanes, towers, and enemies that the information architecture has to keep up with the content spike. The durable lesson is the line in the post: content velocity only helps if the game surface can still explain what changed. Source: X/@kevskgs and local image review, 2026-07-04

The day 4 artifact shows the game becoming strategically alive: special buildings sit near the path, tower clusters have buff/hazard context, enemies and a selected Captain are readable in the lane, and the HUD exposes wave, speed, pause, camera controls, tower tray, spell tray, lives, and currency. The self-reply names the durable product turn: mobile compatibility and actual playability arrived once hazards, buffs, path logic, and movement fixes were visible in the same surface. Source: X/@kevskgs and local image review, 2026-07-04

The day 5 artifact is the shell-trust turn. The HUD/menu pass makes the project look shipped instead of like an internal dev build: top and bottom chrome are clearer, desktop/mobile controls are both present, selected Tenor state is readable, starting resources are less noisy, and the battlefield carries more authored image detail. The reusable product rule is that a game's shell is the first contract the player signs before they trust the simulation. Source: X/@kevskgs and local image review, 2026-07-04

The day 6 artifact bridges shell polish into rendering-system cleanup. The reviewed swamp map shows denser environmental landmarks, hazards, water/terrain detail, a selected Princeton Tiger, readable tower/enemy state, buff indicators, tower and spell trays, and speed controls that expose slow/pause/play states. The self-thread adds the implementation clue: tower decorations, landmarks, hazards, and Catmull-Rom path generation were cleaned up together, so the visible polish came from renderer and map-system work, not a skin pass. Source: X/@kevskgs and local image review, 2026-07-04

The day 7 artifact shows the project after the readability pass: a denser winter battlefield with many tower types, hero and troop overlays, visible buff/healing/status indicators, selected-unit details, tower build tray, spell tray, speed controls, and camera controls. The reusable lesson is observability before polish: tower-defense UI needs visible state transitions before it needs prettier chrome. Source: X/@kevskgs and local image review, 2026-07-04

Stack

• Next.js 16.2.0, React 19
• TypeScript, Tailwind CSS
• Canvas 2D (hand-rolled, no game engine)
• Ultracite (oxlint, oxfmt)
• Framer Motion (UI), rAF game loop with delta time
• Vercel (hosting + analytics)
• localStorage for state persistence

Build in Public

The PTD dev diary ran 31 days on X (days 25-31 documented in Content Plan Archive, April–May 2026). Key lines from the series: "Great game UI is a compression codec for chaos." "A lot of canvas performance is just having the courage to not repaint things." "No engine. No hand-wavy abstraction layer. Just a hand-rolled renderer forcing the browser to do real labor." The Nicky QA format (filming Nicky He playing the game) produced two high-engagement posts and is repeatable with new content. Source: User, 2026-04-22

---

Timeline

• 2026-07-04 | Deep-reviewed the day 2 X artifact. It preserved the combat-vocabulary expansion: effects, particles, two new heroes, selected Engineer state, and the first clear jump in projectile/effect simulation surface. Source: X/@kevskgs, 2026-03-14
• 2026-07-04 | Deep-reviewed the day 3, day 5, and day 6 X artifacts. Day 3 preserved the content/information-architecture pressure point; day 5 preserved the shell-design trust turn; day 6 preserved the rendering/map-system cleanup bridge into the day 7 readability pass. Source: X/@kevskgs, 2026-03-15; Source: X/@kevskgs, 2026-03-17; Source: X/@kevskgs, 2026-03-18
• 2026-07-04 | Deep-reviewed the day 4 X artifact. The artifact preserves the transition from renderer proof to playable strategy surface: special buildings, hazards, buff context, path fixes, mobile compatibility, and visible control trays. Source: X/@kevskgs, 2026-03-16
• 2026-07-04 | Deep-reviewed the day 1 and day 7 X artifacts. Day 1 preserved the "browser as runtime" proof; day 7 preserved the observability/readability pass with stackable buffs, unit/tower state, and visible healing. Source: X/@kevskgs, 2026-03-14; Source: X/@kevskgs, 2026-03-19
• 2026-03 | 31-day dev diary series on X. Game shipped and live. Source: User, 2026-04-22
• 2026-03 → 2026-05 | 655 Cursor agent sessions across 2+ months of continuous development. Most intense browser game build Kevin has done - the conversation history alone constitutes a complete development log of procedural Canvas 2D engineering at scale. Source: Cursor transcripts, 2026-03 to 2026-05
• 2026-03-05 | Early rendering work: world map terrain textures overhauled for immersion, regional environmental ambience overlays added, rock variations (3 per region), ruins in lava levels. Source: Cursor transcript, 2026-03-05
• 2026-03-17 | World map fixes: fit to frame container height (horizontal-only scroll), vertical centering of paths/nodes, level indicators redesigned with heraldic flags, swallowtail banners, and shield-shaped difficulty badges. Source: Cursor transcript, 2026-03-17
• 2026-03-18 → 03-19 | Build-in-public days 6-7 posted on X. Day 6: giant gameplay/rendering cleanup — maps overhauled, fog/pause/timer bugs fixed, hero/enemy systems multi-pass, large files refactored, towers + spells rebuilt, Catmull-Rom path generation for randomness. Day 7 ("readability day"): tooltips/modals overhauled, stackable buffs, Codex + engineer turret logic improved, mobile selection/hit-testing refined, troop movement indicators + visible healing rewritten. Source: X/@kevskgs, 2026-03-18; Source: X/@kevskgs, 2026-03-19
• 2026-03-22 | Landing page components overhauled: carousels, bestiary, hero/tower showcases redesigned for better visual quality. Source: Cursor transcript, 2026-03-22
• 2026-03-23 | Dinky Station trains overhauled with 3D/isometric styling. Challenge level map paths made more curvy and varied. Path endpoints extended for visual flow. Source: Cursor transcript, 2026-03-23
• 2026-03-26 | Hero icons replaced emojis with Lucide icons throughout. Hero animations improved (F. Scott armored skirt, writing→attack transition). Tower terrain transitions changed from circles to organic blob shapes. Source: Cursor transcript, 2026-03-26
• 2026-04 | Per-level shareable URLs (/[level]) with SEO/GEO using level preview images. Unlocking gating: beating a level via direct URL doesn't grant campaign credit if player hasn't reached it yet. Photo mode: dev config places towers strategically for screenshots. Source: Cursor transcript, 2026-04
• 2026-04 | Performance: loading screen transition optimized (immediate switch when loading line completes). Settings restart UX improved (avoid returning to world map). Mortar impact explosions refactored to use drawOrganicBlob for better performance. Source: Cursor transcript, 2026-04
• 2026-04 | Effects/projectiles regression fixed after massive code refactor. Paths improved with zoom-scaling pebbles. Pause overlay with big pause button added. Source: Cursor transcript, 2026-04
• 2026-04-22 | Wiki page created. Post-launch development ongoing: new levels, enemies, towers, sandbox mode. Source: User, 2026-04-22
• 2026-04-28 | Domain purchased: ptd.quest. Twitter OpenGraph fixed. Source: Cursor transcript, 2026-04-28
• 2026-06-25 | Repo/live metadata refreshed to Kevin-Liu-01/Princeton-Tower-Defense and https://www.ptd.quest; Kevin added that Princeton TD was made at Princeton and went viral on Fizz. Source: raw/github/kevin-repos-2026-06-25.json; raw/github/deployment-check-2026-06-25.tsv; User request, 2026-06-25