Is performance optimization included?

Yes, the skill offers helper functions for LOD (Level of Detail), geometry merging, and shadow map optimization to maintain high frame rates.

Can I implement character animations with this skill?

Absolutely, it provides a specialized AnimationController for handling Mixamo retargeting, skeletal animation blending, and state-based transitions.

Can I use this for both vanilla JS and React?

Yes, the skill includes implementation patterns for both standard Three.js and the React Three Fiber (R3F) ecosystem.

How do I add post-processing effects?

The skill includes a pre-configured EffectComposer setup that allows you to easily add Unreal Bloom, SSAO, and other cinematic passes to your scene.

Does it support compressed 3D models?

Yes, it includes built-in support for DRACOLoader to handle compressed GLTF and GLB files efficiently for web performance.

Three.js & R3F Scene Builder

Name: Three.js & R3F Scene Builder
Author: Dexploarer

byDexploarer

•

ゲーム開発

Builds advanced 3D web experiences and interactive graphics using Three.js and React Three Fiber.

概要

The Three.js Scene Builder skill empowers developers to create complex 3D environments, character-driven games, and data visualizations directly within the browser. It provides a robust framework for handling scene architecture, PBR materials, animation retargeting from sources like Mixamo, and integrated post-processing effects. Whether you are setting up a basic WebGL canvas or developing a full-scale 3D avatar system with NPC AI, this skill offers the boilerplate, optimization patterns, and procedural logic required for high-performance graphics development.

主な機能

Integrated post-processing with Bloom and SSAO effects
Complete Three.js and React Three Fiber (R3F) boilerplate setup
Animation controller for retargeting and cross-fading actions
Advanced PBR, Glass, Toon, and Glowing material libraries
GLTF/Draco model loading with shadow and texture optimization
2 GitHub stars

ユースケース

Developing interactive 3D product configurators or data visualizations
Setting up avatar systems with Ready Player Me integration
Creating browser-based games with character controllers and NPC AI

概要

主な機能

Integrated post-processing with Bloom and SSAO effects
Complete Three.js and React Three Fiber (R3F) boilerplate setup
Animation controller for retargeting and cross-fading actions
Advanced PBR, Glass, Toon, and Glowing material libraries
GLTF/Draco model loading with shadow and texture optimization
2 GitHub stars

ユースケース

Developing interactive 3D product configurators or data visualizations
Setting up avatar systems with Ready Player Me integration
Creating browser-based games with character controllers and NPC AI