brunch

You can make anything
by writing

C.S.Lewis

by Newtudy Sep 12. 2022

스와이프 제스처 이해하기(모바일 UX)

스와이프 투 삭제(swipe-to-delete)

본 글은 닐슨 노먼 그룹의 <Using Swipe to Trigger Contextual Actions>를 바탕으로 구성했습니다.



대부분의 모바일 앱에서는 많은 터치 제스처가 사용되는데 그중 하나가 ‘스와이프 투 삭제(swipe-to-delete)’입니다. 이 제스처는 작은 화면에서 편리하게 사용이 가능하지만 다양한 사용 편의성 상의 문제가 있습니다.


상황별 스와이프의 단점   

1. 단서가 부족할 때 상황별 스와이프의 사용이 불분명해집니다.

아직 스와이프 투 삭제 제스처에 익숙하지 않은 사용자 또는 새로운 앱을 발견하거나 자주 사용하지 않는 앱을 다시 방문하는 사용자는 상황별 스와이프를 사용할 수 있는지 예측하기 어렵습니다.

예를 들어 ‘사람인’ 앱에서는 최근 확인한 콘텐츠를 스와이프 할 때 아무 일도 일어나지 않습니다. 콘텐츠별 우측 상단의 x버튼을 통해 삭제를 해야 합니다.

사람인


2. 액션을 하기 위해 스와이핑을 할 때 내용이 가려집니다. 

메뉴를 보기 위해 스와이프를 할 때 선택한 콘텐츠 정보를 인식할 수 없는 경우가 있습니다.  

예를 들어 ‘카카오 맵’에서 저장한 장소를 삭제하기 위해 스와이프 할 때 선택한 장소의 이름이 완전히 가려지게 되어 올바르게 선택했는지 확인이 어렵게 됩니다.

카카오 맵


3. 상황별 스와이프 제스처가 ‘삭제’에만 사용되는 것은 아닙니다. 

대부분의 사용자들은 스와이프 제스처가 삭제와 같은 강한 액션을 할 것이라고 예상합니다. 하지만 전혀 다른 액션을 하게 되는 경우도 있습니다.  

예를 들어 카카오톡 채팅창에서 스와이프를 했을 경우에 ‘채팅방 삭제’가 아닌 ‘읽음으로 처리’와 ‘채팅방 나가기’ 옵션을 확인할 수 있습니다.

카카오톡


4. 상황별 스와이프가 같은 앱 내에서 일관되게 사용되지 않을 수 있습니다.

같은 스와이프 제스처로 여러 액션이 가능해지면 사용자는 기억하기 어려워집니다.  

예를 들어 ‘카카오톡’의 다음 2가지 상황에서 스와이프 했을 때 서로 다른 액션을 할 수 있습니다.  

      나의 친구 목록에서 친구를 스와이프 하면 숨김 또는 차단 옵션을 확인할 수 있습니다.  

      추천 친구 목록에서 친구를 스와이프 하면 삭제 옵션을 확인할 수 있습니다.  

카카오톡


5. 사용하기 쉬운 제스처이기 때문에 실수로 항목을 삭제할 수 있습니다.

이를 방지하기 위해서 스와이프 이후 확인을 요청하거나 스와이프를 쉽게 해제할 수 있는 별도의 방법을 제공해야 합니다.

예를 들어 ‘네이버 메일’앱은 중요 메일함에서 콘텐츠를 스와이프 할 경우 삭제 또는 다른 옵션 확인 없이 바로 삭제됩니다.

네이버 메일


6. 스와이프 사용이 불확실하면 상황별 스와이프의 유효성에 영향을 줄 수 있습니다.

많은 IOS 앱에서 가로 스와이프는 이전 페이지로 가기 위해 사용됩니다. Android에서는 숨겨진 메뉴를 표시하기 위해 사용됩니다. IPad에서는 가로 스와이프를 사용해 화면 분할을 하기도 합니다. 이런 제스처는 상황별 스와이프의 조작성에 영향을 줄 수 있습니다. 그렇게 되면 유저가 인터페이스를 제어하는데 어려움을 느껴 전체적인 UX를 저하시킬 수 있습니다.  


상황별 스와이프 사용 권장 사항

A. 콘텐츠 가시성을 확보하거나 액션을 하게 될 선택 항목을 인지하고 있는지 확인해야 합니다.
콘텐츠 불확실성을 최소화하기 위해서는 앱 테두리에 맞춰 각 콘텐츠의 이름을 유지해 사용자가 액션 할 내용을 볼 수 있게 하는 방법을 사용할 수 있습니다.


B. 삭제를 완료하기 전에 확인을 요청해야 합니다.

상황별 스와이프를 사용해 별도의 확인 없이 항목을 삭제할 경우 문제가 발생할 수 있습니다. 삭제 버튼 등으로 확인을 미리 요청해야 합니다.  


      C. 반복적인 액션이나 확인을 요청할 수 없는 경우 실행 취소 옵션을 제공해야 합니다.

예를 들어 구독 취소 버튼을 탭 한 후 바로 작업을 취소하거나 다시 구독할 수 있는 옵션을 제공할 수 있습니다.  


      D. 상황별 스와이프를 삭제와 같은 파괴 동작으로 제한해야 합니다.

상황별 스와이프 뒤에 주요 액션을 배치하면 사용자는 이를 인식하지 못합니다.  


      E. 앱 내의 상황별 스와이프 동작을 일관되게 유지해야 합니다.

사용자들은 하나의 제스처에 대해서는 하나의 의미를 가질 것이라 예상합니다. 앱 내 다른 페이지 또는 항목 상태에 따라 달라지는 액션을 사용하는 것을 지양해야 합니다.  


      F. 앱 내 스와이프 제스처의 과도한 사용을 지양해야 합니다.  

앱에서 상황별 스와이프를 사용할 때에는 다른 페이지로 이동 시 사용되는 등의 다른 스와이프 제스처에 방해가 되지 않는 선에서 사용해야 합니다.



작성자: 김성민
점점 많은 사용자들이 상황별 스와이프를 통한 삭제에 익숙해지고 있지만 무분별하게 사용하거나 적절하지 않은 위치에서 사용하게 되면 사용자들에게 오히려 혼란을 줄 수 있기 때문에 주의해서 사용해야 합니다. 하지만 스와이프라는 제스처 자체가 쉽고 많은 사람들이 이미 사용하고 있기 때문에 선택한 콘텐츠를 가리지 않고 적절한 위치에서 일관되게 사용하면 편리하고 좋은 제스처가 될 것이라고 생각합니다.




<관련 글>


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