디자인 레퍼런스 전체 색인 · 23/27

2,153개 정의·활용·주의사항·출처를 개별 문서로 제공합니다. 이 색인은 JavaScript 없이 탐색할 수 있습니다.

직접 조작 가능한 레퍼런스 291개 보기

• 뷰 전환 스냅샷

  View Transition Snapshot

  화면 상태의 표현을 캡처해 이전·다음 상태 전환에 사용하는 이미지 표현.

• 제스처 구동 전환

  Gesture-driven Transition

  사용자의 끌기·스와이프 진행량에 따라 전환 위치가 결정되는 방식.

• 중단 가능한 전환

  Interruptible Transition

  진행 중 새 입력을 받아 자연스럽게 목표를 바꿀 수 있는 전환.

• 되돌릴 수 있는 전환

  Reversible Transition

  취소나 역방향 입력에 따라 진행 방향을 되돌리는 전환.

• 호버 애니메이션

  Hover Animation

  포인터가 요소 위에 있을 때 변하는 시각 반응.

• 눌림 피드백

  Press Feedback

  버튼을 누르는 순간 크기·색·그림자 등으로 입력을 알리는 반응.

• 포커스 전환 표현

  Focus Transition

  키보드 초점이 이동하거나 활성화될 때의 시각 변화.

• 펄스 애니메이션

  Pulse Animation

  크기·밝기·불투명도가 주기적으로 증감하는 표현.

• 주의 환기 흔들림

  Attention Shake

  요소를 짧게 좌우 등으로 흔들어 주의를 유도하는 표현.

• 위글 애니메이션

  Wiggle Animation

  작은 회전이나 흔들림을 반복하는 표현.

• 진행률 보간

  Progress Interpolation

  진행 값 변화가 시각적으로 끊기지 않게 보간하는 처리.

• 성공 체크 모션

  Success Check Animation

  작업 성공 시 체크 표시가 그려지거나 변형되는 표현.

• 좋아요 버스트

  Like Burst

  선택 시 하트 등 중심에서 작은 요소가 퍼지는 표현.

• 숫자 변화 애니메이션

  Number Ticker

  수치가 굴러가거나 보간되며 바뀌는 표현.

• 애니메이션 토글

  Animated Toggle

  켜짐·꺼짐을 손잡이 이동·색 변화로 보여주는 컨트롤.

• 알림 도착 모션

  Notification Arrival Motion

  새 알림이 들어온 위치와 변화를 보여주는 모션.

• 스크롤 스크러빙

  Scroll Scrubbing

  스크롤 위치로 타임라인의 재생 위치를 앞뒤로 조절하는 방식.

• 스크롤 리빌

  Scroll Reveal

  스크롤로 영역이 보이기 시작할 때 내용을 드러내는 표현.

• 스크롤 고정 연출

  Sticky Pinning

  일정 구간 동안 요소를 고정한 채 주변 콘텐츠나 모션을 진행한다.

• 스크롤 타임라인

  Scroll Timeline

  스크롤 컨테이너의 진행 위치를 애니메이션 시간축으로 사용하는 개념.

• 뷰 타임라인

  View Timeline

  요소가 스크롤 영역에 진입·통과하는 정도를 진행축으로 사용하는 개념.

• 관성 스크롤

  Inertial Scrolling

  입력이 끝난 뒤에도 속도가 감쇠하며 스크롤이 이어지는 동작.

• 오버스크롤 효과

  Overscroll Effect

  콘텐츠 경계 너머로 조작했을 때 반발·늘어남 등을 보여주는 효과.

• 고무줄 반발

  Rubber Banding

  경계 밖으로 끌면 저항이 커지고 놓으면 복귀하는 탄성 동작.

• 드래그 탄성

  Drag Elasticity

  허용 범위 바깥에서 끌림에 대한 저항·변형을 주는 동작.

• 스냅백

  Snap-back

  취소되거나 유효하지 않은 드래그가 원위치로 돌아오는 동작.

• 스냅 지점

  Snap Point

  움직임이 정착하도록 지정한 위치.

• 속도 기반 애니메이션

  Velocity-based Animation

  입력 속도를 다음 이동량·관성·전환에 반영하는 방식.

• 끌어서 닫기

  Drag-to-dismiss

  패널이나 카드를 끌어 임계 조건을 넘기면 제거·닫는 패턴.

• 당겨서 새로고침 모션

  Pull-to-refresh Motion

  끌기 거리·임계 도달·갱신 상태를 시각적으로 연결한다.

• 커서 추종 효과

  Cursor-follow Effect

  오브젝트가 포인터 위치나 움직임을 따라 반응하는 표현.

• 모션 안무

  Motion Choreography

  여러 요소의 시작 순서·경로·강조를 조직하는 설계.

• 시퀀스

  Sequence

  여러 애니메이션을 정해진 순서로 연결한 구성.

• 병렬 애니메이션

  Parallel Animation

  여러 속성이나 요소의 애니메이션을 동시에 진행한다.

• 애니메이션 타임라인

  Animation Timeline

  애니메이션 구간과 이벤트를 시간축에 배치한 구조.

• 보조 모션

  Secondary Motion

  주된 동작을 보강하는 부수적 움직임.

• 모션 위계

  Motion Hierarchy

  중요도에 따라 움직임의 크기·강도·순서를 다르게 두는 설계.

• 공간적 연속성

  Spatial Continuity

  전환 전후 대상의 위치 관계를 이해할 수 있게 유지하는 성질.

• 시간적 연속성

  Temporal Continuity

  동작이 갑자기 끊기거나 어색하게 재시작하지 않도록 이어지는 성질.

