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

불확정 프로그레스Indeterminate Progress

Indeterminate Progress

불확정 프로그레스

다른 이름Also known as · Indeterminate loading sweep · 불확정 로딩 쓸기 · 무정량 진행 막대

584

렌더 추가 예정CLIP COMING불확정 프로그레스Indeterminate Progress정의·파라미터·프롬프트는 아래에 있다Definition, parameters and prompts are below

도판Fig. 584. 불확정 프로그레스 · Indeterminate Progress · sine.inOut

짧은 밝은 막대가 트랙을 반복해서 지나간다.A bright bar repeatedly sweeps across a clipped track.

무엇을 전하나What it tells

전달 효과ConveysCONVEYS

정확한 완료율 없이 진행 중임을 전달한다.Shows activity when the completion percentage is unknown.

언제 쓰나Use whenUSE WHEN

업로드 준비처럼 완료율을 모를 때
데이터 요청이 진행 중임을 표시할 때

Use when presenting indeterminate progress 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 난이도 기본Basiccss

좋은 예와 나쁜 예Good and bad use

좋은 사례GOOD

밝은 막대가 1.5초 동안 트랙을 지나며 폭을 바꾼다.

과용 · 나쁜 사례OVERUSE

실제 완료율이 있는데도 불확정 막대만 보여준다.

파라미터Parameters

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

항목PARAM	기본DEFAULT	범위RANGE	메모NOTE
주기	1.5s	1.05~2.1s	유한 구간을 호스트 시간으로 반복
막대 폭	20~60%	15~65%	가운데에서 최대 폭
트랙 이동	100%	100~120%	트랙 오른쪽으로 완전히 퇴장
이징	sine.inOut	power2.out, power3.out, sine.inOut	움직임의 가속과 감속

GSAP

gsap.set('.track', {overflow:'hidden'});
gsap.set('.bar', {left:'-20%', width:'20%'});
tl.to('.bar', {left:'20%', width:'60%', duration:0.75, ease:'sine.inOut'}, 0);
tl.to('.bar', {left:'100%', width:'20%', duration:0.75, ease:'sine.inOut'}, 0.75);

README

에이전트 프롬프트Agent prompts

그대로 붙여 넣는다Paste as is

Claude Code

<파일>에서 <대상>에 불확정 프로그레스을 적용해. 1.5초, 막대 폭 20~60%; 트랙 이동 100%, 이징 sine.inOut로 구현해. paused 타임라인으로 seek 가능하게 하고 반복은 유한 구간의 지역 시간으로 계산해.

Apply Indeterminate Progress to <target> in <file>. Use a 1.5s segment with sine.inOut; implement these explicit settings: Bar width: 20~60%, Track travel: 100%. Use a paused, seekable timeline and repeat through local timeline time.

Codex

<파일>의 <대상> 레이어에 불확정 프로그레스을 적용해. 1.5초, 막대 폭 20~60%; 트랙 이동 100%, sine.inOut를 사용하고 0초, 0.75초, 1.5초 캡처로 시작값, 중간 변화, 완료 자세를 확인해. 동일 시점을 두 번 seek해 같은 결과인지 검증해.

Apply Indeterminate Progress to the <target> layer in <file> with Bar width: 20~60%, Track travel: 100%, using the supplied core snippet and a 1.5s segment with sine.inOut. Capture at 0s, 0.75s, and 1.5s to verify the initial pose, intermediate change, and final pose. Seek to the same timestamp twice and confirm identical output.