캐스팅엔 CBlog 토탈 외주 플랫폼

많은 사람들이 코비드19의 영향으로 사회적 거리두기를 실천하고 있다. 나 또한 잠시 여행을 떠나려 했지만 모든 계획을 접었다. 여행을 떠나고 싶은 마음에 괜스레 예약도 못 할 항공 예약 어플을 실행하였다. 예약이 목적이 아니라서 일까? 평소라면 비행기 예약이라는 목적을 두고 최저가를 비교하는데 급급했지만, 이번에는 항공권 예약 화면들이 눈에 들어오기 시작했다.

지난 번 21CM에 이어, 이번 편에서는 항공권 예약 어플 스카이스캐너와 트립닷컴을 비교해보고자 한다. 특히 항공권 예약에서 가장 중요한 기능 중 하나인 검색 필터 사용 과정을 살펴봤다.

항공권 검색 결과를 얻기 위한 과정

UX아티클들은 언제나 “가입, 검색, 결제는 쉽고 간단해야 한다.”라고 말해왔다. 이 단순하지만 어려운 문제를 스카이스캐너와 트립닷컴은 어떻게 풀어가고 있을까?

우리는 보통 항공권을 알아볼 때 많은 정보를 입력한 뒤 검색을 한다. 이 정보 입력 과정은 ‘필터’로 볼 수 있다. 항공권 예약 어플들을 살펴본 결과 공통적인 정보를 필터 하도록 한다.

스카이스캐너는 항공권 검색 페이지 내에서 모든 테스크(task)를 수행하도록 디자인을 하였다

이러한 디자인을 통해 사용자가 필터 검색을 할 때 복잡함을 줄여주고 있다. 좀 더 자세히 살펴보자.

출발 국가 부분을 클릭하게 되면, Dim이 나타나면서 Dialogs가 생긴다. Dim 뒤로 보이는 화면을 통해 내가 어떤 것을 선택했는지 알 수 있다. 또한 Progress bar가 따로 필요 없이 지금 내가 어떤 과정에 있는지 바로바로 인식할 수 있다.

아마 다들 이러한 형식이 익숙할 것이다. 처음 앱을 사용할 때, 앱의 사용방법을 알려주는 튜토리얼 단계에서 사용되는 Tooltip과 닮아있다.

위 이미지는 부동산 어플 ‘직방’과 ‘trulia’, 운동 어플 ‘Aaptiv’의 튜토리얼 화면이다. 처음 앱을 깔고 진입하게 되면 주요 기능이 있거나 숨겨진 기능 등에 해당되는 부분에 Tooltip이 순차적으로 뜬다.

이 과정을 통해 앱의 사용성을 익힐 수 있다. 스카이스캐너는 이러한 tooltip의 형태를 검색에 활용하였다.

다음은 ‘날짜 선택’화면을 살펴보자.

스카이스캐너의 가장 큰 특징 중 하나인 날짜 그래프이다. ‘달력’에서 날짜를 선택하고 ‘차트’를 들어가게 되면, 해당 날짜를 중심으로 가격 변동 추이가 보인다. 개인적으로 정확히 정해지지 않은 여행의 항공권을 끊을 때 정말 잘 사용했던 기능이다.

트립닷컴에서도 유사한 가격 차트 기능을 사용을 하고 있다. 하지만 검색 과정이 아닌 검색 결과 페이지에서 확인할 수 있다. 또 한 스카이스캐너처럼 가격의 추이가 차트로 바로 보이는 것이 아닌, 보길 원하는 날짜를 선택하여 데이터를 받아 기록해 주는 형식이다. 마치 이커머스의 최근 본 상품과 같은 부분이라는 생각도 든다. 트립닷컴의 차트 예시는 어떻게 보면 같은 형태를 차용하였지만, 전혀 다른 기능이라고도 볼 수 있다.

그럼 트립닷컴은 어떻게 검색 필터들을 보여주고 있을까?

트립닷컴을 살펴보면, 스카이스캐너와 달리 항공권 검색 페이지에서 1depth씩 더 들어가는 것을 볼 수 있다. 이러한 형태는 검색 페이지와 필터 검색페 이지를 반복적으로 오가야 하는 번거로움이 있을 수 있다. 하지만 가장 흔히 사용되는 형태이다.

타 항공권 예약 서비스(마이리얼트립, 네이버 항공권, 엑스피디아)들을 살펴보면, 이와 비슷한 *dialog windows를 사용하고 있다. 스카이스캐너에서 사용된 Dialog가 일반적으로 널리 쓰이는 dialog인 반면, 트립닷컴의은 화면 전체를 덮는 dialog windows를 취하고 있다. 하지만, 장점도 있다. 바로 화면을 훨씬 넓게 쓰기 때문에 많은 정보들이나 가이드 등을 담을 수 있다는 것이다.

이러한 예시를 아래 화면으로 보도록 하자.

출발/도착을 검색하는 화면을 보면, Text input field 클릭 전 공간을 잘 활용하고 있는 것을 볼 수 있다. 현재 위치 또는 최근 검색을 보여주거나, 국가들을 보여줘 간단한 클릭을 통해 편하게 검색을 이어나갈 수 있었다.

항공권 예약의 특성상 길게는 일 년 후를 예약해야 할 경우가 많다. 개인적으로는 숫자만 적혀있는 달력의 경우 월이나 연도를 헷갈리곤 했다. 하지만 트립닷컴은 국가 공휴일을 표기해 주고 있다. (이는 네이버항공에서도 동일하다.) 공휴일이 표기되어 있어, 연도와 월이 이전보다 더 쉽게 구분할 수 있는 작은 장치라고 생각된다.

주어진 정보와 프로세스는 거의 동일하지만, 앱마다 정말 다양하게 풀어나가고 있다는 것을 느꼈다. 타깃을, 문제 정의를 어떻게 정하냐에 따라 결과물이 천차만별로 나온다.

스카이스캐너는 날짜는 상관없지만, 싼 가격에 빠르게 어딘가로 여행을 떠나고 싶은 사람들을 위해 만든 어플인 것 같다. 트립닷컴의 경우에는 출발/목적지와 날짜가 정해져 있는 상태의 사람들을 위한 어플인 것 같다.

이미 항공권 예약 어플들은 많지만, 마이리얼트립, kyte와 같은 새로운 회사들이 좀 더 사용성과 디자인을 개선하여 출시하고 있다. 또 이들은 수많은 투자를 유치하며 여행 관련 서비스의 자리를 굳건히 다지고 있다. 앞으로 기존의 앱들 또는 새롭게 출시될 다른 앱들이 어떻게 UXUI를 새로운 방식으로 풀어나갈지 기대가 된다.