brunch

You can make anything
by writing

C.S.Lewis

by Aiden Sep 29. 2022

사용자는 기대를 하며 버튼을 누른다

기대한 대로의 결과가 나올 때의 편안함

여러분 집에 있는 TV 리모컨을 가만히 생각해 보세요. 볼륨+라는 버튼을 누르기 전에 무슨 생각을 하나요? 음향을 높이기 위해서 그 버튼을 누르면서 이걸 누르면 소리가 커질 거라는 기대를 갖게 되죠? 너무 무의식적인 행동이라 기대라고 할 정도까지 의식하지는 못했겠지만 말이죠.


그런데 여기서 만약 볼륨+ 버튼을 눌렀는데, 음향이 커지는 게 아니라 채널이 돌아간다면 어떤 느낌일까요? 아마 짜증이 솟구칠 겁니다. '리모컨을 누가 이따위로 만들어서 지금 막 재밌는 장면 나오는데 대체 뭐야 이거!'


모든 사용자는 하나의 액션을 하기 전에, UI를 조작하기 전에, 버튼을 누르기 전에 반드시 기대를 갖게 됩니다. 그럴 때 과연 여러분의 서비스는 사용자의 기대를 충실히 충족시켜 주고 있는지를 곰곰이 생각해 봅시다.



사용자의 기대를 끌어오는 미끼 정보

다음은 제가 자주 가는 카페 스크린샷의 일부입니다.


흔한 게시판이지만 사용자의 기대를 품게 만들기엔 충분합니다


게시물 리스트인데, 여기는 수많은 사용자를 유혹하는 미끼와 함께 기대감을 심어주는 단서들이 널려 있습니다. 마치 TV 리모컨의 '볼륨+'처럼요.


잘 보면, 먼저 게시물의 제목은 어떤 내용을 담고 있을지를 기대하게 해주는 가장 큰 단서가 되고, 그리고 사진 썸네일 역시 식별은 불분명하더라도 '사진이 있는 글이구나, 어떤 느낌의 사진이 있구나' 기대감을 심어주는 단서가 됩니다. 그 외에도 얼마나 많은 사람들이 반응하고 있는지, 나도 그 반응에 참여할 수 있는지의 여부롤 나타내 주는 댓글 카운트 등이 모두 단서죠.


사용자는 이 화면을 보면서 이걸 누르면 글을 볼 수 있구나!라는 기대를 하게 되는데, 만약 저 리스트에서 뭔가를 선택했을 때, 게시물이 아니라 광고로 이동해 본다고 생각해보죠. 실제로 싸구려 웹진이나 뉴스 매거진 사이트에 가면 그런 경우가 종종 있죠?

저라면 아마 다시는 그 서비스를 쓰지 않을 거 같습니다. 사례가 너무 뻔하다고요?



UI 요소, 버튼은 효율적으로 만들고 있나요?

자 여기 두 개의 버튼이 있습니다. 만약 이 버튼이 무언가의 서비스를 예약하기 위해 최종으로 누르는 버튼이라고 생각해 봅시다. 우리는 예전부터 특정 팝업 등에서 긍정과 부정을 나타내기 위해 [확인/취소]를 흔히 써왔습니다. 사용자의 학습에 따라서는 어떻게 보면 긍정하고 최종 접수를 하라는 의미로 사용하기에도 문제는 없어 보일 수 있습니다.


하지만 이렇게 기계적인 [확인/취소]는 최근 대부분의 서비스에서도 찾아보기가 힘든 시대가 되었어요. 그러니 당연히 사용자는 [확인]의 의미가 구체적으로 뭘 의미하는지 쉽게 유추할 수 없죠. 그렇다는 건 결국 저 버튼을 눌렀을 때 나한테 어떤 피드백이 올 거라는 상상이 매우 모호해질 수밖에 없다는 이야기이기도 해요.


반면에 [예약 요청]은 저 버튼을 누르기만 해도 서비스 예약이 접수될 거라는 상상을 아주 쉽게 연상시킬 수 있겠죠? 사용자는 버튼을 누르기도 전에 나한테 올 피드백을 미리 예측하고 기대하기에 충분합니다.


이렇게 비록 이전 예시와 같이 버튼이 엉뚱하게 작동해서 기대와 어긋나는 것과 달리, 같은 결과를 보여주는 버튼이라고 해도 단순한 네이밍을 어떻게 짓느냐에 따라서도 사용자의 기대와 충족은 크게 높아질 수 있습니다. 즉, 사용성, UX가 향상될 수 있다는 이야기예요.


같은 맥락에서 한때 UI의 정점이라 칭송받았던 스큐어모피즘(Skeuomorphism)이 모던 스타일의 UI에게 왕좌를 넘겨준 이유이기도 해요.


요즘 취업을 준비하는 친구들 중에 이걸 아는 사람이 얼마나 될까요?


위 사진이 대체 왜 저장을 뜻하는지 요즘 친구들은 알까요? 대체 뭐 하는 건지도 모를 물건을 아이콘으로 떡하니 걸어두고 나면 사용자는 어떤 기대감을 가질 수 있을까요? 아마, 버튼을 눌러보기 전에는 절대 모를 겁니다.

바로 이게 이전의 스큐어모피즘의 한계였어요, 그에 반해 [저장] 또는 [Save]라고 박스형 버튼 위에 글자만 써 놓는다면 어떨까요? 문맹이 아닌 이상 버튼을 눌렀을 때 나에게 올 피드백을 충분히 예측 가능하게 해 주죠.



이렇게 단순한 UI 요소에도 기대와 충족이 적용되는 것처럼, 여러분의 작품에도 이런 심리적인 충족이 가득했으면 좋겠어요. 최근의 UI는 더욱이 GUI와 NUI의 사이에 있는 트렌드에 있다 보니 버튼에 대놓고 저렇게 라벨을 달아두지 못할 때도 많아요. 컨텐츠 그 자체가 버튼이 되어버리니까요.


그럴 때 여러분은 어떻게 사용자에게 기대감을 심어줄지를 고민해 보세요. 이 컨텐츠 덩어리를 눌렀을 때 사용자는 안에서 어떤 행위들을 할 수 있을 거라고 기대하고 예측하게 만들어 줄 수 있는지를 말이죠.




함께 읽으면 좋은 글,


미끼 정보로 사용자를 유인하는 화면 설계하기 팁


UI의 트렌드 변화, 'CUI부터 NUI까지'를 이해하기 좋은 글


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