서비스를 사용하다 보면
저장, 삭제, 추가, 알림 같은 즉각적인 피드백 UI를 자주 마주하게 됩니다.
이때 가장 많이 쓰이는 컴포넌트가 바로
다이얼로그(Dialog), 배너(Banner), 스낵바(Snackbar/Toast) 입니다.
1. 다이얼로그 (Dialog)
1️⃣ 특징
- 화면 중앙에 표시
- 사용자의 행동을 반드시 요구
- 다른 UI와의 상호작용을 일시적으로 차단
2️⃣ 활용
- 삭제 / 로그아웃 / 결제 확인
- 되돌릴 수 없는 중요한 액션
핵심: “사용자의 명확한 선택이 필요한 상황”

2. 배너 (Banner)
1️⃣ 특징
- 화면 상단 또는 하단에 노출
- 콘텐츠 흐름을 완전히 방해하지 않음
- 비교적 지속적으로 표시 가능
2️⃣ 활용
- 새 앨범 출시 알림
- 시스템 공지
- 이벤트 안내
핵심: “중요하지만 당장 응답이 필요하지 않은 정보”

3. 스낵바 / 토스트 팝업 (Snackbar / Toast)
1️⃣ 특징
- 화면 하단에 잠깐 노출
- 자동으로 사라짐
- 사용 흐름을 거의 방해하지 않음
2️⃣ 활용
- 재생목록에 곡 추가
- 저장 완료
- 간단한 상태 알림
핵심: “행동에 대한 즉각적인 결과 피드백”

정리하면
| 컴포넌트 | 사용자 개입 | 사용 목적 |
| 다이얼로그 | 필수 | 중요한 결정 |
| 배너 | 선택 | 정보 전달 |
| 스낵바 | 불필요 | 즉각적 피드백 |
좋은 피드백 UI는
사용자 흐름을 끊지 않으면서도,
필요한 메시지를 정확히 전달한다.
- 반드시 선택이 필요하면 → 다이얼로그
- 조용히 알려주고 싶다면 → 배너
- 행동 결과만 전달하면 → 스낵바
이 기준만 지켜도 UI는 훨씬 자연스러워집니다.
'웹 개발 기본 & 디자인' 카테고리의 다른 글
| [UI 디자인] 사용자에 정보 전달: 아코디언, 드롭다운 (0) | 2025.12.13 |
|---|---|
| [UI 디자인] 사용자에게 정보 전달: 캐러셀, 페이지네이션 (0) | 2025.12.13 |
| [UI 디자인] 사용자 입력 컴포넌트 (0) | 2025.12.13 |
| [UI 디자인] 컴포넌트 정리: 라디오 버튼, 체크박스 , 토글 스위치 (0) | 2025.12.13 |
| [UI 디자인] 버튼 타입 개념 (0) | 2025.12.13 |