⌖인터랙션

커서 궤적, 잉크·연기 유체, 무리 짓기(보이드)처럼 마우스에 반응하거나 스스로 움직이는 시뮬레이션. — 16개 항목

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

커서 트레일Cursor Trail

포인터가 지나간 자리에 색 띠가 잠시 남아 움직임을 따라옵니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

커서 잔물결Cursor Ripples

포인터가 움직인 곳에서 물결이 번지며 아래 이미지가 출렁입니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

리퀴파이Liquify

포인터를 움직이면 아래 이미지가 부드러운 천처럼 늘어나고 되돌아옵니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

그리드 왜곡Grid Distortion

포인터 주변의 격자가 휘면서 아래 이미지가 국소적으로 밀립니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

잉크 플로Ink Flow

드래그한 자리에 색 잉크가 번지고, 손을 뗀 뒤에도 소용돌이치며 흐릅니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

연기Smoke

발생 지점에서 연기가 피어올라 퍼지고, 시간이 지나며 색이 바뀌고 옅어집니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

연기 흐름Smoke Flow

포인터를 움직이면 연기가 생기고, 그 궤적을 따라 소용돌이치며 옅어집니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

안개Fog

안개가 화면을 채우고 포인터 근처에서 밀려나며 빈틈을 만듭니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

크로마 플로Chroma Flow

포인터를 따라 액체처럼 번지는 색이 움직이는 방향에 따라 달라집니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

파티클 플로Particle Flow

작은 입자들이 포인터가 만든 흐름을 타고 먼지처럼 떠다니며 소용돌이를 따라갑니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

보이드 군집Boids

작은 에이전트들이 무리처럼 모이고 갈라지며, 포인터를 향하거나 피합니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

자기장 철가루Magnetic Filings

철가루 같은 점들이 포인터 주변 자기장에 정렬되며 자력선 모양을 드러냅니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

반응-확산Reaction Diffusion

산호나 세포처럼 보이는 무늬가 자라며, 드래그한 곳에서 새 패턴이 번집니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

픽셀 정렬Pixel Sort

포인터 브러시가 지나간 부분의 픽셀을 밝기 순으로 정렬하고 흔적을 남깁니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

픽셀 던지기Pixel Throw

포인터가 지나가면 밝기나 색에 따라 픽셀이 튕겨 나갔다가 돌아옵니다.

WebGPU 를 지원하는 브라우저에서 움직입니다

이 기기에서는 데모를 그리지 못해 정지 화면을 보여 줍니다

유리 파편 효과Shatter

금이 간 유리 조각처럼 아래 이미지가 갈라지고, 포인터 주변에서 파편이 밀려납니다.

페이지로 열기 ↗