// ONE STONE, THREE CUTS
GEM
Creative developer
& designer
Bangkok
Selected work 2025–26
About
Worlds, built from scratch. Engines, netcode, shaders — every pixel handmade, no templates.
The stone
I’m Gem — a creative developer and designer working from Bangkok. One practice, many facets: luxury web for real clients, playable worlds in the browser, and experiments at the edge of what AI-native building makes possible.
The cut
Every project starts as rough material — a brief, a reference, a feeling — and gets cut until light moves through it. Design and engineering are one gesture here: I art-direct in code, measure in frames per second, and ship things you can actually touch.
CUT 01 — Luxury charter, Chao Phraya
Legacy
Yacht
A brochure-first website for a private luxury dinner yacht on Bangkok’s Chao Phraya river — built to carry the weight of a real brand: quiet type, deep navy, brass light on black water.
The brief
Communicate the brand and its charter packages, and build trust for high-intent guests — weddings, proposals, corporate events, premium travelers. The answer was editorial restraint: seven quiet sections, generous negative space, photography first.
Bilingual by design
The site speaks English and Thai as equals — full EN/TH internationalization through next-intl, with every line of interface and content translated, not machine-swapped.
The route as interface
The two-hour river journey is the product, so it became the interface: an interactive Leaflet map traces the route past Bangkok’s riverside landmarks, alongside deck-by-deck floor-plan sliders and gallery systems for events and dining.
- EN/THFully bilingual
- 07Sections
- 44Components
- 2hRiver route, mapped
CUT 02 — Browser tactical FPS
Dust
Protocol
A playable bomb-defusal FPS in the browser — no install, no build step, one link. An unaffiliated homage to Dust2 that ships zero Valve assets: every wall, weapon and waypoint authored from scratch.
A real match, not a tech demo
Full MR12 competitive structure: buy phase, live round, plant and defuse, halftime side-swap, loss-bonus economy. Eight weapons with per-gun recoil and spray models, headshot multipliers, armor absorption and an AWP with true double zoom.
Bots that take the map
A 4v4 of autonomous agents on a hand-placed waypoint graph: A* pathfinding, line-of-sight checks, human reaction delays, and a state machine that peeks, strafes, rotates — and plants or defuses the bomb when you don’t stop them.
Engineered to a budget
BVH-accelerated hitscan, baked ambient occlusion, a two-pass viewmodel render and procedural WebAudio — all inside a budget of under 300 draw calls, served as static files with no bundler at all.
- 08Weapons modeled
- 4v4A* bot match
- MR12Round economy
- <300Draw-call budget
CUT 03 — Building AI-native
Fable
Five
Not a project — a practice. I build with Anthropic’s Claude Fable 5 as a studio partner: I hold the taste and the brief, it holds ten thousand lines in its head, and we cut worlds together at a tempo no solo developer can match.
Exhibit A — the frame study
To learn how the best scroll-driven sites breathe, we captured 325 frames from two landmark reference sites and wrote scroll-narrative breakdowns of every beat — then rebuilt the feeling from zero, without copying a single asset.
Exhibit B — the igloo study
A nine-chapter continuous WebGL scroll world: an instanced brick igloo with spring physics that flinches from your cursor, a penguin drawn as sixteen thousand GPU particles, and a QA harness of twelve automated browser scripts that walked every chapter before any human did.
Exhibit C — this site
The page you are scrolling is the practice, live: concept, shaders, copy and QA, built end-to-end with Fable 5 in a single session — the stone cutting itself.
- 325Frames studied
- 09Chapters, one scroll
- 16kGPU particles, one bird
- 12+Automated QA scripts
The next cut
Have a stone
worth cutting?
One conversation is enough to know. Tell me what you’re making — I’ll tell you how it could catch the light.
gem.tra@icloud.com