사용자가 계속 더블클릭을 하는 이유
Double-Click
이 기사는 Baymard의 허가 아래 게재하고 있습니다.
(2013년 7월 25일의 기사입니다)
우리는 2009년에 일부 사용자가 여전히 웹사이트의 링크와 버튼을 더블 클릭한다는 것을 처음 관찰했습니다. 사용자가 링크와 버튼을 더블 클릭하는 문제를 본 이후로 우리가 실행한 모든 사용성 테스트에서 특히 많은 전자 상거래 사이트에서 계속해서 두 번 클릭 동작을 제대로 처리하지 못하는 사실을 알 수 있었습니다.
AllPosters.com은 클릭한 직후 "계속" 버튼을 비활성화합니다.간단한 해결책으로는 버튼을 클릭 시 비활성화하는 방법이 있습니다. 이것은 특별히 새로운 인사이트가 아닙니다. 그러나 여전히 너무 많은 사이트에서 문제가 되고 있는데, 웹 디자이너와 개발자들 그리고 관리자들은 웹페이지에서 링크나 버튼을 두 번 클릭하는 것을 깊게 생각하지 못했던 사용자 행동이라 이것에 대해 깨닫고 디자인하는데 어려움을 겪기 때문입니다.
물론, 링크와 버튼을 두 번 클릭하는 것은 일반 사용자가 아니라 소규모 사용자 부문입니다. 우리의 사용성테스트에서는 일반적으로 50세 이상인 피험자의 약 10%가 이러한 경향을 보였습니다. 또한 더블클릭하는 사용자와 일반적으로 "안전하지 않은" 웹 사용자 사이에는 높은 상관관계가 있는 것으로 보입니다.
이 같은 이용자 행태는 이 기사가 처음 실렸을 때보다 점점 더 증가하고 있으며, 지금도 만연해 있습니다. 그러나 이러한 증가는 주로 모바일 사이트의 응답이 약간 느릴 때 “사용자는 단순히 탭이 제대로 실행되지 않았다고 생각한다"는 모바일 측면 때문입니다. 이런 면에서 이 관찰과 기사는 (적어도 모바일로) 처음 게재된 이후 더욱더 중요해졌습니다.(2019년 8월 업데이트)
문제
왜 이것이 문제일까요? 여러분들의 사이트가 이러한 동작을 위해 설계되지 않은 경우 더블 클릭으로 인해 여러 가지면에서 바람직하지 않은 결과가 따를 수 있습니다. 전자 상거래 사이트에서 가장 흔한 예는 ‘중복 주문’과 실수로 같은 제품을 ‘장바구니에 두 번 추가’하는 것입니다.
체크아웃 시 "주문 확인" 버튼을 더블 클릭하면 중복 주문이 발생할 우려가 있습니다. 사용자가 문제를 즉시 발견하는 경우 사용자는 중복을 찾아 취소해야 하는 불필요한 태스크가 발생해 쓸데없는 부담을 지게 됩니다. 그들이 실수를 깨닫지 못하고 도중에 중복 주문을 발견한 경우(지불 또는 배송 시), 사용자는 사이트를 비난할 가능성이 높아지며 사기를 당하고 있다고 생각할 수도 있습니다. 이러한 경험은 말할 필요도 없이 사이트와 브랜드에 대한 이미지를 영구적으로 손상시킬 수 있습니다.
NewEgg에서 "장바구니에 추가" 버튼을 두 번 클릭하면 동일한 제품이 장바구니에 두 번 추가됩니다.동일한 제품을 장바구니에 두 번 추가하는 것은 사용자가 제품 페이지에서 "장바구니에 추가" 버튼을 두 번 클릭할 때 발생합니다. 이것은 중복 주문보다 덜 중요하지만 최소한 장바구니로 이동하여 주문 수량을 변경해야 하는 고객에게 상당한 번거로움을 줍니다. 실제로 많은 사용자가 수량을 변경하지 않고 장바구니의 전체 항목을 삭제하여 제품을 다시 찾고 다시 추가하는 부가적인 태스크가 발생하여 중간에 포기하는 경우도 적지 않습니다.
해결책
가장 간단한 설루션은 클릭 즉시 버튼을 동적으로 비활성화하는 것입니다. 이상적으로는 로드할 때 스피너를 표시합니다. 버튼을 비활성화하면 사용자가 동일한 버튼을 연속으로 두 번 클릭할 수 없으며 똑같이 중요한(특히 모바일에서) 스피너는 클릭이 등록되었고 사이트가 요청을 처리하고 있다는 피드백을 제공합니다.
IKEA는 "장바구니에 추가" 버튼을 클릭하면 스피너로 바뀝니다. 이렇게 하면 사용자가 실수로 제품을 장바구니에 두 번 추가하지 않습니다.스피너로 링크와 버튼을 비활성화하면 추가 이점이 있습니다. 조급한 사용자가 클릭한 직후에 요청을 다시 제출하는 것을 방지합니다. 테스트 중에 우리는 참을성이 없는 사용자가 응답하지 않는 매우 짧은(2-3초) 지연 시간 동안에도 요청을 다시 제출하는 방법을 반복적으로 봅니다. 그들은 여러 가지 이유로 이 행동을 합니다. 한 가지 이유로 사용자는 요청이 "실패"했다고 믿으며 다시 제출하면 사이트가 "다시 시도"할 것이라 믿기 때문입니다.
터치 장치에서 특히 두드러지는 또 다른 이유는 스피너가 없으면 사용자가 클릭/탭이 등록되지 않았다고 생각하여 요청을 다시 제출하기 때문입니다. 클릭 시 즉시 스피너를 표시하면 이러한 불신이 제거되어 자신의 요청이 진행되고 있다는 사실을 믿을 수 있게 됩니다.
물론 다른 고급 설루션도 부가적으로 추가할 수 있습니다. 예를 들어, 중복 주문을 피하기 위해 주문 시스템은 서로 몇 초 이내에 이루어진 중복 주문을 거부하거나 플래그를 지정하도록 프로그래밍할 수 있습니다(실제로 일부 지불 프로세서는 기본적으로 이 작업을 수행하기도 함).
아마존은 제품이 이미 사용자의 장바구니에 있음을 감지하고 이제 수량은 2개라는 알림을 표시하지만 사용자가 하나만 원하는 경우 "바구니 편집"에 대한 직접 링크를 제공합니다.사용자의 입장에서
대부분의 디자인이 더 많은 고객을 대상으로 하듯이, 여기서 어려운 점은 해결책을 제시하거나 기술적으로 구현하는 것이 아니라 애초에 문제가 존재함을 깨닫는 것입니다. 웹에 정통한 사용자인 우리에게 모호하지는 않지만 조금 떨어져 있는 행동에 뿌리를 두고 있기 때문에 우리가 종종 상상하지 못하는 문제에 대한 해결책을 생각해 내는 것입니다.
이것은 적은 횟수의 사용성 테스트가 디자인 팀에게 활력을 줄 수 있는 이유이기도 합니다. 이것은 효과적으로 사용자의 입장이 되어 보는 지름길입니다. 우리에게 낯설기 때문에 전혀 생각하지 못했던 행동과 문제들을 발견할 수 있게 해 줍니다. 다양한 배경과 행동을 설명하는 진정한 사용자 친화적인 인터페이스를 설계할 수 있는 바로 이러한 통찰력을 갖춰야 할 것입니다.
