threejs-interaction은(는) 무엇을 하나요?
Three.js 상호작용 - 레이캐스팅, 컨트롤, 마우스/터치 입력, 객체 선택. 사용자 입력 처리, 클릭 감지 구현, 카메라 컨트롤 추가 또는 대화형 3D 경험 생성 시 사용합니다.
Three.js 상호작용 - 레이캐스팅, 컨트롤, 마우스/터치 입력, 객체 선택. 사용자 입력 처리, 클릭 감지 구현, 카메라 컨트롤 추가 또는 대화형 3D 경험 생성 시 사용합니다.
이 스킬은 Three.js를 기반으로 한 3D 상호작용을 구현하는 데 특화되어 있습니다. 레이캐스팅(Raycasting)을 통해 마우스나 터치 입력으로 3D 객체를 정확히 선택하고, OrbitControls, DragControls 등 다양한 카메라 및 객체 컨트롤을 제공합니다. 개발자는 이 스킬을 활용하여 클릭 감지, 객체 선택, 드래그 앤 드롭, 호버 효과 등 풍부한 사용자 인터랙션을 손쉽게 추가할 수 있습니다. Claude Code, Cursor, Codex 등 다양한 AI 에이전트 플랫폼에서 사용 가능하며, 기존 Three.js 프로젝트에 즉시 적용할 수 있습니다. 주요 기능으로는 raycast 이벤트 처리, 터치 제스처 매핑, 객체 상태 변경 및 피드백 제공 등이 포함되어 있어, 사용자 입력에 반응하는 몰입형 3D 웹 애플리케이션을 빠르게 구축할 수 있습니다.
npx skills add https://github.com/cloudai-x/threejs-skills/tree/main/skills/threejs-interactionInstalled? Explore more 코딩 & 개발 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →
Three.js 상호작용 - 레이캐스팅, 컨트롤, 마우스/터치 입력, 객체 선택. 사용자 입력 처리, 클릭 감지 구현, 카메라 컨트롤 추가 또는 대화형 3D 경험 생성 시 사용합니다.
This repo contains 9 individual skills — each has its own dedicated page.
Three.js animation - keyframe animation, skeletal animation, morph targets, animation mixing. Use when animating objects, playing GLTF animations, creating procedural motion, or blending animations.
Three.js scene setup, cameras, renderer, Object3D hierarchy, coordinate systems. Use when setting up 3D scenes, creating cameras, configuring renderers, managing object hierarchies, or working with transforms.
Three.js geometry creation - built-in shapes, BufferGeometry, custom geometry, instancing. Use when creating 3D shapes, working with vertices, building custom meshes, or optimizing with instanced rendering.
Three.js lighting - light types, shadows, environment lighting. Use when adding lights, configuring shadows, setting up IBL, or optimizing lighting performance.
Three.js asset loading - GLTF, textures, images, models, async patterns. Use when loading 3D models, textures, HDR environments, or managing loading progress.
Three.js materials - PBR, basic, phong, shader materials, material properties. Use when styling meshes, working with textures, creating custom shaders, or optimizing material performance.
Three.js post-processing - EffectComposer, bloom, DOF, screen effects. Use when adding visual effects, color grading, blur, glow, or creating custom screen-space shaders.
Three.js shaders - GLSL, ShaderMaterial, uniforms, custom effects. Use when creating custom visual effects, modifying vertices, writing fragment shaders, or extending built-in materials.
Three.js textures - texture types, UV mapping, environment maps, texture settings. Use when working with images, UV coordinates, cubemaps, HDR environments, or texture optimization.
Send and manage iMessages via BlueBubbles, including attachments, tapbacks, edits, replies, and groups.
Control Eight Sleep pods (status, temperature, alarms, schedules).
BluOS CLI (blu) for discovery, playback, grouping, and volume.
Create, search, and manage Bear notes via grizzly CLI.
Capture frames or clips from RTSP/ONVIF cameras.
Search GIF providers with CLI/TUI, download results, and extract stills/sheets.