[Article] 팝업과 모달

* 팝업 (Popup) : Pop 하고 튀어나오는 웹 페이지 표시 방법, 새로운 웹 페이지 창을 하나 더 추가하는 방식

* 모달(Modal) : 한 페이지에서 상위 레이어를 띄우는 방식, 기존 페이지 + 새 레이어 
(이 때 레이어를 종료하지 않는 이상 기존 페이지는 작동 불가능) 

* 논 모달(Non-Modal) : 모달과 방식은 동일하지만 레이어를 종료하지 않아도 기존 페이지 작동 가능 

 

모달의 두 가지 종류, 

* 백그라운드가 어둡게 처리된 상태 딤드

모달에는 기존 페이지를 작동할 수 있냐, 없냐를 기준으로 모달과 논 모달으로 나뉜다. 

즉 다이얼로그(Alert, Simple 등)는 모달 형식, 시트(Side, Bottom)는 모달/논 모달 혼용, 스낵바(Banner, Menu, Tooltip)는 논 모달 형식으로 나타낸다. 

 

---

 

모달(모달리티)의 개념을 간과하거나 대충 짚고 넘어가는 경우가 꽤 있는 것 같다.

모달과 논 모달의 개념은 생소할 것 같은데.. 나 역시 아티클을 읽으며 접했다는 사실 .. 

물론 모달과 팝업의 차이도 수업에서 듣기 전까지는 몰랐지만 .. 저번 수업에서 튜터님이 한 번 상기시켜주셔서 이번에는 기억할 수 있었다.

 

UXUI 디자이너라면 이런 용어들의 개념을 분명하게 알고 넘어가는 것이 좋겠다. 

디자인을 감으로 하는 것도 중요하지만 정확한 개념을 알고 있다면 더욱 도움이 되지 않을까?

 

구글 머티리얼 디자인 가이드의 중요성을 깨닫는 요즘이다.

머티리얼 디자인 가이드와 휴먼 인터페이스 가이드라인의 정독이 정말 필요하구나! 

시간을 내어 머티리얼 디자인 가이드부터 차근차근 개념 정리를 해야겠다. 

 

 

---

https://brunch.co.kr/@tigrisdesign/3

모달과 팝업, 정확히 알아야 하는 이유