From Creative Vision to a Fully Playable 3D Web Game in 3 Hours using
Antigravity, OpenCode, Blender MCP & Babylon.js.
180
Minutes Total
0
Syntax Lines Typed
1
Playable 3D Game
1-Click
Web Deploy
THE PARADIGM SHIFT
THE OLD WAY VS. THE AGENTIC WAY
❌ Traditional Game Dev
Requires 8-15 specialists (physics, 3D modellers, riggers, UI, audio, QA).
6 to 18 months just to get a functional vertical slice.
Endless friction jumping between Blender, Maya, Photoshop, and code editors.
90% of beginner projects die in "tutorial purgatory".
⚡ The Agentic AI Era
Solo Creative Director commanding autonomous agents.
Prompt-driven architecture: From GDD to runnable physics in minutes.
MCP (Model Context Protocol): Direct agent-to-Blender 3D mesh generation.
Rapid iteration loop: Polish what's fun, discard what isn't immediately.
FOUNDATIONAL DESIGN THESIS
A GAME IS "POINT A TO POINT B" + 1-2 USPS
Every successful game boils down to moving from Point A to Point B.
What makes it unforgettable are 1 or 2 Unique Selling Propositions (USPs).
1. Point A (Origin)
The starting state, location, challenge, or emotional baseline. Establishes the player's motivation and rules.
2. Point B (Goal)
The destination, score milestone, or story climax. Creates urgency, tension, and a clear win/loss boundary.
3. The 1-2 USPs
The mechanical or environmental twist. Without USPs, traversal is a boring chore. With USPs, it becomes addictive play.
OUR LIVE WORKSHOP DEMO
KING MYVI: HIGHWAY LEGENDS
The undisputed Malaysian "King of the Road" meets PLUS North-South Expressway
The Core Journey (A → B)
Point A: Toll Plaza Jalan Duta
KM 0.0 • Engine idling • 90-second countdown timer starts.
Point B: Ayer Keroh Toll Plaza & R&R
KM 5.0 (5,000m) • Crossing the illuminated gate achieves Victory!
The 2 Cultural USPs
USP 1: The High-Beam Flash (SPACE)
Flash slow lorries & sedans in the fast lane; they panic, signal left, and clear your path!
USP 2: Potholes & SmartTAG Jumps
Dodge road repair potholes (-40% speed penalty) & hit glowing SmartTAG lanes for supersonic 240 km/h ramp jumps!
SESSION TIMELINE
THE 3-HOUR RUN-OF-SHOW
00:00 - 00:45
Phase 1: AI Design
• Prompting the GDD
• Mathematical specs
• Google Sheets backlog
• Physics balancing sheet
00:45 - 01:30
Phase 2: 3D Assets
• Blender 5 + MCP bridge
• Procedural Myvi car
• Palm trees & gantries
• Hybrid fallback pack
01:30 - 02:45
Phase 3: Assembly
• Babylon.js 7 runtime
• Arcade vehicle physics
• High-Beam traffic AI
• Web Audio procedural SFX
02:45 - 03:00
Phase 4: Deploy
• 1-click GitHub Pages
• Live Inspector tuning
• Mobile playtest QR
• Scaling to UE5 / PCG
PHASE 1 • 00:00 - 00:30
AI-POWERED GAME DESIGN (GDD)
Vague prompts produce garbage. Technical constraints produce games.
❌ The Amateur Prompt
"Make a super cool and fun
car racing game with
Malaysian highway vibes
and high beams."
Result: Generic, unplayable spaghetti code with no physics constraints or quantifiable win/loss logic.
✅ The Creative Director Prompt
"Act as a Principal Game Designer.
Draft an executable GDD:
- Point A: KM 0.0 (Jalan Duta Toll).
- Point B: KM 5.0 (Ayer Keroh Toll).
- Vehicle: Myvi top speed 180 km/h,
accel 42 km/h/s, banking roll 8°.
- USP 1: High-beam spotlight cone 45°,
range 42m; traffic reacts in 0.35s
and lateral shifts left over 0.7s.
- USP 2: Potholes (-40% speed) &
SmartTAG pads (+60 km/h jump)."
PHASE 1 • 00:30 - 00:45
THE SPREADSHEET AS GAME ENGINE
Why the best game directors live in Google Sheets, not just code
1. The Agile Backlog
Every game feature is broken into an atomic Task ID (ENG-01 to UI-01) with explicit verification criteria.
ID
Feature
Est
Verification
ENG-02
Arcade Controller
25m
WASD + 8° chassis roll
ENG-03
High-Beam Flash
20m
Traffic shifts left
2. The Physics Balancing Matrix
Separate gameplay math from code. Tune the feel without breaking the engine!
Parameter
Default
Unit
Feel Impact
top_speed
180
km/h
Cruising thrill
high_beam_range
42.0
meters
Overtake buffer
pothole_penalty
0.40
%
Penalty impact
PHASE 2 • 00:45 - 01:30
THE 3D PIPELINE: BLENDER + MCP
Direct agentic control over 3D DCC tools via Model Context Protocol
AGENT
Antigravity / OpenCode
Sends JSON-RPC commands
→ MCP BRIDGE →
DCC
Blender 5.x
Generates meshes & exports .GLB
Live Instructor Showcase
Watch Blender build the Myvi hatchback body, add the iconic rear roof spoiler, create dark alloy wheels, and export to public/assets/models/myvi.glb in 0.09s!
Hybrid Mode (Zero Blocker)
For attendees with older laptops: The repo includes verified pre-built .glb models and procedural Babylon fallbacks, so nobody is ever stuck on environment setup.
PHASE 3 • 01:30 - 01:50
BABYLON.JS ARCADE VEHICLE PHYSICS
How to give a web game genuine weight, responsiveness, and speed sensation
1. Acceleration Curve
Non-linear torque: reaches 110 km/h in 3s; cruises at 180 km/h; uncapped to 240 km/h during SmartTAG boost.
2. Chassis Banking Tilt
rootNode.rotation.z = lateralTilt
Leaning 8° into sharp turns gives immediate visual feedback of tire grip.
3. Dynamic Camera FOV
Camera radius pulls back and FOV widens as speed rises past 140 km/h, amplifying the sensation of velocity.
The Chase Camera Fix (Key Lesson):
In Babylon.js, FollowCamera.rotationOffset = 180° is required to place the camera behind the vehicle looking forward along the +Z expressway. At 0°, the camera looks backward at the front bumper!
PHASE 3 • 01:50 - 02:15
USP 1: HIGH-BEAM FLASH & TRAFFIC AI
Turning a Malaysian driving habit into an arcade state machine
STATE 1
CRUISING
Traffic cruises at 80-95 km/h in right lane
STATE 2
DETECTED
Player flashes within 42m behind
STATE 3
SIGNALING
Left amber indicator blinks (0.28s delay)
STATE 4
YIELDED
Interpolates to middle lane & +250 PTS!
The Prompt to Build This:
"In src/traffic.js, implement an AI state machine:
When player presses Spacebar (high beams active) and is within 40m behind
a vehicle in the right lane (x = 5.8):
1. Activate the AI car's left blinker mesh.
2. Wait 0.28s reaction time.
3. Smoothly lerp x from 5.8 to 0.0 (middle lane) over 0.7s.
4. Trigger sound.playYieldSuccess() and award +250 points!"
PHASE 3 • 02:15 - 02:35
USP 2: POTHOLE SLALOM & SMARTTAG BOOST
Risk vs. Reward: Balancing speed with navigation precision
THE HAZARD
Road Repair Potholes
Dark asphalt craters scattered across lanes 1 and 2.
Penalty: Speed drops by 45% instantly + heavy metal thud SFX.
Suspension Wobble: Sine-wave steering disturbance for 1.2s.
Forces player to actively weave rather than hold 'W'.
THE REWARD
SmartTAG Booster Ramps
Luminescent emerald chevron strips leading into toll plazas.
Impulse Surge: Instant launch to 240 km/h supersonic speed.
Aerial Ramp Jump: Low-gravity arc flying cleanly over slow traffic.
Rewarding players who plan lane positioning ahead!
PHASE 3 • 02:35 - 02:45
PROCEDURAL AUDIO & ARCADE HUD
Zero external assets • 100% synthesized in Web Audio API
Web Audio API Synthesizer
Why procedural audio? Never breaks due to missing files or CORS audio errors!
Engine RPM: Sawtooth wave modulated from 45Hz (idle) to 225Hz (180 km/h).