TAU-HOME.COM
LOADING

Claude 스킬과 Three.js로 단일 이미지 기반 3D 분해도 구현하기

Claude Opus 5.5와 Three.js 코드로 레퍼런스 이미지를 대형 기어 아래에 260개의 소형 피스톤, 호스, 스크류, 와이어가 배치된 인터랙티브 3D 분해도로 구현하는 워크플로.

tau · 2026년 11월 1일

#Claude #Three.js #3D-Workflow #Opus-5.5

Claude 스킬과 Three.js로 단일 이미지 기반 3D 분해도 구현하기

제작자 엘바르(@elvar_official)가 Claude 스킬과 Opus 5.5를 결합해 단 한 장의 레퍼런스 이미지로부터 대형 기어 아래에 260개의 소형 피스톤, 호스, 스크류, 와이어가 배치된 인터랙티브 3D 분해도를 만드는 워크플로를 공개했습니다.

Claude 스킬과 Three.js로 만든 인터랙티브 3D 분해도

이미지 출처: Elvar (@elvar_official)

이 게시물은 Opus 5.5가 단일 이미지를 바탕으로 코드 기반 3D 분해도를 만들고 렌더링 결과를 원본 이미지와 비교하는 워크플로를 보여줍니다.

Claude 스킬 기반 Three.js 코드 생성 워크플로

작업자는 전체 3D 제작 파이프라인을 단일 Claude 스킬로 패키징했습니다.

  • 레퍼런스 매칭: 단 한 장의 레퍼런스 이미지가 외형을 정하며, 셸, 기어, 호스는 Three.js 코드로 빌드됩니다.
  • 다중 라운드 비교: 비디오를 만들기 전에 Opus가 렌더링 결과물을 원본 이미지와 나란히 비교하는 과정을 3라운드 진행합니다.
  • 동적 분해 동작: 대형 기어 아래에는 260개의 소형 피스톤, 호스, 스크류, 와이어가 배치됩니다. 2~3초마다 한 부품이 분리되며, 다리를 당기면 해당 서보 바가 'DETACHED' 상태로 전환됩니다.

시뮬레이션 7개와 플레이그라운드 공개

작업자는 2일 만에 이런 시뮬레이션 7개를 만들었으며, 시뮬레이션은 플레이그라운드에서 라이브로 제공된다고 밝혔습니다.

원문 출처

Impact-Site-Verification: 9b3ebd10-6c45-44cf-a014-5b8c19b7b285