이미지 색을 가진 짧은 붓 자국들이 흐름장을 따라 이동하며 그림을 회화처럼 흐트러뜨림Short brush marks carrying the image's colors move along a flow field and scatter the picture like a painting.
붓 3000개가 이미지 색을 가지고 길이 8px, 폭 2px로 5초 동안 초속 12px 흐름을 따라 움직이다가 마지막에 원위치로 복귀한다
붓이 너무 커서 이미지가 뭉개지거나 복귀가 없어 결과가 원본을 알아볼 수 없다
기본값은 클립에 쓴 값Defaults are the values used in the clip
| 항목PARAM | 기본DEFAULT | 범위RANGE | 메모NOTE |
|---|---|---|---|
| 붓 수 | 3000 | 1500~6000 | 격자 기반 고정 배치 |
| 붓 크기 | 8x2px | 6x2~12x3 | 흐름 방향으로 회전 |
| 이동 | 12px/s | 8~20 | 흐름장 속도 |
| 복귀 | 0.02 | 0.01~0.05 | 프레임당 원위치 당김 → 마지막 1.2초에 1.0 |
| 지속 | 5s | 3~8s | 재생 길이 |
const u = { t: 0, back: 0 };
tl.to(u, { t: 5, duration: 5, ease: 'none', onUpdate: draw }, 0)
.to(u, { back: 1, duration: 1.2, ease: 'sine.inOut', onUpdate: draw }, 3.8);
// 붓 i: 홈 위치 h_i(격자), 색은 원본에서 샘플
// pos = h + flow(h, t) * (1 - back); angle = atan2(flow.y, flow.x)
// flow(p,t) = vec2(cos(n), sin(n)) * 12 * t, n = fbm(p*0.004 + t*0.1) * 6.28그대로 붙여 넣는다Paste as is
<대상> 이미지에 입자 붓질 효과를 넣어줘. 격자로 고정 배치한 붓 3000개가 홈 위치의 이미지 색을 가지고, fbm 흐름장을 따라 초속 12px로 5초 동안 이동하며 길이 8px, 폭 2px 사각형으로 흐름 방향에 맞춰 회전하게 해. 3.8초부터 1.2초 동안 sine.inOut으로 홈 위치로 복귀해 원본 이미지가 되게 해.
Add particle painting to the image in <target>. 3000 brush marks placed on a fixed grid carry the image colors at their home positions, move along an fbm flow field at 12px per second for 5 seconds as 8px by 2px rectangles rotated to the flow direction, then return home starting at 3.8 seconds over 1.2 seconds with sine.inOut so the original image is restored.
<파일>의 캔버스에 붓 3000개를 격자로 배치하고 색은 원본 텍스처에서 샘플해. pos=home+flow(home,t)*(1-back), flow=vec2(cos n,sin n)*12*t, n=fbm(p*0.004+t*0.1)*6.28. t는 5초 선형, back은 3.8초부터 1.2초 sine.inOut로 0→1. 1초·3초·5초 캡처로 중간에 회화처럼 흐트러지고 끝에 원본이 복원되는지 확인해.
In the canvas of <file>, place 3000 brushes on a grid and sample their colors from the source texture. pos=home+flow(home,t)*(1-back), flow=vec2(cos n,sin n)*12*t, n=fbm(p*0.004+t*0.1)*6.28. Tween t linearly over 5 s and back 0 to 1 from 3.8 s over 1.2 s sine.inOut. Capture 1 s, 3 s and 5 s to confirm painterly scatter mid-way and full restoration at the end.
HyperFrames · ReelForge · Scrolline
개념 출처와 라이선스. 구현은 이 레포에서 새로 씀Concept sources and licenses. Implementations are original to this repo