호텔 등급과 리뷰 표기방법에 대한 UI 가이드

boldydesign
7 min readSep 4, 2019

이 포스팅은 디자이너가 프로젝트를 진행하면서 고민했던 부분에 대한 글입니다.

호텔 프로덕트에서 가장 중요한 부분 중 하나는 ‘리뷰 노출’이라고 생각합니다. 리뷰는 사용자가 호텔을 발견하는 경험을 설계하는 데 있어 중요한 요소이며, 효과적인 방식으로 리뷰를 노출하는 UI가 예약 완료로도 이어지기 때문입니다. 더 나은 호텔 예약 경험을 위해 여행업계 서비스의 리뷰 표기 방법에 대한 유형을 소개하겠습니다.

case 1: ‘좋아요’ 또는 ‘싫어요’ 수로 표기

유튜브 UI

유튜브에서 누군가가 영상을 올렸을 때 ‘좋아요’를 누르거나, ‘싫어요’를 누름으로써 등급을 표기하는 방식입니다. 하지만, 호텔에서는 ‘좋아요'와 ‘싫어요' 두 가지 기준으로만 평가하게 된다면, 각 유형에 대한 만족도를 평가할 수 없기 때문에 사용을 지양하는 편입니다. (‘좋아요' 혹은 ‘싫어요'의 수로 표기되는 UI의 문제점 블로그)

case 2: 표기법 기반으로 평가

부킹닷컴 UI

사용자가 호텔을 숙박한 후 만족도 평가를 한 후, 평가 데이터를 ‘아주 좋음’, ‘좋음’, ‘보통’, ‘나쁨’, ‘아주 나쁨’으로 등급을 구분합니다. 따라서, 10점 만점이면 10.0(아주 좋음) 이 표기됩니다. 현재 대다수의 호텔 서비스가 사용하고 있는 UI입니다.

case 3: 별 다섯 개 기준으로 표기

에어비앤비 UI

사용자가 호텔을 이용한 후, 각 평가 데이터를 별 다섯개 혹은 열개로 구분합니다. 대표적으로 Uber, airbnb, apple app store에서 사용하며, 대다수의 서비스에서 사용하고 이는 리뷰 표기 방법입니다. 이 시스템은 등급을 요청한 사용자와 등급을 보고있는 사용자 모두에게 “가장 선호하는 등급 시스템”이라고 합니다. (Pranata et al., 2013).

리뷰를 호텔 등급과 함께 노출할 땐, 어떤 UI를 사용할까?

크게 세 가지 유형(유형 1: ‘좋아요’ 또는 ‘싫어요’ 수로 표기, 유형 2: 표기법 기반으로 평가, 유형 3: 별 다섯 개 기준으로 표기) 으로 리뷰를 노출한다는 사실을 알았고, 별 다섯개 기준으로 평가하는 방법이 사용자에게 가장 선호하는 등급 시스템임을 알 수 있었습니다. 하지만, ‘호텔' 프로덕트에서 이러한 리뷰 UI는 살짝 논외입니다. 호텔 등급을 표기하는 방법 중에 대다수의 서비스는 별 다섯개로 표기하기 때문입니다. 그렇게 된다면, 호텔 등급과 리뷰 모두 별 컴포넌트의 중복 사용으로 사용자에게 혼돈이 올 수 있습니다. 그렇다면, 어떤 화면 설계가 사용자에게 호텔 등급과 리뷰를 구분하여 볼 수 있을까요? 기존 서비스들은 어떻게 하는 지 찾아 보았습니다.

(목적1:리뷰와 호텔 등급은 구분하는 화면 설계를 만들 것. 목적2:사용자가 별 UI를 정확히 인지하는 UI를 만들 것)

호텔 등급을 별 표기방법으로 나타내는 서비스

하나투어, 노랑풍선, 인터파크투어 UI

국내 대행 서비스 중 매출이 가장 좋은 top 3 대행사 화면입니다. 하나투어, 노랑풍선, 인터파크투어 모두 호텔 등급을 별로 사용하고 있었습니다. (인터파크투어는 등급과 평점의 텍스트로 인해, 구분이 되어 보이지만요.)

그렇다면, 해외 OTA 서비스는 어떻게 표기하고 있을까요?

