# Shadev Games — Case Study

> Shadev Games is a free browser-game portal with eight original HTML5 games across puzzle, card, word, arcade, sports, casual and strategy play. Every game runs in the browser with no download and no account, and the whole site is served as static files from Cloudflare.

Canonical page: https://shadev-tech.com/projects/shadev-games
Author: Shafin Ahmed, Full-Stack Software Engineer (https://shadev-tech.com)
Client: none — personal product by Shafin Ahmed
Timeline: 2026
Role: Full-Stack Engineer & Game Developer
Published: 2026-11-02 · Updated: 2026-11-02
Live site: https://games.shadev-tech.com/

## Key takeaways
- Shadev Games publishes eight original HTML5 games built in Phaser 4 and TypeScript, each one playable in the browser with no download and no account.
- Shadev Games runs entirely on Cloudflare Workers static assets with no Worker script, and its build fails if the output breaks the free plan's file-count or file-size limits.
- Every Shadev Games title reaches ads and saves only through one shared game SDK, so the ad-placement rules live in one package instead of in each game.

## Key figures
- 8 — original games
- 7 — game categories
- 100 — Lighthouse desktop accessibility and SEO at launch
- 150 px — minimum gap between a display ad and the game frame

## The problem
A portal of small browser games has to ship many games without each one rebuilding ads, saves and page SEO, and it has to follow ad-placement policy: no ad over the game, interstitials only at natural breaks. Hosting had to fit the Cloudflare free plan, and every game had to be original, with no clone or reskin of an existing title and every shipped asset licensed.

## The approach
The portal is a Next.js 16 static export: a game catalog, category pages, policy and contact pages, and one page per game with about, how to play, controls, tips and FAQ sections. Each game is a standalone Phaser 4, TypeScript and Vite project in a pnpm workspace, built and copied to /play/<slug>/ and loaded into an iframe behind a click-to-play facade, so a game page does not download the game until the visitor presses Play. Ads and saves go through one package, @wg/game-sdk, which wraps the AdSense H5 Ad Placement API for interstitials at natural breaks and stores versioned saves. The build chains a config check, a typecheck, the game builds, a parity check between each game folder and its catalog entry, the Next build, and a budget check against the Cloudflare free plan. Indexing is gated: robots, meta robots and the sitemap open only on a production build, while the staging host and the /play/ documents stay noindex. The portal is cloned from a reusable starter repo, so later portals inherit fixes with a git pull.

## What it does
- Eight original games: Cipher Safe (code breaking), Fan Fifteens (solitaire where cards from fan ends add up to 15), Edgeless Words (word search on a grid that wraps around), Tattergrip (one-button rope swing), Gyre Blocks (block puzzle whose board turns a quarter turn every third piece), Draft Putt (mini golf where you place two obstacles before you putt), Brackish Bay (idle tidal salt farm) and Gloamwatch (tower defense with lantern beams)
- Seven categories: puzzle, card, word, arcade, sports, casual and strategy
- Each game a standalone Phaser 4, TypeScript and Vite project with its own Vitest tests
- Click-to-play facade: the game iframe at /play/<slug>/ loads only after the visitor presses Play
- Shared @wg/game-sdk for ads through the AdSense H5 Ad Placement API and for versioned saves
- Display ad units with reserved height, at least 150 px from the game frame and never over it
- Sound effects generated in code with ZzFX; every shipped asset logged with its source and license in the game's ASSETS.md
- Game pages with about, how to play, controls, tips and FAQ sections, and VideoGame plus WebApplication structured data
- Sitemap, robots and llms.txt, with indexing gated to the production build and the staging host always noindex
- Build-time budget check against the Cloudflare free plan's file-count and file-size limits
- Light and dark themes that follow the OS setting, with a toggle
- No accounts and no sign-up to play

## Stack
Phaser 4, TypeScript, Next.js 16, Vite, Cloudflare Workers, Tailwind CSS v4, Vitest, Jest

## Outcome
- Live at games.shadev-tech.com with all eight games, released in November 2026
- Launch check: Lighthouse desktop accessibility 100 and SEO 100 on the home page and a game page, with CLS 0
- No horizontal scroll on a game page at 390 × 844 in portrait or landscape
- Adding a game is one game folder and one catalog entry; the build fails if the two do not match

## Frequently asked questions
### What is Shadev Games?
Shadev Games is a free browser-game portal at games.shadev-tech.com with eight original HTML5 games. Every game runs in the browser with no download, no sign-up and no account.

### Which games are on Shadev Games?
Shadev Games has eight games: Cipher Safe, a code-breaking puzzle; Fan Fifteens, a solitaire where cards from fan ends add up to 15; Edgeless Words, a word search on a grid that wraps around; Tattergrip, a one-button rope swing game; Gyre Blocks, a block puzzle whose board turns a quarter turn every third piece; Draft Putt, mini golf where you place two obstacles before you putt; Brackish Bay, an idle game about a tidal salt farm; and Gloamwatch, a tower defense game played with lantern beams.

### How does Shadev Games run on the Cloudflare free plan?
Shadev Games is a Next.js static export served from Cloudflare Workers static assets with no Worker script, and Cloudflare does not charge for static asset requests. A build-time check fails the build if the output breaks the free plan's file-count or file-size limits.

### How do the games on Shadev Games handle ads?
Games reach ads only through one shared package, @wg/game-sdk, which uses the AdSense H5 Ad Placement API and shows interstitials only at natural breaks. Display ad units on the portal reserve their height and sit at least 150 px from the game frame, never over it.

### What was Shafin Ahmed's role on Shadev Games?
Shafin Ahmed designed, built and deployed Shadev Games: the eight games in Phaser 4 and TypeScript, the shared game SDK, the Next.js portal and its SEO, the reusable starter repo it was cloned from, and the Cloudflare deployment.

## Sources
- Shadev Games — Shadev Games — https://games.shadev-tech.com/
- Ad Placement API — Google for Developers — https://developers.google.com/ad-placement
- Static Assets: Billing and limitations — Cloudflare Docs — https://developers.cloudflare.com/workers/static-assets/billing-and-limitations/

---
Full project index: https://shadev-tech.com/llms.txt