움직임에는 이름이 있습니다. “부드럽고 세련되게”보다 이름 한 단어가 AI 에게 훨씬 정확하게 전달됩니다. 데모로 움직임을 고르고, 이름이 든 요청 문장을 복사해 붙여 넣으세요.
Toast notification
모서리에 한 줄 소식이 올라왔다가 물러난다
Snackbar with undo action
지운 직후 아래에 띠가 올라와 되돌릴 기회를 준다
Stacked toasts (expand on hover)
쌓인 토스트가 카드 더미로 겹쳤다가 포인터를 올리면 펼쳐진다
Promise toast (loading to success)
토스트 하나가 「진행 중」에서 「완료」로 모양을 바꾼다
Dynamic island notification
화면 위 가운데의 알약이 늘어나 알림을 보여 준다
New items pill
피드 위에 「새 글」 알약이 내려와 누르면 맨 위로 올린다
Announcement banner
페이지 맨 위에 띠가 내려와 내용을 밀어 내리고, 닫으면 접힌다
Inline alert (callout)
본문 사이에 안내 상자가 높이를 펼치며 끼어든다
Badge
아이콘 모서리에 새 소식 수가 붙는다
Notification center dropdown
종 아이콘이 흔들리고, 누르면 쌓인 알림 목록이 펼쳐진다
Status chip transition
작은 상태 표시가 「초안 → 검토 중 → 게시됨」으로 색과 글을 바꾼다
Inline validation
치는 동안 입력란 끝에 ! 와 ✓ 가 바뀐다
Shake on invalid input
잘못 제출하면 입력란이 좌우로 흔들리고 테두리가 바뀐다
Error summary with focus jump
폼 위에 오류 목록이 뜨고, 첫 오류 칸으로 포커스가 옮겨 간다
Confirmation dialog
지우기 전에 「정말 삭제할까요?」 창이 떠 한 번 더 묻는다
Action sheet
모바일 아래에서 선택지 목록과 따로 떨어진 취소 버튼이 올라온다
Exit-intent popup
커서가 창 위로 빠져나가려 하면 안내 창이 뜬다
Success screen with checkmark
원이 커지고 체크 표시가 그려지며 축하 조각이 흩날린다
Tooltip
가리키는 동안만 짧은 도움말이 붙는다
Popover
누른 자리 옆에 꼬리 달린 작은 판이 열린다
Coach mark spotlight
화면이 어두워지고 한 요소만 뚫린 채 옆에 설명이 붙는다
Onboarding product tour
밝은 구멍과 말풍선이 단계마다 다음 요소로 옮겨 간다
Hotspots
사진 위 점이 맥박치고 누르면 설명이 뜬다
OS push notification
브라우저 밖, 운영체제 화면 모서리에 앱 알림 카드가 미끄러져 들어온다
Notification permission prompt
주소창 아래에 「알림 허용 · 차단」 상자가 떨어지고, 허용하면 종 표시가 켜진다
Browser tab title alert
다른 탭을 보는 동안 탭 제목 앞에 「(3)」이 깜빡인다
Favicon notification badge
탭의 작은 아이콘 모서리에 색 점이 톡 붙는다
알림 · 피드백 · Inline alert (callout)
칩을 고르면 프롬프트에 덧붙습니다 — 묶음마다 하나씩, 다시 누르면 빠집니다.