검색 UX 1. 검색어 입력
이전 글에서는 29CM를 예시로 들어 검색 기능을 (1)검색어 입력, (2)결과 조회, (3)결과 전시의 세 단계로 나누고, 전반의 FLOW를 정리했습니다. 이어서 앞으로는 각 단계마다 발생하는 유저의 문제와, 이에 대응하는 UX 장치를 분석해 보겠습니다. 그 첫 번째로 이번 글은 (1)검색어 입력 단계의 UX 분석 입니다.
검색은 유저가 원하는 것을 찾기 위해 가장 적극적으로 액션하는 기능입니다. 검색어 입력 과정에서 유저는 다양한 문제를 겪을 수 있는데, 스스로 원하는 걸 모르거나 구체적이지 않을 수 있고 적절한 검색방법이나 검색어를 모를 수도 있습니다. 잘못 입력할 수도 있고, 또는 별다른 목적 없이 습관적으로 진입했을 수도 있지요. 이처럼 다양한 시나리오를 잘 고려해 설계함으로써 유저의 목적과 만족을 높일 뿐만 아니라, 유저의 액션을 전환시켜 비즈니스 목표를 달성하는 것이 중요합니다.
검색 플레이스홀더
시작은 간단히 검색 플레이스 홀더입니다. 사용자가 검색을 시작할 때 한번씩은 보게 되는 영역이며, 검색 화면에 본격적으로 진입하지 않더라도 서비스 메인부터 노출되는 경우도 있지요. 간단한 기능이지만 다양하게 활용되고 있습니다.
검색어 가이드
크림은 기본적인 검색어 가이드를 제공합니다. 브랜드 같은 상품 속성 정보나 스타일이라는 자체 소셜 기능을 검색하도록 안내합니다. 다만, 이 단계에서 유저가 겪는 어려움은 무엇을 검색할지 모르는 것일 수 있는데, 이를 해결하기에는 다소 평이하고 기본적인 가이드로 보입니다.
기능 가이드
오늘의집은 조금 다른 가이드를 제공합니다. 차별화된 콘텐츠 강점을 가진 대표적인 커머스답게 크리에이터를 검색하고 컨텐츠를 소비하도록 유도합니다. 목적성이 뚜렷하지 않았던 유저도 콘텐츠를 둘러보며 상품을 발견하고 구매로 이어질 수 있고, 오늘의집 내부적으로도 활성화된 유저를 판단하는 기준으로 콘텐츠 소비 지표를 사용해서 그로스 전략을 삼은 것이 아닐까 추측해 볼 수도 있습니다.
마케팅 문구
지그재그는 검색 필드를 마케팅 영역으로 활용합니다. 몇몇 커머스에서 채택하는 방법인데요. 검색 필드는 고객의 탐색 과정에서 주목도가 높은 강점이 있는데, 별도의 영역을 차지하지 않으면서 가벼운 텍스트만으로 캠페인을 노출하는 경제적인 방법입니다. 또, 할인 같은 일반적인 이벤트뿐만 아니라 특정 상품을 노출하는 것도 새로운 상품을 발굴하고 싶은 호기심 많은 고객을 유인하기에도 좋습니다.
기타
당근은 지역 기반의 커뮤니티인 만큼 현재 접속한 지역을 안내합니다. 이렇게 되면 고객이 설정된 지역을 잘못 알고 있다가 다시 검색할 불편함을 막아줄 수 있을 텐데, 어쩌면 고객이 실제로 헷갈리는 경우가 많은 걸 포착한 결과일 수도 있겠습니다. 아니라면 지역 정보는 다음에 소개할 검색 기본화면에 녹이고 입력필드는 로컬 광고 상품으로 운영해 트래픽이 높은 커뮤니티로서 수익성을 높이는 것도 좋은 방법일 것 같습니다.
검색 플레이스 홀더는 가장 간단한 장치이고 익숙할수록 지나치기 쉬운 만큼 얼마나 효과적일지는 궁금해 집니다. 실험해 보기에도 좋은 주제일 것 같고, 효과적으로 활용하는 또 다른 서비스가 있을지도 알아보고 싶네요!
검색 기본화면 구성
검색 기본 화면은 플레이스홀더와 마찬가지로 고객이 검색 활동을 시작할 때 필수적으로 보는 화면입니다. 사이즈가 작은 모바일에서도 전체 화면을 차지하는 만큼 서비스마다 기본 화면에 다양한 의도를 담아 구성하고 있습니다.
최근 검색어
최근 검색어는 대부분의 서비스에서 제공하고 있습니다. 유저의 검색 노동을 줄이는 기본적인 장치로써 로그인 기반으로 계정 하위나 비로그인 기반으로는 로컬 브라우저 등에 일정 기간 동안 검색했던 용어를 저장해 두고 제공합니다.
토스는 검색 화면에 진입했을 때 가이드를 제공합니다. 한번 검색이 발생하면 가이드는 최근 검색어로 대체되어 화면을 효율적으로 사용하고 있습니다.
추천 검색어
쿠팡과 컬리는 검색 기본화면에서 추천 검색어를 제공합니다. 차이점이 있다면 쿠팡은 유저의 최근 검색어나 구매 내역을 기반으로 개인화했고 컬리는 그렇지 않습니다. 쿠팡은 버티컬 커머스가 아니며 무수한 상품을 보유한 오픈마켓이니 유저와 맥락이 있는 키워드를 추천하는 것이 적절해 보입니다.
반면 컬리도 개인화된 키워드를 추천해도 되겠지만 비교적 상품군이 한정되어 있고 컬리만의 특별한 상품이나 MD 추천 상품도 수요가 높으니 컬리의 강점이 잘 활용된 것 같습니다.
인기 / 급상승 검색어
컬리와 무신사는 인기 검색어를 제공합니다. 특히 무신사는 인기 검색어와 별개로 급상승 검색어를 한번 더 제공하는데, 패션 플랫폼으로서 빠르게 변하는 트렌드를 기민하게 반영할 수 있습니다.
무신사의 급상승 검색어는 20분마다 업데이트되는데, 인기 아이돌이 착용했거나 SNS에서 화제인 아이템이 있다면 실시간으로 급상승 검색어에 반영될 수 있습니다. 이 경우에는 유저의 검색 문제를 해결할 뿐만 아니라 콘텐츠로서의 가치도 있어 보입니다.
인기 검색어 심화
무신사에 "급상승 검색어"가 있다면, 크림은 "인기 콜라보" 검색어를 별개로 제공합니다. 한정판 굿즈는 특성상 시즌마다 핫한 콜라보를 중심으로 사람들이 관심을 갖고 인식하게 되는데, 이것이 반영된 것으로 보입니다. 콜라보는 리셀이 아닌 일반 상품에는 거의 없는 정보인데, 도입된 배경 또한 실제 운영 중 콜라보 검색량의 비율이 높아 도입됐을 가능성도 있을 것 같습니다.
교보문고는 실시간 검색어에 드롭다운을 넣어 확장이 가능합니다. 접어두어 공간을 절약했다가 펼쳐서 자세하게 볼 수 있지만, 메인에도 베스트셀러와 같이 유사한 기능이 많은 만큼 실효성이 있을지는 의문이 듭니다. 도서 또한 컨텐츠로서 취향을 타는 만큼 개인화된 키워드를 제공할 수도 있고, 상품을 탐색하려는 고객이 진입하는 화면인 만큼 클릭수가 높거나 MD 추천 상품처럼 새로운 상품을 발굴할 수 있도록 구성하는 것도 좋은 방법일 것 같습니다.
검색 기본화면에서의 다양한 컨텐츠 구성
지금까지 소개한 검색 화면은 주로 텍스트 위주였는데요. 검색 화면은 검색어 입력 전까지만 짧게 보이는 만큼 가벼운 텍스트 위주의 제공이 경제적일 수 있습니다. 한편 이미지나 영상 등이 다양하게 활용된 서비스도 있는데, 성격상 컨텐츠 플랫폼에 가까울수록 자주 보입니다.
이미지
캐치테이블과 왓챠피디아는 검색 기본화면에서 이미지를 사용해 주목도를 높입니다. 캐치테이블은 마치 스트리밍 어플의 플레이리스트처럼 식당 테마를 구성하고 이미지로 제공했습니다. 특별한 장소를 찾을 때 사용되는 만큼 고객이 가장 원하는 정보를 강조한 것으로 보입니다.
컨텐츠 리뷰 플랫폼인 왓챠피디아는 검색 화면의 모든 컨텐츠를 이미지 중심으로 구성하고 그 외에는 대표정보 위주로 짧게 줄였습니다. 포스터/표지를 보고 내용이나 분위기를 유추할 수 있으니 컨텐츠 플랫폼에 적합한 포맷으로 보입니다. 개인적으로는 상세페이지까지 진입하지 않고도 유저가 컨텐츠에 흥미를 갖고 선택하기 위해서는 자신의 취향에 맞다고 여겨야 하는데, 아카이빙 앱으로서 오랫동안 축적된 데이터가 강점인 만큼 유저의 예상 별점과 인기높은 한줄평을 미리 제공하는 것도 좋은 방법일 것 같습니다.
이미지/태그
멜론은 음악 스트리밍 플랫폼임에도 이미지를 적극 활용하지는 않았습니다. 맞춤 영역의 가수명이나 장르, 분위기/테마 정보는 컨텐츠를 구성했던 상세 정보를 활용해 제공하는 것으로 보이고, 따라서 이미지 정보를 기본으로 등록하는 가수명에만 이미지가 사용되었습니다. 확보된 정보를 바탕으로 초기 구성하고, 이후 운영 데이터가 점차 쌓이면서 고도화할 기회가 있겠습니다.
이미지/영상
광고 BM 기반으로 무료 음악 스트리밍을 제공하는 Musi 는 검색 기본화면을 감각적으로 구성했습니다. 특히 최상단에는 영상 컨텐츠를 넓게 배치해 유저가 쉽게 주목하고 호기심을 갖도록 구성했는데, 클릭하면 영상을 재생하기 전 광고가 실행되어 단순히 디자인뿐만 아니라 수익을 유도한 점이 돋보입니다.
자동완성 / 미리보기
검색어 입력을 시작하면 보통 하단에 자동완성이 제공됩니다. 검색어를 일일히 끝까지 타이핑하지 않도록 수고를 덜어주는 편의 기능인데요. 자주 입력하는 검색어 위주로 인덱싱 되어있다가, 입력하는 동시에 실시간으로 빠르게 반응해서 채워줄 수 있는 성능도 중요합니다. 그 밖에도 검색어 입력뿐만 아니라 전반적인 탐색 과정을 단축시켜 줄 수 있는 서비스의 다양한 UX들을 확인해 보았습니다.
검색어 자동완성 / 바로가기
당근과 무신사는 검색 키워드를 자동완성 합니다. 연관된 카테고리나 브랜드 바로가기 버튼도 제공해 플로우를 단축하고 있습니다. 자소 기준으로 일치하는 키워드를 노출하는데, 차이점이 있다면 당근은 무조건 키워드의 앞글자부터 완성해주는 반면, 무신사는 중간부터 일치하는 키워드도 노출할 수 있도록 별도의 자료구조를 처리한 것으로 보입니다.
상품 자동완성
컬리는 독특하게 검색 키워드가 아닌 상품을 자동완성합니다. 오픈마켓이 아니니 비교적 상품의 수가 한정되어 있고, 상품을 직접 자동완성하는 경우에는 눌렀을 때 검색 결과 없이 바로 상품 상세페이지로 이동할 수 있어 플로우를 훨씬 단축할 수 있습니다. 자주 검색되는 상품뿐만 아니라 신규 상품도 별도로 배치해서 고객의 다양한 의도를 충족시키려고 했습니다.
미리보기 / 장바구니 담기
구글은 자동완성 단계에서 인물, 장소, 컨텐츠 등 일부 정보에 한해 장르나 직업 같은 요약 정보와 미리보기 이미지를 제공합니다. 구글은 자신들이 직접 보유하지 않은, 온라인 상의 여러 문서들을 크롤링해서 검색할 수 있도록 하는 포털 서비스임에도 불구하고, 일부 정보는 '구글 지식 패널'이라는 기능으로 자체적으로 주요 정보를 저장해 DB로 가지고 있기 때문에 제공할 수 있는 것으로 보입니다. 추가로, 이미지는 매번 자동완성 될때마다 CDN에서 새로 불러와야 하고 성능이나 비용 상의 문제가 있을 수 있는데 구글이니 가능한 것 같습니다.
교보문고도 상품(책)을 자동완성해주며, 자주 검색되는 것 위주로 인덱싱된 DB를 활용하므로 흔하지 않은 책은 자동완성되지 않습니다. 컬리와 마찬가지로 상품을 자동완성해 상세페이지로 바로 이동시킴으로써 검색 과정을 단축시켜줄 뿐만 아니라, 장바구니 버튼을 곧바로 제공해 한번 더 플로우를 단축합니다. 유저가 별도의 탐색 과정 없이 구매할 책을 정해둔 상태로 장바구니에 담기 위해서 검색만 할 수도 있는데, 이를 세심하게 고려했습니다. 저 또한 여러 권의 책을 구매할 때 검색 > 장바구니 담기 과정만 여러번 반복해야 할 때가 있는데 유용하게 사용하고 있습니다.
지난 글에서는 검색을 시작해서 검색엔진이 동작하고 결과가 리턴되는 전반의 플로우를 정리했다면, 이번 글에서는 그 첫번째 단계인 검색어 입력 단계의 주요 UX 기능을 분석해 보았습니다. 검색어 입력은 사용자가 자신의 목적 달성을 위해 적극적으로 요청을 날리는 만큼, 프론트 단에서 다양한 문제가 발생할 수 있어 사용자 중심으로 설계하는 것이 가장 중요할 것 같습니다. 또한, 기획자 입장에서는 고객의 적극적인 행동이 수집되는 만큼 실제 운영하며 쌓이는 데이터를 분석해 서비스를 크고 작게 개선하는 재미도 높을 것 같습니다. 그럼 다음에는 두번째 단계이자 주로 백앤드 위주로 구성되어 있는 (2)결과 조회 단계를 분석해 보겠습니다.
