지나친 모달 팝업은 사용자를 피로하게 만든다

사례로 찾아보는 모달 패널의 나쁜 예

들어가기 앞서, 모달 패널에 대한 정의를 살펴보겠다. 

UX 도서인 '사용자를 끌어들이는 UX/UI의 비밀'에서 모달 의미를 살펴보았다.

모달 패널이란? 

메시지를 확인하고, 폼을 완료하고, 패널을 닫는 것 이외의 다른 내비게이션 옵션이 없는 화면이다.  

보통 전체화면이나, 라이트 박스 형태로 표시된다. 

모달을 제외한 화면은 회색 레이더(dim)으로 덮고 사용자가 사용할 수 없다. 

언제 사용하는가?

특정 액션이나 프로세스에 집중하게 할 때 사용되면 좋다.

특정 프로세스를 진행하는 과정에서 작은 테스크을 수행 후에 기존 프로세스로 돌아오게 하려고 할 때, 

예) 장바구니 담을 때, 로그인이 안된 경우 

모달 패널의 효과
- 사용자가 모달 외 다른 네비게이션 옵션을 쓸 수 없도록 한다.
- 당장 모달 패널을 처리하도록 한다.
- 적절히 사용할 경우, 모달 패널은 사용자가 결정해야 하는 내용에 주의를 집중하도록 한다. 

모달 패널은 다양한 경우에서 사용자에게 특정 액션을 유도할 때에 유용하게 사용된다. 

하지만 때때로 사용자가 원치 않는 모달 패널의 팝업으로, 사용자를 불편하게 만들 때가 있다. 

커머스에 접속하자마자 나타나는
모달 패널은 때때로 사용자를 피로하게 만든다.

이미 우리의 경험 속 커머스/쇼핑몰에 접속하자 마자 나타나는 모달 패널에 대한 경험이 지속되어 왔고, 이제는 내용을 확인하기도 전에 '닫기'를 눌러버리는 현상이 나타나고 있다.

                    

사용자의 Context에 맞지 않는 모달은 특정 액션에 집중하게 만들기보단 피로한 경험을 제공할 수 있다.

이와 관련해서, 지인들을 대상으로 의견을 받아보았다. 

"쇼핑몰/커머스 들어가자마자 뜨는 팝업에 대한 의견"을 물었을 때, 79명 중 84%(66명)은 무엇인지 보지 않고 팝업을 닫는다고 답변했다. 

인스타그램 스토리를 통해 의견을 받아보았다

상세하게 의견을 물었을 때 대부분 의견은 3가지로 정리되었다. 

의견1. 팝업은 장애물이다. 나의 목적에 방해가 된다고 느껴진다.
- 다양한 상품을 판매하는 커머스의 경우 접속 목적과 다른 모달 패널이 노출된 경험이 많아, 보지 않고 빠르게 꺼버리는 습관이 되었다.

의견2. 필요하지 않은 행사라는 생각에 바로 끈다
- 팝업 외에도 다른 구좌에서 노출되고 있을 거라는 생각에 팝업은 중요하지 않다고 생각하고 닫아버리는 경우가 많다. 

의견3. 쿠폰이면 일단 받지만, 이외의 경우 광고라는 거부감에 일단 끈다.
- 쿠폰과 같이 할인에 도움이 되는 내용은 바로 받지만, 이외에 나와 관련 없어보이는건 바로 끈다.

이미 사용자에게는 앱을 접속하면 뜨는 팝업에 대한 수차례 경험이 있다. 그렇기 때문에 접속 즉시 뜨는 팝업은 때때로 불필요한 경험을 줄 수 있다는 점을 유의하여 모달패널을 구성해야 한다.

개인적으로, 접속 즉시에 모달 패널을 띄워야 하는 상황에서는, 화면 전체를 가리지 않는 bottom sheet 모달이 가장 덜 불편함을 준다고 생각한다. 

화면을 완전히 가리지 않으면서, Dim 되어있는 영역을 클릭하면 모달을 닫을 수 있는데, 닫을 수 있는 영역이 크다보니 비교적 피로를 덜 준다고 생각한다.

미친 혼종의 사례 : 탈잉 모바일 웹 접속 화면

관련 사례를 찾다가 과다한 모달 패널의 끝판왕을 발견했다. 아래 사례로 살펴보도록 하자.

모달 패널로 인한 레이어가 무려 3개나 되다보니, 메인 화면을 접속하는 데 까지 3번의 닫기를 눌러야만 했다. 

물론 모달 패널을 노출 시킬 만한 이유가 있었다고 본다. 

1. 상단의 앱 다운로드 유도 모달 패널 : 모바일 웹으로 접속한 경우에 한해 노출되는 팝업일 것이다.

2. 가입 유도 모달 패널 : 로그인이 되지 않은 경우에 팝업되었을 것이라고 본다. 

3. 클래스 추천 모달 패널 : 아무래도 이건 별다른 조건 없이 팝업 되는 것으로 보인다. 

적어도, 사용자를 지치게 만들지 않으려면, 위 모달 팝업이 세가지 중 우선순위가 가장 높은 하나만 뜨게 하거나, 동시가 아니라 순차적으로 특정 액션을 했을 경우에 뜨도록 해야한다. 

나는 모바일 웹 화면에 접속이라는 액션 외에는 그 어떤 액션도 하지 않았는데에 3가지 모달 패널이 팝업되었다. 팝업을 모두 보기도 전에 사용자가 도망가려는 것을 막기 위해서는, 한 가지 액션에 대해서는 하나의 팝업만 뜨도록 제한하는 장치가 필요하다고 생각한다.

결론

1. 사용자가 가려는 길(목적)에 방해되는 모달은 불편함을 줄 수 있다. 

2. 1번과 같은 경험이 반복된다면, 묻지도 따지지도 않고 모달 패널을 닫게 될 수 있다. 

3. 한 액션에 대해 1개를 초과한 팝업을 띄우지 않도록 적절한 장치를 추가해야 한다.