나를 가꾸는 참 쉬운 방법 '카카오헤어샵'
UX/UI 분석
서비스 소개
카카오헤어샵은 카카오에서 제공하는 헤어샵 예약 서비스로, 사용자가 손쉽게 주변 미용실을 검색하고 예약할 수 있도록 도와줍니다. 이 서비스는 카카오톡과 연동되어 별도의 앱 설치 없이 이용할 수 있으며, 실시간 예약 시스템을 통해 원하는 시간에 예약을 할 수 있습니다. 또한, 고객 리뷰와 평점을 통해 신뢰할 수 있는 미용실을 선택할 수 있고, 포인트 적립 및 다양한 할인 혜택도 제공합니다. 최신 헤어 스타일 정보와 트렌드도 제공하여 사용자가 자신의 스타일을 쉽게 결정할 수 있도록 도와줍니다.
사용자 경험에서 디테일이 조금 부족했던 거 아닐까?
카카오헤어샵의 홈은 상단 광고와 하단 터치영역을 살짝 걸쳐주면서 서로 연관된 카테고리라는 것을 간접적으로 표현해 준 것이 인상 깊었습니다. 또한 헤어샵, 네일샵, 에스테틱 영역에서 헤어샵 버튼의 사이즈만 크게 키워주어 가장 이용률이 많은 버튼에 가장 큰 터치영역을 준 것도 UX적으로 사용자를 충분히 고려한 것으로 보였습니다.
홈 하단으로 내려가면 추천메뉴가 보입니다. 추천 메뉴에서는 생각보다 저에게 정말 맞는 시술들을 추천해주고 있습니다. 실제로 저는 카카오헤어샵을 이용하면서 다운펌 시술을 많이 이용했고, 이런 데이터를 활용해 사진과 함께 사용자 위치 근처의 미용실을 추천해 주니 시술과 미용실을 고려할 때 매우 편리했습니다.
다만 아쉬운 점이 한 가지 존재했습니다. 추천 메뉴를 통해 상세페이지에 진입하면 추천메뉴에서 보여주었던 시술로 바로 연결되는데, 이 과정에서 바로 시술을 바꾸기가 어려웠습니다. 위의 화면으로 예를 들자면 남성컷에서 추가적으로 다운펌을 추가하고 싶다면 해당 페이지에서 바로 수정할 수 있는 것이 아니라 미용실 버튼을 눌러서 처음부터 다시 예약하기를 진행해야 합니다.
상세 페이지에서도 시술 별로 버튼을 추가하여 옵션 체크형식으로 시술 구성을 바꿀 수 있게 해 주었다면 더 좋은 경험이지 않았을까 생각합니다.
사소한 디테일이 주는 편의성
미용실 상세페이지에 진입하면 각종 미용실 정보와 예약하기 CTA를 확인할 수 있습니다. 예약하기를 진행하면 디자이너부터 고를 수 있게 되어있는데, 시술 선택 과정에서도 별도의 이탈 없이 디자이너를 변경할 수 있도록 디자인한 점이 매우 편리했습니다.
예약과정에서 결제까지 특별히 문제가 없는 경험이었지만, 한 가지 새로운 제안을 하나 하자면 ‘디자이너 정기 휴무 표시 기능'입니다. 현재는 특정날짜를 클릭하고 나서 디자이너 정기 휴무임을 알 수 있지만, 해당 데이터를 바탕으로 애초에 비활성화 처리를 해놓거나 빨간색 표시로 예약이 불가능한 점을 미리 UI에 표시를 해주면 더욱 편리한 예약 경험이 될 수 있지 않을까 합니다. 사소한 기능이지만 이렇게 사소했던 기능들이 모여 결국 유저에게 생각하지 못했던 새로운 편의성을 준다고 생각합니다.
굳이 인스타를 들어갈 필요가 없다
많은 사람들이 미용실에 가기 전, 디자이너 선생님에게 보여드릴 레퍼런스 자료를 찾기 위해 인스타그램에서 본인이 원하는 스타일의 이미지를 찾고는 합니다. 그러한 과정을 정확히 파악해 서비스에 녹여낸 카카오헤오샵의 UX는 정말 놀라웠습니다.
카카오헤어샵의 스타일북 카테고리에 들어가면, 상단에 각종 시술 종류들이 있습니다. 그리고 예를 들어 커트에 들어가면 시술이 완료된 모든 레퍼런스를 체크할 수 있었습니다. 이게 왜 편리한 UX인지 더 자세하게 설명드리면, 기존에 인스타에서 레퍼런스를 확인할 때는 해당 시술을 진행한 미용실이 내 위치 근처일 확률이 매우 낮을뿐더러 어느 미용실인지 정확히 모르는 경우도 많습니다. 따라서 이런 스타일을 다른 선생님들께 부탁할 수밖에 없었죠.
하지만 카카오헤어샵에서는 기본적으로 내 위치 근처 미용실의 레퍼런스들을 보여주고 내가 원하는 스타일을 클릭하면 바로 예약이 가능하기까지 합니다. 내가 원하는 스타일을 시술한 선생님에게 시술을 받을 수 있기 때문에 확률적으로 더 만족감 높은 미용을 할 수 있게 되는 것입니다.
카카오헤어샵 뷰카피
카카오헤어샵 예약 메뉴 페이지의 뷰카피를 진행했습니다. 전체적으로 여유있으면서도 포인트 컬러를 적절히 배치하여 불필요한 시선 분산이 없었습니다. 본문 폰트는 14px ~ 17px 사이로 디자인되었으며 디자인하면서 조금 특별하게 느꼈던 점은 염색과 클리닉 섹션의 상단과 하단 여백이었습니다. 보통의 카드 UI에서는 상단보다 아래를 더 여유 있게 잡아주었던 게 일반적이었던 것 같은데 해당 UI에서는 상단에 28px, 하단에 20px로 잡아주었습니다. 해당 섹션처럼 디자인해주어도 충분히 염색과 클리닉 섹션이 구분되어 보였습니다.
