효과Effects / 반복·앰비언트Loop & Ambient / Nº 582

브리딩 루프Breathing Loop

Breathing Loop

브리딩 루프

다른 이름Also known as · Ambient breath · 미세 호흡과 부유 · Idle Breathe · 미세 브리딩 · offset-origin-idle-breathe · sine-wave-loop · svg-icon-enrichment · breathing-hold · Yoyo ambient loop · 왕복 앰비언트 루프 · Ping Pong Loop · 핑퐁 루프 · loopOut pingpong

582

렌더 추가 예정CLIP COMING브리딩 루프Breathing Loop정의·파라미터·프롬프트는 아래에 있다Definition, parameters and prompts are below

도판Fig. 582. 브리딩 루프 · Breathing Loop · sine.inOut

멈춘 요소가 아주 작은 크기와 위치 변화를 반복한다.A resting element repeats subtle scale and position changes.

무엇을 전하나What it tells

전달 효과ConveysCONVEYS

정지 상태의 생명감과 분위기를 유지한다.Keeps an idle scene feeling alive.

언제 쓰나Use whenUSE WHEN

대기 중인 캐릭터를 유지할 때
히어로 아이콘에 미세한 생동감을 줄 때

Use when presenting breathing loop in a waiting or ambient scene.
Use for a compact status indicator with a stable surrounding layout.

과용 주의AvoidAVOID

표의 숫자가 계속 커졌다 작아져 비교하기 어렵다.
정보를 읽는 동안 반복 진폭을 키우지 않는다.

분류TagsTAGS

반복·앰비언트Loop & Ambient 피드백Feedback 분위기Mood 설명 영상Explainer video 웹 UIWeb UI 숏폼Short-form 난이도 기본Basicgsap

좋은 예와 나쁜 예Good and bad use

좋은 사례GOOD

마스코트가 2.4초마다 1.2% 커졌다 돌아온다.

과용 · 나쁜 사례OVERUSE

표의 숫자가 계속 커졌다 작아져 비교하기 어렵다.

파라미터Parameters

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

항목PARAM	기본DEFAULT	범위RANGE	메모NOTE
주기	2.4s	1.68~3.36s	유한 구간을 호스트 시간으로 반복
크기 진폭	0.012	0.004~0.02	기본 크기 1에 더함
상하 진폭	2px	0~4px	본문은 고정
이징	sine.inOut	power2.out, power3.out, sine.inOut	움직임의 가속과 감속

GSAP

gsap.set('.target', {scale:1, y:0});
tl.to('.target', {scale:1.012, y:-2, duration:1.2, ease:'sine.inOut'}, 0);
tl.to('.target', {scale:1, y:0, duration:1.2, ease:'sine.inOut'}, 1.2);

README

에이전트 프롬프트Agent prompts

그대로 붙여 넣는다Paste as is

Claude Code

<파일>에서 <대상>에 브리딩 루프을 적용해. 2.4초, 크기 진폭 0.012; 상하 진폭 2px, 이징 sine.inOut로 구현해. paused 타임라인으로 seek 가능하게 하고 반복은 유한 구간의 지역 시간으로 계산해.

Apply Breathing Loop to <target> in <file>. Use a 2.4s segment with sine.inOut; implement these explicit settings: Scale amplitude: 0.012, Vertical amplitude: 2px. Use a paused, seekable timeline and repeat through local timeline time.

Codex

<파일>의 <대상> 레이어에 브리딩 루프을 적용해. 2.4초, 크기 진폭 0.012; 상하 진폭 2px, sine.inOut를 사용하고 0초, 1.2초, 2.4초 캡처로 시작값, 중간 변화, 완료 자세를 확인해. 동일 시점을 두 번 seek해 같은 결과인지 검증해.

Apply Breathing Loop to the <target> layer in <file> with Scale amplitude: 0.012, Vertical amplitude: 2px, using the supplied core snippet and a 2.4s segment with sine.inOut. Capture at 0s, 1.2s, and 2.4s to verify the initial pose, intermediate change, and final pose. Seek to the same timestamp twice and confirm identical output.