효과Effects / 질감·스타일Texture & Style / Nº 498

글자 액체 왜곡Text Liquid Distortion

Text Liquid Distortion

글자 액체 왜곡

다른 이름Also known as · Liquid Text Distortion · 텍스트 액체 왜곡 · SVG Turbulence Text Warp · SVG 난류 텍스트 휨 · Rolling Text Distortion · 텍스트 국소 물결 왜곡

498

렌더 추가 예정CLIP COMING글자 액체 왜곡Text Liquid Distortion정의·파라미터·프롬프트는 아래에 있다Definition, parameters and prompts are below

도판Fig. 498. 글자 액체 왜곡 · Text Liquid Distortion · power2.out

글자의 윤곽과 내부가 노이즈에 따라 출렁이며 휘는 액체 왜곡Stroke edges and interiors bend and ripple with noise.

무엇을 전하나What it tells

전달 효과ConveysCONVEYS

유동적이고 불안정한 상태. 물속에 잠긴 글자처럼 살아 있는 물성이 느껴진다Fluid, unstable, and alive, like letters underwater.

언제 쓰나Use whenUSE WHEN

제목이 물결치듯 등장하거나 사라지는 감성적인 장면
불안정한 상태나 변화 직전의 긴장을 글자로 표현할 때

Emotional scenes where the title ripples in or out
Expressing tension before a change through the text itself

과용 주의AvoidAVOID

변위는 끝에서 반드시 0으로 수렴시킨다. 왜곡이 남으면 글자가 오탈자처럼 보인다
노이즈는 시드 고정. 시간 t만으로 결정되게 한다

분류TagsTAGS

질감·스타일Texture & Style 분위기Mood 주목 끌기Attention 숏폼Short-form 웹 UIWeb UI 난이도 고급Advancedwebgl

좋은 예와 나쁜 예Good and bad use

좋은 사례GOOD

제목이 0.8초 동안 변위 강도 0.15로 출렁이다가 0으로 가라앉아 또렷한 글자가 된다

과용 · 나쁜 사례OVERUSE

변위를 0.5 이상 줘 글자가 알아볼 수 없이 흐트러지고 정지 상태로 돌아오지 않는다

파라미터Parameters

기본값은 클립에 쓴 값Defaults are the values used in the clip

항목PARAM	기본DEFAULT	범위RANGE	메모NOTE
변위 강도	0.15	0~0.2	UV 변위 최대
노이즈 속도	0.5	0.3~0.8	uSpeed
지속	0.8s	0.6~1.2s	강도 감소 구간
시드	0.4	고정	uSeed

GSAP

// fragment: vec2 uv = vUv + amp * (noise(vUv * 6. + uTime * uSpeed) - .5);
const u = {amp:0.15};
tl.to(u, {amp:0, duration:0.8, ease:'power2.out', onUpdate(){ mat.uniforms.uAmp.value = u.amp; mat.uniforms.uTime.value = tl.time(); render(); }}, 0.2);

README

에이전트 프롬프트Agent prompts

그대로 붙여 넣는다Paste as is

Claude Code

<대상> 제목에 액체 왜곡을 넣어줘. 글자를 캔버스 텍스처로 만들고 UV를 노이즈로 변위하되 강도를 0.15에서 0으로 0.8초 동안 power2.out으로 줄여. 노이즈 속도 0.5, 시드 0.4 고정, uTime은 타임라인 시간에서 읽어 seek해도 같은 프레임이 나오게 해.

Add a liquid distortion to the title in <target>. Render the text to a canvas texture and displace UVs with noise, easing amplitude from 0.15 to 0 over 0.8s power2.out. Noise speed 0.5, seed fixed at 0.4, read uTime from the timeline so seeking reproduces frames.

Codex

<파일>에 text liquid distortion을 적용해. 셰이더에서 uv+uAmp*(noise(uv*6+uTime*0.5)-0.5)로 샘플링, uAmp 0.15에서 0을 0.8초 power2.out, uTime=tl.time(). 0.3초·0.7초·1.4초를 캡처해 초반에 왜곡, 종료 후 왜곡 0인지 확인하고 같은 시점 두 번 캡처가 픽셀 동일한지 비교해.

Apply text liquid distortion in <file>. Sample with uv+uAmp*(noise(uv*6+uTime*0.5)-0.5); uAmp 0.15 to 0 over 0.8s power2.out; uTime=tl.time(). Capture at 0.3s, 0.7s and 1.4s to confirm distortion early and zero after settling, and compare two captures of the same time for pixel equality.