PORTFOLIO — DEVELOPMENT · 02
Three.js · WebGL · CSS 3D로 화면 안에 입체 공간과 광원을 만든 작업들입니다.
01 LIDO PERFUME ATELIER · 3D STORY SITE + WEBGL
Three.js 회전체로 만든 유리병(transmission 굴절)과 GSAP ScrollTrigger 핀 타임라인으로 엮은 스크롤 스토리. 굴절 패스 절반 해상도·적응형 DPR로 모바일 Lighthouse 성능 52 → 93
02 ÉTUDE PHOTOGRAPHY · WEBGL EXHIBITION + DEVELOPMENT
흑백 사진을 3차원 공간에 띄워 회전·산개·재배열하며 감상하는 인터랙티브 WebGL 전시 웹사이트
03 WRLD TATTOO STUDIO · BRUTALIST WEB + 3D MARK
손그림 로고를 벡터화해 두께를 가진 3D 오브젝트로 압출하고, 드래그 회전·호버 시 잉크 두께 증가·클릭 시 스쿼시 후 회전으로 이어지는 상태 기반 인터랙션
04 SOMOS PREMIUM SPIRITS · BRAND WEB + LIGHT INTERACTION
radial-gradient 마스크로 커서가 닿는 자리만 드러내는 광원 인터랙션과 sticky 스테이지 스크롤 시퀀스. 잔광 렌더링을 WAAPI 풀 재사용 구조로 바꿔 27.2 → 39.7fps 확보