웹 개발에 필요한 효과
웹 개발에 바로 쓰는 마우스 인터랙션 — 실제 화면 그대로의 프리뷰와 복사해서 붙여넣는 코드.
WebGL Fluid Simulation
플루이드 커서 글로우
커서를 따라 분홍빛 연기가 흐르는 WebGL 유체 시뮬레이션.
Canvas 2D · Eased Highlight
노드 호버 하이라이트
노드에 마우스를 올리면 연결된 그룹만 부드럽게 밝아지는 Canvas 이징 하이라이트.
WebGL Dither Shader
디더 스모크
커서가 지나가면 걷히는 흑백 디더 노이즈 연기 — reactbits Dither 셰이더 이식.
Scrollytelling · Pinned Scene
스크롤리텔링
스크롤을 내리면 고정된 장면이 이야기 순서대로 교체되는 내러티브 패턴.
Scroll-driven Animation
스크롤 기반 애니메이션
요소의 위치·투명도가 스크롤 진행률에 1:1로 묶여 움직이는 스크럽 애니메이션.
Scroll-jacking · Section Snap
스크롤재킹
휠 한 번에 섹션이 통째로 넘어가는 풀페이지 스냅 — 기본 스크롤을 가로채는 방식.
Parallax Scrolling
패럴랙스 스크롤링
배경·중간·전경 레이어가 서로 다른 속도로 움직여 깊이감을 만드는 고전 기법.