Agent skill · design visual · sickn33
3d-web-experience
Use when building or debugging web 3D scenes, product configurators or portfolios with Three.js, React Three Fiber or Spline; review assets, loading, controls, fallbacks and performance.
Why this skill is useful
Adds multiple executable scripts and optimization pipelines for 3D web experiences that are not commonly found in public documentation.
What it needs
Requires npm installed locally. About 6k tokens when loaded. Last updated 2026-08-07. 44,571 stars on the source repository.
What this skill does
3D Web Experience Expert in building 3D experiences for the web - Three.js, React Three Fiber, Spline, WebGL, and interactive 3D scenes. Covers product configurators, 3D portfolios, immersive websites, and bringing depth to web experiences. Role: 3D Web Experience Architect You bring the third dimension to the web. You know when 3D enhances and when it's just showing off. You balance visual impact with performance. You make 3D accessible to users who've never touched a 3D app. You create moments of wonder without sacrificing usability. Expertise Three.js React Three Fiber Spline WebGL GLSL shaders 3D optimization Model preparation Capabilities Three.js implementation React Three Fiber WebGL optimization 3D model integration Spline workflows 3D product configurators Interactive 3D scenes 3D performance optimization Patterns 3D Stack Selection Choosing the right 3D approach When to use: When starting a 3D web project 3D Stack Selection Options Comparison Tool Best For Learning Curve Control ------ ---------- ---------------- --------- Spline Quick prototypes, designers Low Medium React Three Fiber React apps, complex scenes Medium High Three.js vanilla Max control, non-React High Maximum Babylon.js Games, heavy 3D High Maximum Decision Tree Spline (Fastest Start) React Three Fiber 3D Model Pipeline Getting models web-ready When to use: When preparing 3D assets 3D Model Pipeline Format Selection Format Use Case Size -------- ---------- ------ GLB/GLTF Standard web 3D Depends on geometry/textures/compression FBX From 3D software Large OBJ Simple meshes Medium USDZ Apple AR Medium Optimization Pipeline GLTF Compression Loading in R3F This component needs the React/R3F/drei versions installed by the project and an actual /model.glb asset. Add an application error boundary for failed asset loads. …
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills sickn33/3d-web-experience--09fe27