threejs-rts-animation

Implements GPU-skinned skeletal animation systems for large-scale Three.js RTS unit armies.

Updated Jul 13, 2026
One-click install
npx skills add https://github.com/Ohmnia/site-build --skill threejs-rts-animation-ohmnia
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: threejs-rts-animation
Source: https://github.com/Ohmnia/site-build/tree/main/.opencode/skills/threejs-rts-animation
Command: npx skills add https://github.com/Ohmnia/site-build --skill threejs-rts-animation-ohmnia

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires three.

What problem does it solve? Building character animation for real-time strategy games in Three.js breaks down at scale: hundreds of units cause CPU-bound skinning loops, foot-sliding, snap-turning, and synchronized clone marching that destroy both frame rate and visual quality. ## Core Features & Use Cases - GPU Bone Texture Skinning: Routes bone transforms through texture palettes and shared skeletons instead of per-unit AnimationMixer instances, keeping draw calls flat across 1000+ entity armies. - Locomotion Sync Pipeline: Enforces velocity-matched timeScale for anti-foot-sliding, delta-gated rotation interpolation for smooth turning, and randomized phase offsets to break synchronized marching. - Distance-Based Animation LOD: Throttles skeletal updates to 30/15/8 FPS by camera range and swaps far units to VAT meshes or billboards. - Use Case: When an AI generates a unit movement system where 500 soldiers slide across the terrain or stutter at low FPS, this Skill rewrites it with timeScale velocity matching, shared GPU skinning, and LOD gating. ## Quick Start Ask the AI to refactor your Three.js RTS unit animation system so that walk playback speed matches entity velocity and distant units use reduced skeletal update rates.

Frequently Asked Questions about threejs-rts-animation

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I animate hundreds of units in Three.js without lag?

Use GPU texture-based bone skinning with shared skeletons instead of one AnimationMixer per unit. Combine this with distance-based LOD that drops skeletal updates to 15 FPS at mid range and 8 FPS or VAT/billboard swaps at far range.

How to fix foot sliding in Three.js character walk animations?

Foot sliding is fixed by scaling the animation timeScale dynamically to match actual entity velocity: set walkAction.timeScale equal to current speed divided by the base walk speed constant. Never use a flat static playback multiplier.

Why do my cloned Three.js units all animate in sync?

Cloned units start on animation frame zero by default, causing synchronized marching. Inject a randomized phase offset on instantiation by setting unitAction.time to Math.random() multiplied by the clip duration.

What bone count should RTS character rigs use?

RTS rigs should stay between 15 and 35 bones with globally shared skeleton libraries. Finger bones, facial topology, and unique per-unit skeletons are refused because they add transform overhead with no visible benefit at RTS camera distances.

Should RTS animation use root motion for unit movement?

No. The simulation state must always drive the animation engine; animation must never dictate gameplay position or velocity. Movement comes from kinematic pathfinding, and the animation layer only matches playback to that state.

Can I sync RTS unit animations over the network by sending keyframes?

No. Transmit only primitive state flags such as State: ATTACK and let each client reconstruct animation locally. Broadcasting raw bone arrays or keyframe steps over websockets wastes bandwidth and is explicitly refused.