AWESOME AI MOTION
효과Effects / 전환·컷Transitions / Nº 182

모자이크 이동 전환Mosaic Traversal

Mosaic Traversal
모자이크 이동 전환
다른 이름Also known as · Zoom mosaic traversal · 줌 모자이크 이동
182
렌더 추가 예정CLIP COMING모자이크 이동 전환Mosaic Traversal정의·파라미터·프롬프트는 아래에 있다Definition, parameters and prompts are below
도판Fig. 182. 모자이크 이동 전환 · Mosaic Traversal · power3.inOut

영상이 여러 복제 타일로 펼쳐지고 타일 좌표를 따라 이동하며 새 장면으로 들어가는 전환The footage spreads into cloned tiles, travels along the tile grid, and enters the new scene.

01

무엇을 전하나What it tells

전달 효과ConveysCONVEYS
타일 세계를 가로지르는 큰 공간 이동. 화면이 지도처럼 축소됐다 다른 칸으로 진입한다A large move across a tiled world: the frame zooms out like a map and drops into another cell.
언제 쓰나Use whenUSE WHEN
  • 한 장면에서 옆 장면으로 넓은 공간을 이동하는 표현에서
  • 줌 아웃 후 줌 인으로 위치가 바뀌는 느낌이 필요할 때
  • Express a wide spatial move from one scene to a neighboring one.
  • When a zoom-out then zoom-in should relocate the view.
과용 주의AvoidAVOID
  • 타일 수 5x5 초과 금지
  • 줌 아웃 최소 scale 0.33(3x3) 이상 유지
02

좋은 예와 나쁜 예Good and bad use

좋은 사례GOOD

0.9초 동안 화면이 3x3 타일로 줌 아웃되고, 타일 좌표 (endx 2, endy -1)만큼 이동한 뒤 뒤 장면 타일로 줌 인해 들어간다

과용 · 나쁜 사례OVERUSE

이동 중 타일 경계가 어색하게 겹치거나 줌 아웃이 부족해 이동 감각이 없다

03

파라미터Parameters

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

항목PARAM기본DEFAULT범위RANGE메모NOTE
전체 지속0.9s0.7~1.4s줌 아웃 0.3, 이동 0.3, 줌 인 0.3
타일3x32x2~5x5복제 격자
이동(2, -1)타일 좌표x, y 타일 수
이징power3.inOut각 구간 개별
GSAP
tl.to('.world', { scale: 0.33, duration: 0.3, ease: 'power3.in' })
  .to('.world', { x: -1280, y: 720, duration: 0.3, ease: 'power2.inOut' })
  .to('.world', { scale: 1, x: -1920 * 2, y: 1080, duration: 0.3, ease: 'power3.out' });
04

에이전트 프롬프트Agent prompts

그대로 붙여 넣는다Paste as is

Claude Code

<대상A>에서 <대상B>로 모자이크 트래버스 전환을 만들어줘. A와 B를 3x3 타일 world 안에 배치하고 0.3초 동안 scale 1에서 0.33(power3.in)으로 줌 아웃, 0.3초 동안 타일 (2, -1)만큼 이동(power2.inOut), 0.3초 동안 B 타일로 scale 1까지 줌 인(power3.out)해. transform만 쓰고 paused 타임라인 하나.

Build a mosaic traverse from <targetA> to <targetB>. Place A and B in a 3x3 tile world, zoom out from scale 1 to 0.33 over 0.3 seconds (power3.in), move by tile (2, -1) over 0.3 seconds (power2.inOut), then zoom in to scale 1 on B's tile over 0.3 seconds (power3.out). Transforms only, one paused timeline.

Codex

<파일>에 mosaic traverse를 적용해. .world scale 1에서 0.33 (0.3s power3.in), x -1280과 y 720으로 이동 (0.3s power2.inOut), scale 1과 목표 타일 좌표로 줌 인 (0.3s power3.out). 0.3초 캡처에서 3x3 타일이 모두 보이는지, 0.6초에 이동 중인지, 0.9초에 B가 정위치 scale 1인지 확인해.

Apply a mosaic traverse in <file>. .world scale 1 to 0.33 (0.3s power3.in), translate x -1280 and y 720 (0.3s power2.inOut), then zoom to scale 1 at the target tile (0.3s power3.out). Capture at 0.3 seconds to confirm all 3x3 tiles are visible, at 0.6 seconds to confirm mid-move, and at 0.9 seconds to confirm B sits in place at scale 1.

05

도구별로 쓰기In your tools

HyperFrames · ReelForge · Scrolline

HyperFramesVIDEO · GSAP
A, B 장면을 넣은 큰 world 컨테이너를 만들고 x, y, scale만 움직인다. 복제 대신 타일별 컨테이너를 CSS grid에 미리 배치한다
ReelForgeBRIEF TO VIDEO
씬 워커 브리프에 tilesX, tilesY, endTile, phases를 싣고 구간 시간을 파라미터로 한다
Scrolline DeckSCROLL SCRUB
진행률 0~0.33 줌 아웃, 0.33~0.66 이동, 0.66~1 줌 인. 각 구간에서 ease-out으로 스프링 없이
06

잘 맞는 조합Pairs well with

07

출처Sources

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