Graphics

Graphics

Home · World · Configuration · Technical-Overview

Renderer and scene

The main game builds a Three.js scene imperatively inside App.tsx, with React used for UI and application state. The project declares React Three Fiber and Drei dependencies, but the live game scene is created and updated through the native Three.js renderer path.

Rendering features include shadow-mapped lighting, procedural sky/haze shaders, map-aware terrain materials, HDR environment lighting, particles, full first-person viewmodels, enemy LOD, and a custom post-processing stack.

Lighting and atmosphere

• Continuous day/dawn/day/dusk/twilight/night interpolation with a moving sun/moon arc.
• Per-map directional/ambient/fog settings and render profiles.
• Environment reflections from Poly Haven HDRIs when the active quality path allows it; lower performance paths use a cheaper local fallback.
• Custom sky dome with drifting cloud, sun/moon, star, and haze behavior.
• Weather particle fields for climate events such as rain, snow, ash, sandstorms, spores, and wisps.

Post-processing

When post-processing is enabled, the pipeline includes render pass, Unreal Bloom, cinematic grading, and quality-dependent anti-aliasing. The custom grade shader supports:

• ACES filmic tonemapping and exposure.
• Volumetric-style sun shafts / god rays.
• Chromatic aberration, film halation, vignette, grain, scanline, and split tone.
• Highlight recovery/desaturation for bright snow and sand maps.
• Aerial perspective, vibrance, shadow lift/deepening, local clarity, lens dirt, and optional anamorphic streaks.
• CAS adaptive sharpening as the final pass.

Ultra quality enables the most expensive optical effects; low and ultra-low disable shadows and post-processing.

Models and animation

Weapons are custom constructed first-person models with gloved hands. They animate idle sway, walk/run bob, ADS, recoil, reloads, inspection, strafe lean, jumps/landings, class abilities, and Phantom fading. The Subverter has its own animated code screen, chip bay, emitter, and reload animation.

Enemies have detailed low-poly shells, glow components, arm/leg movement, hit reactions, head tracking, death behavior, and high/medium/low LOD. Remote players are full-body low-poly models with weapon poses, crouch, aim, walk, death, nameplate, and health-bar animation.

Effects and physics

Combat visuals include muzzle flashes, tracers, smoke, shell casings, impact sparks, blood/robot hit feedback, explosions, craters, shockwaves, lightning, hack beams, freezes, nuke clouds, damage flashes, and screen shake.

With ragdolls enabled, solo enemy corpses use a lazy-loaded Rapier rigid-body world. It caps active bodies at 20 and falls back to a lightweight custom launcher if Rapier is not ready or in multiplayer.

Performance design

• Graphics settings drive resolution scale, shadow size, MSAA, post-processing, particle density, draw distance, terrain density, and enemy cap.
• Terrain chunks and static props are streamed/instanced.
• Enemy meshes are pooled with shared geometry/materials and LOD at 45/70/100 units.
• Dynamic pickup/explosion lighting uses preallocated light pools to avoid shader recompilation during combat.
• Shader warmup precompiles major visual paths before gameplay begins.

Implementation references: src/App.tsx, src/utils/PostProcessing.ts, src/utils/Shaders.ts, src/utils/TerrainSystem.ts, src/utils/HDRIEnvironment.ts, src/utils/SmartEnemyManager.ts, src/utils/RagdollSystem.ts, src/utils/GunModel.ts.