• 모션 아크

  Motion Arc

  움직임이 따르는 곡선 경로.

• 애니메이션 루프

  Animation Loop

  끝과 시작을 연결해 반복 재생하는 구성.

• 핑퐁 루프

  Ping-pong Loop

  정방향과 역방향을 번갈아 반복하는 재생 방식.

• 이음매 없는 루프

  Seamless Loop

  반복 경계에서 값이나 속도 차이가 눈에 띄지 않는 루프.

• 모션 토큰

  Motion Token

  지속시간·곡선·스프링·지연 등 재사용 가능한 모션 규칙을 이름으로 관리한 값.

• 모션 선호 설정

  Motion Preference

  사용자가 움직임의 양이나 사용 여부를 선택하는 설정.

• 정적 대체 표현

  Static Fallback

  애니메이션 없이도 같은 의미를 전달하는 정지 상태.

• 필수 애니메이션

  Essential Animation

  제거하면 핵심 정보나 기능이 성립하지 않는 움직임.

• 일시정지·중지 제어

  Pause / Stop Control

  자동 재생 콘텐츠를 사용자가 멈출 수 있도록 하는 조작.

• 번쩍이는 콘텐츠

  Flashing Content

  짧은 시간에 강한 명도 변화가 반복되는 표현.

• 프레임 페이싱

  Frame Pacing

  각 프레임 표시 간격을 일정하게 유지하는 성질.

• 잰크·끊김

  Jank

  프레임 지연 등으로 스크롤이나 애니메이션이 버벅이는 현상.

• 합성 단계 애니메이션

  Compositor Animation

  레이아웃·페인트 작업을 최소화하고 합성 단계에서 처리 가능한 애니메이션.

• 레이아웃 스래싱

  Layout Thrashing

  레이아웃 읽기와 쓰기를 교차해 불필요한 동기 계산을 반복하는 현상.

• 애니메이션 상태 머신

  Animation State Machine

  상태와 전이 조건으로 재생 동작을 결정하는 구조.

• UI 애니메이션 목표 변경

  Animation Retargeting (UI)

  진행 중 현재 상태에서 새로운 목표값으로 자연스럽게 변경하는 처리.

• 애니메이션 취소 처리

  Animation Cancellation

  진행 중 재생을 취소하고 자원·상태를 정리하는 과정.

• 퇴장 생명주기

  Exit Lifecycle

  퇴장 모션이 끝날 때까지 요소를 유지한 뒤 제거하는 처리.

• 백그라운드 제한

  Background Throttling

  보이지 않는 화면에서 애니메이션이나 타이머 실행을 줄이는 동작.

• 모션 명세

  Motion Specification

  트리거·속성·시간·곡선·중단·감소 대안을 기록한 구현 사양.

• 모션 회귀 테스트

  Motion Regression Test

  수정 후 전환·타이밍·종료 상태가 의도대로 유지되는지 검증한다.

• 프레임별 애니메이션

  Frame-by-frame Animation

  장면이나 포즈를 프레임마다 따로 그리거나 지정하는 방식.

• 스프라이트 애니메이션

  Sprite Animation

  2D 이미지 프레임을 바꾸어 움직임을 표현하는 방식.

• 스켈레탈 애니메이션

  Skeletal Animation

  뼈대의 변환으로 메시나 그림 조각을 움직이는 방식.

• 스킨 가중치

  Skin Weight

  각 뼈대가 정점 변형에 미치는 비중.

• 폴 타깃

  Pole Target

  IK 관절이 어느 방향으로 굽을지 정하는 보조 목표.

• 제자리 애니메이션

  In-place Animation

  루트의 전진 이동 없이 걷기 등의 동작을 재생하는 방식.

• 애니메이션 리타기팅

  Animation Retargeting

  한 골격의 동작을 다른 골격에 맞게 이전하는 과정.

• 절차적 애니메이션

  Procedural Animation

  규칙·물리·상황 계산으로 움직임을 생성하는 방식.

• 정점 애니메이션

  Vertex Animation

  뼈대 대신 정점 위치의 변화를 직접 이용하는 애니메이션.

• 정점 애니메이션 텍스처·VAT

  Vertex Animation Texture

  프레임별 정점 변화 데이터를 텍스처에 저장해 재생하는 방식.

• 스미어 프레임

  Smear Frame

  빠른 움직임을 늘어나거나 겹친 형태의 중간 프레임으로 표현한다.

• 애니메이션 스미어

  Animation Smear

  순간 변형이나 잔상으로 동작의 궤적·속도를 강조하는 표현.

• 애니메이션 클립

  Animation Clip

  하나의 동작 구간을 담은 재사용 가능한 애니메이션 자산.

• 블렌드 트리

  Blend Tree

  속도·방향 등의 파라미터로 동작 혼합을 구성하는 구조.

• 블렌드 스페이스

  Blend Space

  파라미터 공간의 위치에 따라 주변 동작을 혼합하는 방식.

• 가산 애니메이션

  Additive Animation

  기본 자세에 추가 변화를 더해 움직임을 합성하는 방식.

• 애니메이션 레이어

  Animation Layer

  신체 일부나 목적별로 동작을 나눠 합성하는 층.

• 애니메이션 마스크

  Animation Mask

  동작이 영향을 미칠 뼈대나 부분을 선택하는 범위.

• 애니메이션 이벤트·노티파이

  Animation Event / Notify

  지정 재생 시점에 소리·이펙트·로직을 실행하는 신호.

• 정규화된 시간

  Normalized Time

  클립 길이와 독립적으로 진행 위치를 비율로 표현한 값.