3D Content R&D

생성형 AI가 발전하면서 3D 텍스처를 생성하는 프로토타입을 만들어 봤습니다. 3D 툴 플러그인들이 나오던 때라, 웹에서도 3D 텍스처를 생성하는 경험이 가능한지 검증하고 이후 프로젝트에서 고려할 점을 파악해야 했습니다.

웹에서 AI로 3D 텍스처를 생성하는 것이 기술적으로 가능한지 검증하고, API 응답이 오래 걸려도 사용자 경험을 좋게 만들 방법을 찾는 것이 목표였습니다.

Vite와 React-three/fiber로 3D 환경을 만들고 Huggingface API를 연동했습니다. 텍스처를 최적화하려고 마스킹 영역을 지정해 특정 부분만 업데이트하는 방식을 구현했고, Canvas에서 이미지를 합쳐 모델에 동적으로 적용했습니다. API 응답 대기 시간이 길어서, 텍스처가 바뀌는 부위에 Shader Effect를 적용한 BloomEffect를 만들어 기다리는 경험을 개선했습니다.

웹에서 AI로 3D 텍스처를 생성하는 프로토타입을 구현했습니다. API 응답 지연에 대응할 사용자 경험 개선 방법도 확보해, 이후 관련 프로젝트를 위한 기술 검증과 개선할 점을 정리할 수 있었습니다.

애니메이션 스타일 NFT 프로젝트 AZUKI와의 협업을 검토하면서 진행한 카툰 렌더링 프로토타입입니다. 3D 모델 특성상 사실적인 표현이 아니라 카툰 스타일 렌더링이 필요해서, 웹에 맞는 카툰 렌더링 방법을 검증해야 했습니다.

웹에서 카툰 스타일 렌더링을 구현하는 가장 좋은 방법을 찾아보고, 애니메이션 NFT 프로젝트에 쓸 수 있는 시각적 품질을 확보하는 것이 목표였습니다.

Vite와 React-three/fiber로 3D 환경을 만들고, MeshToonMaterial, GradientMap, Outline 처리를 조합해 카툰 렌더링을 구현했습니다. 구현하다가 발견한 Shader 이슈는 오픈소스에 이슈를 제기해 해결했고, 덕분에 안정적인 카툰 렌더링 파이프라인을 완성했습니다.

웹에서 고품질 카툰 렌더링을 구현하는 방법을 정리했습니다. 오픈소스에 이슈를 제기해 기술적인 문제를 풀었고, 애니메이션 NFT 프로젝트 협업을 위한 기술적 기반도 마련했습니다.