부킹닷컴, 호텔스컴바인, 카약, 호텔패스, 프라이스라인, 아고다, 트리바고, 익스피디아 UI

해외 OTA 도 국내 서비스와 마찬가지로 별을 통해 호텔 등급을 표기하고 있습니다. 이렇게 대다수의 국내 및 해외 호텔 서비스는 호텔 등급을 별, 리뷰를 표기법 기준으로 표기하고 있었습니다. 하지만, 한국인은 과연 별 다섯개를 호텔 등급으로 인지할까요? 지인들에게 간단히 UT를 진행해본 결과, 사용자들은 별 다섯개를 리뷰로 인지하고 있었습니다.

5 star ui 검색 결과

그 이유는 구글에 5 star ui로 검색만 하더라도 리뷰 ui 가 나오는 것처럼, 우리는 5star를 리뷰로 인지하고 있었습니다. 이유는 간단합니다. 일반적이기 때문입니다. 리뷰 표기 방법은 언어가 통하지 않아도 이미 획일화된 특수기호, 표시 등과 같이 정해진 약속이기 때문입니다.

리뷰를 별 표기방법으로 나타내는 서비스

네이버, 마이리얼트립, 야놀자, 데일리호텔 UI

그렇다면, 획일화된 리뷰 표기 방법을 그대로 유지한채 사용하고 있는 호텔 서비스는 무엇이 있을까요? 대표적인 예로 ‘네이버’가 있습니다. 우리나라에서 다양한 서비스를 독보적으로 하고 있는 네이버에서는 호텔 등급은 한글, 리뷰 평점은 별로 노출하고 있었습니다.

퍼블리에서 발행하는 컨텐츠의 디자이너인 ‘배재민’ 디자이너분이 담당하는 ‘마이리얼트립'에서도 호텔 등급은 한글로 노출하고 있었습니다.

현대카드 수석 디자이너였던 박우혁디자이너분이 CDO로 계시는 야놀자에서도 호텔 등급은 한글, 리뷰 평점은 별로 노출하고 있습니다.

세 가지 서비스 모두 사용성이 우수한 서비스라고 생각합니다. 그래서, 이런 세심한 부분(호텔 등급을 다른 방식으로 노출하는 UI)도 신경을 쓴 것을 알 수 있었습니다.

이번 프로젝트에도 새로운 UI표기 방법으로 제안해보았습니다. (As is — To be)

As is — To be

기존에는 호텔 등급을 단순히 별로 나타내서 호텔 등급인지, 리뷰인지가 헷갈렸습니다. 그래서, 한글로 호텔 등급을 표기하는 방식으로 제안했습니다. 또한, 이미 리뷰는 ‘별 표기방법'으로 획일화된 리뷰 ui를 사용했습니다.

마치며

국내 몇몇 서비스는 이미 호텔 등급을 다른 방식으로 노출하고 있습니다. 개인적으로, 호텔 등급을 별 다섯개로 표기하는 방법은 한국에서 논란의 여지가 많을 것 같다고 생각합니다. 앞서 말했듯이, 별을 활용한 UI가 리뷰라고 인식되기 때문이죠.

아무리 유명한 여행사에서 별 표기방법을 호텔 등급으로 나타내더라도, 사용자에게 헷갈리는 요소가 있다면 개선하는 것이 맞다고 생각합니다. 국내에서 사용성이 우수하다고 인정받은 서비스들이 이미 호텔 등급과 리뷰를 구분한 것을 보면서, 앞으로 프로젝트를 진행할 때 이런 세심한 부분까지 신경써야겠다고 생각했습니다.

이 프로젝트를 통해 디자인 창의성도 중요하지만 무엇보다 고객의 편의성을 기본으로 삼는 것이 좋은 디자이너가 갖춰야 할 기본 자세임을 알 수 있었습니다. 이를 위해 가시적으로 쉬운 화면 설계의 끊임없는 연구가 필요하다는 것을 끝으로 이 글을 마칩니다.

디자인 및 홈페이지&앱 제작 관련 문의는 아래 방법을 통해 주시면 빠르고 자세하게 답변 도와드리겠습니다.​

홈페이지 www.boldydesign.com

블로그 www.blog.naver.com/boldydesign

메일 boldydesign@gmail.com

카카오톡 오픈채팅 https://pf.kakao.com/_xedxlNxj

--

--