brunch

You can make anything
by writing

C.S.Lewis

by UX 컨설턴트 전민수 Sep 06. 2016

스위치 또는 체크박스 UX 설계 원칙

UX 디자인 배우기 #30

Today UX 아티클


UX Movement에 게재된 Anthony의 글 When to Use a Switch or Checkbox를 소개하고자 합니다.


같은 기능, 다른 맥락



샐러드용 포크와 메인 코스용 포크는 매우 비슷하게 생기고 같은 기능을 하기 때문에 언제 어떤 걸 써야 할지 헷갈리는데, 스위치와 체크박스도 마찬가지라고 합니다. 많은 디자이너들이 언제 어떤 걸 써도 상관없다고 생각하지만, 유저가 이 두 가지를 보는 즉시 기대하는 바는 다르다고 합니다. 맥락에 맞춰 활용해야 인터페이스를 직관적으로 만들 수 있다고 합니다. 


즉각적인 액션(instantaneous actions)을 위한 스위치


스위치는 언제나 설정의 on/off를 나타낸다고 합니다. 유저가 스위치를 on으로 돌렸을 때는 on 레이블이 뜨자마자 액션이 즉시 취해졌을 것으로 기대한다고 합니다. 이는 UI뿐만 아니라 현실에서도 마찬가지라고 합니다. 스위치를 올리면 바로 전등이 들어올 것이라고 기대하며, 반응이 늦어지거나 추가적인 액션을 필요로 하는 경우엔 무언가 잘못되었다고 생각한다고 합니다. 




스위치를 조작하면 이미 원하는 설정이 반영된다고 기대하기 때문에, 설정을 적용하는 ‘확인(submit)’ 버튼은 절대 없어야 한다고 합니다. 즉, 스위치는 설정이 즉시 반영되어야 하는 경우에만 이용해야 하며, 설정 반영 전에 확인 절차가 필요한 경우는 체크박스를 이용해야 한다고 합니다.


버튼을 눌러야 하는 체크박스


체크박스는 스위치처럼 설정을 즉시 반영하지 않는 대신, ‘확인(submit)’ 버튼을 같이 제공하여 유저가 확인 버튼을 누르면 설정을 적용한다고 합니다. 이렇게 버튼을 한 번 더 누르게 하면 유저에게 다시 한번 확인해볼 수 있는 기회를 주어 실수로 활성화하는 오류를 방지해준다고 합니다. 




스위치를 이용하면 유저가 각 설정이 적용되는 것을 기다려야 하지만, 체크박스를 이용하면 많은 설정을 한 번에 적용할 수 있다고 합니다. 때문에 많은 설정을 한 번에 적용할 때는 체크박스를 이용하는 것이 시간을 절약해줘 더 유리하고, 소수의 설정을 자주 변경할 때는 스위치가 유리하다고 합니다. 


스위치와 체크박스 중 선택하기


둘 중 하나를 선택할 때는 기능이 아닌 맥락에 집중해야 한다고 합니다. 효과가 즉시 반영되어야 하는 것인지 아닌지, 설정을 적용하기 전에 유저가 한 번 더 확인해야 하는 것인지 스스로에게 물어보라고 합니다. 디자이너들은 이런 디테일을 절대 놓쳐서는 안 된다고 합니다. 


더 자세한 내용이 궁금하시면 http://goo.gl/Kf3OSS를 클릭하세요. 





12,000명 브런치 구독자를 위한 특별한 혜택!!!!! 
라이브 클래스 PM VOD 패키지(리서치/분석/기획/전략/설계) 추천
300시간 이상 UX 강좌, PM을 위한 180여개 UX 강좌 묵음 패키지 

브런치 구독자에 한해 정가 대비 90% 할인 쿠폰 증정합니다. 

쿠폰 코드: 20241231

상세 정보 확인하기 

https://ebprux.liveklass.com/


매거진의 이전글 알림 UX 설계 3가지 원칙

작품 선택

키워드 선택 0 / 3 0

댓글여부

afliean
브런치는 최신 브라우저에 최적화 되어있습니다. IE chrome safari