Menü
Display floating damage numbers that animate upward and fade out, with support for critical hits.
Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.
Basierend auf der SOC-Berufsklassifikation
Poll for changes to any value and trigger React re-renders when it changes.
Day-to-day coding style and patterns for R3F game development with Miniplex ECS.
Verekia's preferred project setup with Next.js Pages Router, Tailwind 4, oxfmt, oxlint, and TypeScript.
Use Zustand as a simple state store for entity management (not a true ECS).
Attach meshes to bones of a skinned mesh, such as attaching a sword to a character's hand.
Shake the camera when the player takes damage or on impacts for visual feedback.
| name | damage-numbers |
| description | Display floating damage numbers that animate upward and fade out, with support for critical hits. |
Display floating damage numbers that animate upward and fade out, with support for critical hits.
Use Drei's Html component to render DOM elements in 3D space. Manage damage numbers in React state, spawn them with random positions, and use CSS animations for the floating/fading effect.
Html from @react-three/drei for DOM-in-3D renderingsetTimeout to remove damages after animation completes<Html center position={[damage.x, damage.y, 0]}>
<div style={{ animation: 'damageNumber 1.3s ease-out forwards' }}>{damage.value}</div>
</Html>
This skill is part of verekia's r3f-gamedev.