효과Effects / 전환·컷Transitions / Nº 156

윤곽 추출 스타일 전환Edge Trace Stylization

Edge Trace Stylization

윤곽 추출 스타일 전환

다른 이름Also known as · Find Edges

156

렌더 추가 예정CLIP COMING윤곽 추출 스타일 전환Edge Trace Stylization정의·파라미터·프롬프트는 아래에 있다Definition, parameters and prompts are below

도판Fig. 156. 윤곽 추출 스타일 전환 · Edge Trace Stylization · power2.inOut

사진의 면이 사라지고 경계선만 남은 선화로 바뀌는 윤곽 추출 전환The photo's surfaces vanish, leaving only edges as a line drawing.

무엇을 전하나What it tells

전달 효과ConveysCONVEYS

사진에서 구조로. 형태의 뼈대가 드러나 도해적이고 분석적인 인상을 준다From photo to structure. The skeleton of the form is exposed, giving a diagrammatic, analytical impression.

언제 쓰나Use whenUSE WHEN

제품 사진에서 구조 도해 설명으로 넘어갈 때
실사 이미지를 설계도나 스케치 스타일로 바꿔 보여 줄 때

Move from a product photo to a structural explanation.
Turn a realistic image into a blueprint or sketch look.

과용 주의AvoidAVOID

edge threshold 0.08 미만 금지(노이즈 과다)
선화 상태에서 최소 0.6초 정지해 읽게 한다

분류TagsTAGS

좋은 예와 나쁜 예Good and bad use

좋은 사례GOOD

제품 사진이 0.8초 동안 색이 빠지며 윤곽선만 남은 선화로 바뀌고 그 위에 주석이 붙는다

과용 · 나쁜 사례OVERUSE

임계값이 너무 낮아 노이즈 선이 화면을 덮거나, 임계값이 높아 윤곽이 끊겨 형태를 알 수 없다

파라미터Parameters

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

항목PARAM	기본DEFAULT	범위RANGE	메모NOTE
지속	0.8s	0.5~1.2s	사진에서 선화까지
경계 임계값	0.15	0.1~0.25	Sobel 출력 컷
혼합	0 to 1	0~1	원본색과 선화 mix
선 색	#111827	고정	흰 바탕 기준
선 두께	1.5px	1~2.5px	Sobel 샘플 간격

GSAP

const u = { m: 0 };
tl.to(u, { m: 1, duration: 0.8, ease: 'power2.inOut', onUpdate: draw }, 0.3);
// GLSL: float g = length(vec2(sobelX(tex, uv), sobelY(tex, uv)));
// float line = smoothstep(0.15, 0.30, g);
// col = mix(texture(tex, uv).rgb, mix(vec3(1.0), ink, line), m);

README

에이전트 프롬프트Agent prompts

그대로 붙여 넣는다Paste as is

Claude Code

<대상> 사진에 윤곽 추출 전환을 넣어줘. 0.3초에 시작해 0.8초 동안 power2.inOut으로 원본에서 Sobel 경계선 그림(흰 바탕, 진한 남색 선 #111827)으로 mix가 0에서 1이 되게 해. 임계값은 smoothstep(0.15, 0.30)이고 선화 상태로 0.6초 정지한 뒤 주석 텍스트가 나오게 해.

Add an edge trace transition to the photo in <target>. Starting at 0.3 seconds, mix from the original to a Sobel edge drawing (white paper, dark navy lines #111827) from 0 to 1 over 0.8 seconds with power2.inOut. Threshold smoothstep(0.15, 0.30). Hold the line drawing for 0.6 seconds, then bring in annotation text.

Codex

<파일>의 이미지 캔버스에 edge 셰이더를 추가해. g=length(vec2(sobelX,sobelY)), line=smoothstep(0.15,0.30,g), col=mix(tex, mix(white, ink, line), m). m은 0.3초부터 0.8초 power2.inOut로 0→1. 0.5초·0.9초·1.8초 캡처로 색이 빠지며 윤곽만 남고 노이즈 선이 화면을 덮지 않는지 확인해.

Add an edge shader to the image canvas in <file>. g=length(vec2(sobelX,sobelY)); line=smoothstep(0.15,0.30,g); col=mix(tex, mix(white, ink, line), m). Tween m 0 to 1 from 0.3 s over 0.8 s power2.inOut. Capture 0.5 s, 0.9 s and 1.8 s to confirm color drains, only outlines remain, and noise lines do not flood the frame.