제스처·상호작용
각 항목을 클릭하면 시각 예시·비교·원문을 볼 수 있습니다.
드래그 앤 드롭 Drag and Drop
대상을 잡아 이동하고 특정 위치에 놓는 방식.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
스와이프 제스처 Swipe Gesture
손가락을 밀어 화면·항목을 이동하거나 동작 실행.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
길게 누르기 Long Press
손가락을 일정 시간 유지해 추가 동작 호출.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
두 번 탭 Double Tap
화면 요소를 빠르게 두 번 터치하는 제스처.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
핀치 확대·축소 Pinch to Zoom
두 손가락 간 거리를 바꿔 화면을 확대·축소.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
당겨서 새로고침 Pull to Refresh
목록을 아래로 당겨 새 데이터를 요청.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
밀어서 닫기 Swipe to Dismiss
알림·카드·패널을 밀어 제거.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
스와이프 액션 Swipe Actions
목록 항목을 밀어 삭제·보관 등 동작 노출.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
재정렬 목록 Reorderable List
드래그로 항목 순서를 변경.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
드래그 정렬 Sort by Dragging
끌어 놓기 방식으로 순서를 지정.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
키보드 단축키 Keyboard Shortcut
키 조합으로 명령을 빠르게 실행.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
문맥 동작 Contextual Actions
현재 선택한 대상과 관련된 명령만 표시.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
호버 시 노출 Hover Reveal
마우스 오버 때 숨겨진 보조 액션을 표시.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
실행 취소·다시 실행 Undo / Redo
이전 변경을 되돌리거나 재적용.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
확인 패턴 Confirmation Pattern
위험한 명령 실행 전에 재확인하는 흐름.
제스처·상호작용에 해당하는 화면·상태·상호작용을 명세할 때 사용한다.
동일한 명칭도 플랫폼·디자인 시스템마다 세부 동작이 다를 수 있다. 키보드·보조기술·오류 상태를 함께 설계한다.
디바운스 Debounce
연속 입력 뒤 일정 시간 지나 마지막 작업만 처리하는 전략.
디자인 구현이 실제 브라우저에서 빠르고 일관되게 작동하도록 구조를 정한다.
프레임워크 이름과 렌더링 전략은 별개다. 측정 조건 없이 성능 우위를 단정하지 않는다.
스로틀 Throttle
짧은 시간에 반복되는 작업의 최대 실행 빈도를 제한하는 처리.
디자인 구현이 실제 브라우저에서 빠르고 일관되게 작동하도록 구조를 정한다.
프레임워크 이름과 렌더링 전략은 별개다. 측정 조건 없이 성능 우위를 단정하지 않는다.
Gestures & Interaction
Open an entry for its visual reference, comparisons and source-language text.
Drag and Drop 드래그 앤 드롭
An interaction in which an item is grabbed, moved, and released at a destination.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Swipe Gesture 스와이프 제스처
A finger-sliding gesture that moves content or triggers an action.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Long Press 길게 누르기
Holding a touch for a period of time to invoke an additional action.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Double Tap 두 번 탭
Touching an element twice in quick succession.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Pinch to Zoom 핀치 확대·축소
Changing the distance between two fingers to zoom in or out.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Pull to Refresh 당겨서 새로고침
Pulling a list downward to request fresh data.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Swipe to Dismiss 밀어서 닫기
Swiping a notification, card, or panel away to dismiss it.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Swipe Actions 스와이프 액션
Swiping a list item to expose actions such as Delete or Archive.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Reorderable List 재정렬 목록
A list whose item order can be changed by dragging.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Sort by Dragging 드래그 정렬
Specifying an order through drag-and-drop interactions.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Keyboard Shortcut 키보드 단축키
A key combination that executes a command quickly.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Contextual Actions 문맥 동작
Commands relevant to the currently selected object or context.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Hover Reveal 호버 시 노출
Revealing otherwise hidden secondary actions when the pointer hovers.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Undo / Redo 실행 취소·다시 실행
Reversing a previous change or reapplying a reversed change.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Confirmation Pattern 확인 패턴
A flow that reconfirms intent before executing a risky command.
Specifying gestures and interactions.
Detailed behavior can differ across platforms and design systems despite identical names. Design keyboard, assistive-technology, and error behavior together.
Debounce 디바운스
Waiting for a pause in repeated input, then processing only the final action.
Structuring a design so it runs quickly and consistently in actual browsers.
Framework names and rendering strategies are separate concepts. Do not claim performance superiority without specifying measurement conditions.
Throttle 스로틀
Limiting how frequently an action can run during rapid repeated input.
Structuring a design so it runs quickly and consistently in actual browsers.
Framework names and rendering strategies are separate concepts. Do not claim performance superiority without specifying measurement conditions.