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

라인 보일Line Boil

Line Boil

라인 보일

다른 이름Also known as · Hand draw boil · 손그림 보일 · Line boil · Wiggle Paths · 위글 패스 · Roughen Edges · 거친 외곽 · Boiling Line

476

렌더 추가 예정CLIP COMING라인 보일Line Boil정의·파라미터·프롬프트는 아래에 있다Definition, parameters and prompts are below

도판Fig. 476. 라인 보일 · Line Boil · steps(1)

손그림 선이 낮은 프레임 레이트로 미세하게 떨려 살아 있는 듯 보이는 효과Hand-drawn lines jitter slightly at a low frame rate so they look alive.

무엇을 전하나What it tells

전달 효과ConveysCONVEYS

수작업 애니메이션의 불완전한 생동감과 스케치 질감을 준다Gives the imperfect vitality of hand-made animation and a sketch texture.

언제 쓰나Use whenUSE WHEN

손그림 도해나 낙서 스타일 설명 영상에서 정적 선에 생동감을 줄 때
스케치 톤의 브랜드 영상에서 배경 선을 살아 있게 할 때

To bring still lines to life in hand-drawn diagrams or doodle-style explainers
For background lines in sketch-toned brand videos

과용 주의AvoidAVOID

갱신 8fps 초과 금지
진폭 2px 초과 금지
채운 면과 글자에는 걸지 않는다

분류TagsTAGS

질감·스타일Texture & Style 분위기Mood 브랜딩Branding 설명 영상Explainer video 숏폼Short-form 발표Presentation 난이도 기본Basicsvg

좋은 예와 나쁜 예Good and bad use

좋은 사례GOOD

도해 선이 5fps로 위치 ±1px, 회전 0.4도씩만 흔들리고 채움 색은 움직이지 않는다

과용 · 나쁜 사례OVERUSE

진폭을 3px 이상으로 키워 선이 심하게 떨리거나, 24fps로 갱신해 지글거린다

파라미터Parameters

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

항목PARAM	기본DEFAULT	범위RANGE	메모NOTE
갱신율	5fps	4~8fps	프레임 사이 유지
위치 진폭	1px	0.5~2px	x,y 각각
회전 진폭	0.4도	0.2~0.8도	중심 기준
변형 세트	4개	3~6개	feTurbulence seed 순환
displacement scale	3	2~5	SVG 필터 방식

GSAP

/* <feTurbulence baseFrequency=.02 seed=1/> <feDisplacementMap scale=3/> */
const seeds=[1,7,13,29];
for(let f=0;f<Math.ceil(dur*5);f++)
 tl.set('#turb',{attr:{seed:seeds[f%4]}},t+f/5);

README

에이전트 프롬프트Agent prompts

그대로 붙여 넣는다Paste as is

Claude Code

<도해>에 라인 보일을 넣어줘. 선 요소에만 SVG feTurbulence(baseFrequency 0.02)와 feDisplacementMap(scale 3)을 걸고, seed를 1, 7, 13, 29로 5fps 순환시켜 선이 ±1px 정도만 떨리게 해. 채움 면과 텍스트는 제외하고 tl.set 스텝으로 만들어 paused 타임라인에서 seek 가능하게 해.

Add line boil to <diagram>. Apply SVG feTurbulence (baseFrequency 0.02) and feDisplacementMap (scale 3) to line elements only, cycling seed through 1, 7, 13, 29 at 5fps so lines jitter about +/-1px. Exclude filled shapes and text. Use tl.set steps on a paused timeline so it is seekable.

Codex

<파일>의 <도해> 선에 line-boil을 적용해. 5fps, displacement scale 3, seed 4종 순환, 회전 0.4도 상당. 0.0초, 0.2초, 0.4초를 캡처해 프레임마다 선이 미세하게 다른지, 채움과 글자는 같은지, 같은 시점 재렌더가 동일한지 확인해.

Apply line-boil to the lines of <diagram> in <file>: 5fps, displacement scale 3, four seeds cycling, about 0.4 degrees rotation. Capture at 0.0s, 0.2s, and 0.4s to verify lines differ slightly per frame, fills and text stay identical, and re-rendering the same time is identical.