What problem does it solve? Building a Three.js scene from scratch requires dozens of interdependent decisions about lighting, materials, cameras, controls, environments, and post-processing, and wrong choices cause visual artifacts, poor performance, or broken rendering. This Skill provides structured decision trees and ready-made scene recipes that map each use case to the correct configuration. ## Core Features & Use Cases - Master Decision Trees: Maps use cases (product viewer, architectural walkthrough, game level, data visualization, portfolio, CAD/BIM viewer, AR/XR) to complete scene recipes covering lighting, materials, camera, controls, and post-processing. - Configuration References: Provides physically correct light intensities, material selection matrices, camera FOV settings, OrbitControls defaults, and post-processing pipeline ordering for Three.js r160+. - Anti-Pattern Catalog: Documents common mistakes such as missing OutputPass, zero near-plane, undisposed materials, and PointLight shadow overuse, with concrete fixes. - Use Case: When asked to build a product configurator, the Skill directs you to a PerspectiveCamera with fov 40, a three-point studio lighting setup, an HDR studio environment, ContactShadows, and constrained OrbitControls, in either imperative Three.js or React Three Fiber. ## Quick Start Ask the AI to create a Three.js product viewer scene and it will select the appropriate recipe, lighting setup, camera, and controls for you.
