web

Stratman

Real-time 2D strategy engine for drafting Rainbow 6 Siege setups — Canvas rendering, interactive map overlays, and operator placement with line-of-sight visualization.

ReactTypeScriptCanvas
R6 Siege defensive setup — reinforcements, utility, operator placement Attacker push with line-of-sight detection and trap triggers
Real-time strategy drafting engine

Overview

Stratman is a browser-based strategy visualization tool built with React and HTML5 Canvas. It renders thousands of units in real time with smooth pathfinding and terrain-aware movement.

Architecture

  • Renderer — Custom Canvas 2D pipeline with spatial partitioning
  • Pathfinding — Flow-field navigation for large unit groups
  • State — Immutable game state with command-pattern undo/redo
  • Editor — Interactive terrain painting with brush tools

Key Features

  • 60fps rendering with 2000+ simultaneous units
  • Flow-field pathfinding for natural group movement
  • Terrain editor with elevation, obstacles, and resource zones
  • Replay system with full state serialization