{
Off+Brand
}
(Description)
이 프로젝트는 브랜드 사이트 'Offbrand'를 클론 코딩한 작업물로, React와 Three.js
기반의 라이브러리인 react-three-fiber를 활용해 WebGL 기반의 인터랙티브한 3D
웹사이트를 구현한 프로젝트입니다.
GSAP 라이브러리를 활용해 3D 메쉬와 HTML 콘텐츠가 사용자의 스크롤에 반응하며
자연스럽게 전환되도록 애니메이션을 구현했습니다. 스크롤 위치에 따라 카메라의
움직임과 메쉬의 왜곡 정도, 텍스트 요소의 트랜지션이 유기적으로 연동되도록
구성함으로써, 시각적 몰입감을 높였습니다.
(Client)
-
-
(Skills)
- React
- CSS3
- Three.js
(Member)
Publisher 1명
-
(Role)
- 1. React와 react-three-fiber를 활용한 3D Canvas 컴포넌트 설계 및 구현
- 2. GSAP을 활용한 스크롤 기반 인터랙션 모션 구현