AWESOME AI MOTION
효과Effects / 원리 도해Explainer / Nº 386

대상 추적 박스Object Tracking Box

Object Tracking Box
대상 추적 박스
다른 이름Also known as · AI tracking box · AI 추적 상자 · Ai Tracking Box · AI 추적 박스
386
렌더 추가 예정CLIP COMING대상 추적 박스Object Tracking Box정의·파라미터·프롬프트는 아래에 있다Definition, parameters and prompts are below
도판Fig. 386. 대상 추적 박스 · Object Tracking Box · sine.inOut

모서리 표시 상자가 대상의 움직임을 따라가고 크기와 신뢰도 수치가 조금 변한다.A bounding box follows the position and size of a subject.

01

무엇을 전하나What it tells

전달 효과ConveysCONVEYS
기계가 대상을 인식하고 추적함을 보여준다.Shows that a system recognizes and tracks an object.
언제 쓰나Use whenUSE WHEN
  • 움직이는 제품과 추적 박스가 동일 좌표로 이동한다.
  • 기계가 대상을 인식하고 추적함을 보여준다. 기준값과 대상을 함께 표시할 때.
  • Explain object detection and tracking.
  • Keep the encoded values, labels, and visual state synchronized.
과용 주의AvoidAVOID
  • 예시 신뢰도는 측정값처럼 제시하지 않는다.
02

좋은 예와 나쁜 예Good and bad use

좋은 사례GOOD

움직이는 제품과 추적 박스가 동일 좌표로 이동한다.

과용 · 나쁜 사례OVERUSE

박스가 대상보다 늦게 움직이며 추적에 성공했다고 표시한다.

03

파라미터Parameters

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

항목PARAM기본DEFAULT범위RANGE메모NOTE
박스 크기300px180~400px대상 경계 기준
이동 진폭100px40~160px대상과 좌표 공유
주기3000ms2000~5000ms역탐색 가능
신뢰도97%0~100%실제 값 또는 예시 표기
GSAP
const tl=gsap.timeline({paused:true});
tl.to(['.subject','.tracking-box'],{x:100,duration:1.5,ease:'sine.inOut'},0);
tl.to(['.subject','.tracking-box'],{x:0,duration:1.5,ease:'sine.inOut'},1.5);
04

에이전트 프롬프트Agent prompts

그대로 붙여 넣는다Paste as is

Claude Code

<파일>의 <대상>에 대상 추적 박스을 적용해. 고정 시간 함수로 대상과 상자 좌표, 크기와 라벨을 함께 계산한다. 박스 크기 300px; 이동 진폭 100px; 주기 3000ms; 신뢰도 97%을 적용한다. GSAP 코어의 paused 타임라인 하나로 seek 가능하게 만들고 임의 난수와 타이머를 쓰지 마.

Implement Object Tracking Box on <target> in <file>. Use a 300px tracking box, 100px motion amplitude, and a 3000ms cycle. Move the subject and box together and label the 97% confidence as an example unless measured. Use one paused GSAP core timeline, support seeking, and avoid random values and timers.

Codex

<파일>의 설명 장면에서 <대상>에 대상 추적 박스을 적용해. 고정 시간 함수로 대상과 상자 좌표, 크기와 라벨을 함께 계산한다. 박스 크기 300px; 이동 진폭 100px; 주기 3000ms; 신뢰도 97%을 적용한다. 0초, 1.5초, 3초를 캡처해 시작 상태, 중간 진행, 최종 상태를 확인하고 같은 시각으로 다시 seek했을 때 좌표와 라벨이 같은지 검증해.

Implement Object Tracking Box on <target> in <file>. Use a 300px tracking box, 100px motion amplitude, and a 3000ms cycle. Move the subject and box together and label the 97% confidence as an example unless measured. Use one paused GSAP core timeline, support seeking, and avoid random values and timers. Capture at 0s, 1.5s, and 3s to check the initial state, intermediate motion, and final state. Seek to each time again and verify identical geometry and labels.

05

도구별로 쓰기In your tools

HyperFrames · ReelForge · Scrolline

HyperFramesVIDEO · GSAP
paused 타임라인에 대상 추적 박스 상태를 넣고 seek 시 3초의 좌표와 색을 다시 계산한다.
ReelForgeBRIEF TO VIDEO
씬 워커 브리프에 박스 크기 300px; 이동 진폭 100px; 주기 3000ms; 신뢰도 97%을 싣고 움직이는 제품과 추적 박스가 동일 좌표로 이동한다.
Scrolline DeckSCROLL SCRUB
진행률 0~1을 3초 구간에 매핑한다. scrub에서는 스프링 대신 power2.out을 쓰고 역방향에서도 라벨과 도형을 함께 갱신한다.
06

잘 맞는 조합Pairs well with

07

출처Sources

개념 출처와 라이선스. 구현은 이 레포에서 새로 씀Concept sources and licenses. Implementations are original to this repo