효과Effects / 등장·퇴장Entrance & Exit / Nº 033

코너 매트 스윙Corner Mask Swing

Corner Mask Swing

코너 매트 스윙

다른 이름Also known as · corner-swing-mask

033

렌더 추가 예정CLIP COMING코너 매트 스윙Corner Mask Swing정의·파라미터·프롬프트는 아래에 있다Definition, parameters and prompts are below

도판Fig. 033. 코너 매트 스윙 · Corner Mask Swing · power3.out

가리는 판이 모서리를 축으로 회전하며 뒤의 내용을 연다.An opaque cover rotates around a corner to reveal content.

무엇을 전하나What it tells

전달 효과ConveysCONVEYS

문이나 덮개를 젖히는 공개를 느낀다.Suggests lifting a lid or swinging a door aside.

언제 쓰나Use whenUSE WHEN

덮개를 젖혀 제품을 공개할 때
모서리 방향을 강조하는 전환에 쓸 때

Use when presenting corner mask swing in a content reveal scene.
Use for a focused title, image, or card with a clearly visible final state.

과용 주의AvoidAVOID

판 크기가 작아 시작부터 사진 일부가 노출된다.
완료 자세에서 내용이 가려지지 않게 한다.

분류TagsTAGS

등장·퇴장Entrance & Exit 주목 끌기Attention 전환Transition 설명 영상Explainer video 웹 UIWeb UI 숏폼Short-form 난이도 중급Intermediategsap

좋은 예와 나쁜 예Good and bad use

좋은 사례GOOD

불투명 덮개가 좌상단 축으로 돌아 사진을 연다.

과용 · 나쁜 사례OVERUSE

판 크기가 작아 시작부터 사진 일부가 노출된다.

파라미터Parameters

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

항목PARAM	기본DEFAULT	범위RANGE	메모NOTE
지속	0.6s	0.42~0.84s	0초부터 시작하는 공개 구간
회전	90deg	80~110deg	가림판을 프레임 밖으로 회전
앵커	0% 0%	네 모서리	판 크기는 프레임 덮음
이징	power3.out	power2.out, power3.out, sine.inOut	움직임의 가속과 감속

GSAP

gsap.set('.frame', {overflow:'hidden'});
gsap.set('.cover', {transformOrigin:'0% 0%', rotation:0});
tl.to('.cover', {rotation:90, duration:0.6, ease:'power3.out'}, 0);

README

에이전트 프롬프트Agent prompts

그대로 붙여 넣는다Paste as is

Claude Code

<파일>에서 <대상>에 코너 매트 스윙을 적용해. 0.6초, 회전 90deg; 앵커 0% 0%, 이징 power3.out로 구현해. paused 타임라인으로 seek 가능하게 하고 완료 자세를 유지해.

Apply Corner Mask Swing to <target> in <file>. Use a 0.6s segment with power3.out; implement these explicit settings: Rotation: 90deg, Transform origin: 0% 0%. Use a paused, seekable timeline and hold the final pose.

Codex

<파일>의 <대상> 레이어에 코너 매트 스윙을 적용해. 0.6초, 회전 90deg; 앵커 0% 0%, power3.out를 사용하고 0초, 0.3초, 0.6초 캡처로 시작값, 중간 변화, 완료 자세를 확인해. 동일 시점을 두 번 seek해 같은 결과인지 검증해.

Apply Corner Mask Swing to the <target> layer in <file> with Rotation: 90deg, Transform origin: 0% 0%, using the supplied core snippet and a 0.6s segment with power3.out. Capture at 0s, 0.3s, and 0.6s to verify the initial pose, intermediate change, and final pose. Seek to the same timestamp twice and confirm identical output.