모달(Modal)
모달은 웹 페이지나 앱에서 정보나 옵션을 보여주기 위해 현재 화면 위에 나타나는 작은 창이나 팝업 창을 의미합니다.
사용자가 모달 안의 작업을 완료하기 전까지는 기본 화면의 다른 부분을 조작할 수 없게 하는 것이 일반적입니다.
언제 사용하나요?
모달은 주로 다음과 같은 상황에서 사용됩니다.
-
정보 제공: 사용자가 요청하는 추가 정보나 세부 사항을 제공할 때
-
확인 메시지: 사용자가 수행한 작업에 대한 확인이나 경고 메시지를 보여줄 때
-
입력 요청: 사용자에게 추가 입력을 요청하거나 양식을 제출하게 할 때
-
설정 및 옵션: 사용자가 설정이나 옵션을 변경할 수 있는 인터페이스를 제공할 때
모달의 특징
-
사용자의 주목: 모달의 내용을 먼저 확인하고 처리해야 하므로, 사용자의 주목을 끌기에 좋습니다.
-
사용자와의 상호 작용: 모달은 일시적으로 등장하며, 사용자가 필요한 작업을 완료하면 사라집니다.
-
배경 차단: 모달이 활성화되면 배경에 있는 내용은 일시적으로 사용할 수 없게 됩니다. 이는 대개 흐린 배경 또는 '오버레이(Overlay)'를 통해 시각적으로 표현됩니다.
사용 시 주의점
모달은 사용자의 작업 흐름을 중단시킬 수 있기 때문에 신중하게 사용해야 합니다.
-
불필요하게 자주 나타나게 하지 않도록 주의해야 합니다.
-
모달 내의 내용은 간결하고 명확해야 합니다.
-
사용자가 쉽게 닫을 수 있도록 '닫기' 버튼이나 아이콘을 명확하게 표시해야 합니다.
다음 내용이 궁금하다면?
코드프렌즈 PLUS 멤버십 가입 or 강의를 등록해 주세요!