위트가 위트를 소개하기 위해 만든 인터랙티브 쇼릴입니다. 정규화된 스크롤 값 하나가 모든 프레임을 만듭니다 — 히어로 카드가 위트 제품 3D 캐러셀로 접히고, 별 마스크로 열리며 34,000개 파티클 구체가 드러난 뒤, 패럴랙스 필드를 날아 크롬 위트 마크에 착지합니다. 빌드 없는 단일 HTML, 외부 자산 의존 0.
Three.jsGLSL 셰이더스크롤 인터랙션파티클 34,000절차적 3D · PBR단일 HTML
스크롤 값 하나가 페이지 전체를 끌고 갑니다. WebGL 캔버스 두 장이 겹칩니다 — 뒤에는 커서를 따라 피어나는 절차적 ASCII 그리드, 앞에는 코드로 깎은 위트 W 마크에 홀로그래픽 셰이더를 입히고 다시 하프톤으로 디더링했습니다. 오도미터가 100에 닿으면 타이틀이 글자 단위로 젖혀 오르고, 카메라가 씬 안으로 파고들며 34,700개 파티클이 로고로 조립됩니다. 모델 파일 없이 마크를 코드로 세웠습니다.
Three.jsGLSL 셰이더ASCII 하프톤Lenis 스무스 스크롤절차적 3D 마크파티클 34,700단일 HTML
스크롤 값 하나가 12만 개 파티클을 일곱 단계로 통과시킵니다 — 구체에서 깔때기로, DNA 이중나선으로, 끝없는 파도로, 터널로, 하얗게 터지는 블랙홀을 지나 나선은하까지. 모서리에서는 fBm 노이즈 오로라가 숨쉬고 UnrealBloom이 전체를 빛나게 합니다. 화면의 모든 픽셀이 절차적으로 계산됩니다 — 사진도, 3D 파일도, 텍스처도 없이 셰이더와 CSS만으로.
Three.jsGLSL 셰이더7단계 모프파티클 120,000UnrealBloom 포스트프로세싱Lenis 스무스 스크롤이미지 자산 0단일 HTML
하나의 파티클 필드가 스크롤 시계 하나를 따라 세 형태를 통과합니다 — 커서 아래에서 기름처럼 부푸는 노이즈 구체, 카메라가 파고드는 두 팔 나선은하, 시냅스가 터지는 포인트클라우드 뇌. 뇌는 메시 파일을 받지 않고 실행 중에 수식으로 빚어냅니다. 외부 이미지는 0장, 모든 픽셀이 셰이더와 CSS입니다.
Three.jsGLSL 셰이더3형태 모프절차적 뇌 생성오일 포인터 상호작용UnrealBloom기기별 적응 티어단일 HTML
