Projects
Crimson Royale preview

Crimson Royale

Web · Application · Full-Stack Developer · 2026

A turn-based card battle game with a dark casino aesthetic. Players duel with Marvel-inspired hero cards, spending mana to build a board, attack enemy cards, and reduce the opposing avatar to 0 HP. Features a WebGPU-rendered 3D casino board, multiplayer via Socket.IO, MySQL-backed persistence, and a local scripted AI opponent.

Game DevelopmentWebGPUWGSLSocket.IONode.jsMySQLJavaScriptMultiplayer

Gallery


Notes

A turn-based card battle game where Marvel-inspired heroes clash on a WebGPU-rendered casino board.

Tech Stack

| Layer | Technology | |-------|------------| | Frontend | HTML, CSS, Vanilla JavaScript | | 3D Board | WebGPU + WGSL | | Audio | Web Audio API | | Server | Node.js + Express | | Database | MySQL 8.0 | | Realtime | Socket.IO | | Auth | bcryptjs + express-session |

Game Features

  • 25 HP, 10 max mana, 30-card decks with 5-card hands and 3-slot fields
  • Combat system with card-vs-card and direct avatar attacks
  • Mana progression starting at 3, capping at 10
  • Turn timer (25s) and match timer (4 min) with Sudden Death mechanics
  • Scripted AI opponent ("The House") that plays and attacks intelligently
  • Multiplayer with server-authoritative match state, matchmaking queue, pause/resume, and forfeit
  • Elo ranking (+25 win / -15 loss) and leaderboard
  • WebGPU 3D board with WGSL shaders, camera controls, and card/avatar render rings
  • Per-tab sessions allowing two users in the same browser for local multiplayer testing