본 글은 공부를 위한 아티클의 요약 및 리뷰이며, 가급적 링크를 눌러 원문을 읽으시는 것을 추천드립니다. 😃
Designing A Better Back Button UX — Smashing Magazine
With the “Back” button, users often get confused and frustrated. How to design a better back button UX and where to put those “Back” buttons in our interfaces.
www.smashingmagazine.com
MBTI검사를 하다가 한 번은 실수로 뒤로 버튼을 눌러 20여 분을 날린 적이 있다. 정말 망연자실했다. 이 글은 이러한 경험을 사용자들이 왜 싫어하는지, 디자이너는 이 문제에 어떻게 대처해야 할지를 알려준다.
사용자는 뒤로 버튼을 누르기 전 두 번 생각합니다. 대부분 그들은 현재 있는 페이지의 상태나 데이터가 손실되는 것을 두려워합니다.
지금 생각해보면 나는 웹서핑을 할 때도 '새 탭으로 열기'를 자주 쓴다. 그냥 클릭했다가는 이전까지의 데이터가 사라진 경험이 때문에 행동 양식이 생긴 것 같다.
이전에 사파리 사용 중 탭 닫기 버튼을 눌렀는데, ‘이 페이지를 유지하겠습니까?’라는 메시지를 받았다. 닫아도 되는 페이지였는데도 한 번 더 생각했다. '이거 닫아도 되는거 맞지?' '여기 혹시 시간을 들여서 쓴 글 있었나?'라고.
만약 이 페이지에 많은 정보를 입력했다면? 5분, 혹은 10분 넘게 정보를 입력했었고 실수로 뒤로 혹은 버튼을 눌러 모든 시간이 허무해졌다면? 그런 상황에서라면 이런 모달이 너무나도 반가웠을거다.
사용자가 "뒤로" 이동하여 데이터를 잃을 가능성이 있는 경우 사용자에게 자신의 작업을 확인하고 일부 데이터가 손실될 수 있음을 알리는 메시지를 표시하는 것이 좋습니다 .
글쓴이는 이 문제를 명확히 제시하고, 이에 대한 해결책을 두 가지로 제시한다. 그 중 하나는 폼별 '뒤로' 컴포넌트 추가이다.
일부 사용자는 "뒤로" 버튼이 실제로 예상대로 작동하는지 여전히 걱정할 것입니다. 이 문제를 해결하는 좋은 방법은 인터페이스 내에 사용자 지정 양식별 "뒤로" 구성 요소를 추가하는 것입니다.
Steve Schoger는 버튼이 양식에서 오른쪽으로 정렬되었는지 왼쪽으로 정렬되었는지 여부에 관계없이 항상 기본 작업을 외부에 배치 하는 것이 좋습니다 . 즉, 시각적으로 덜 무거워지는 "뒤로" 버튼이 "다음" 버튼 옆에 위치하게 됩니다.
다른 하나는 '다음' 버튼과 최대한 멀리 배치하기 다.
사용자가 실수로 잘못된 버튼을 클릭하는 경우가 종종 있기 때문에, 항상 버튼을 가능한 한 서로 멀리 배치하는 것이 테스트할 가치가 있는 아이디어입니다.
일반적으로 반대되는 두 행동 사이에 거리를 더할수록 실수가 발생할 가능성이 줄어듭니다.
또한 뒤로 버튼은 상호작용 가능한 요소로 보여야 한다고 말한다. 뒤로 버튼을 만든다 해도 사용자가 그냥 있는 텍스트인지, 실제로 작용하는 버튼인지를 모르면 의미가 없으니까.
사용자 정의 "뒤로" 버튼은 대화형 요소처럼 보여야 합니다
뒤로 버튼을 중점으로 이야기했지만, 뒤로 버튼에 국한되는 이야기가 아닐까? 디자이너는 사용자가 좌절감을 느끼지 않는 디자인을 고려할 필요가 있다. 이러한 감정은 바로 프로덕트의 사용자 경험과 연결되니까 말이다.
