brunch

You can make anything
by writing

C.S.Lewis

by 김긍정 Jun 27. 2022

알아두면 쓸데있을 검색 화면 iOS return key

유부초밥 검색하다 시작된 의식의 흐름

하루는 비도 오는데 갑자기 육회 유부초밥이 너무 먹고 싶어서.. ㅎ




처음의 나는 '더 귀한 분' 답게 배달의 민족을 향했다. 

배달의 민족_검색어 입력 전 iOS 키패드

'유부초밥'을 검색하는데 뜬금없이 iOS 키패드 위 '취소'가 눈에 띄었다. 아직 검색하기도 전인데 '취소'를 누르면 키패드가 사라지는지, 검색 화면을 이탈하는지 궁금해서 눌러보았다. 직업병이라 어쩔 수 없다. 키패드가 사라진다.


키패드와는 별개로 검색어를 입력하기 전에, 내가 위치한 근처 맛집을 사진으로 보여주는 경험은 좋았다. 광고지만 도움된다는 느낌을 받았다. 반면 바로 위 검색 배너광고는 뜬금없는 겨드랑이 무료 시술 이벤트 응모라 눈살이 찌푸려졌다.




두 번째는 최소 주문 금액과 배달비 비교를 위해 쿠팡 이츠로 향했다.

쿠팡이츠_검색어 입력 전 iOS 키패드

그런데 '취소'가 없는 것이었다. 그 취소 한 칸이 없으니 인기 검색어가 한 순위라도 더 잘 보였다. 아이러니하게도 1위인 우스블랑 보다 8위인 맥도날드가 눈에 더 띄었다.


배달의 민족은 검색어 입력 전 내 위치 근처의 맛집을 사진으로 보여주는데, 쿠팡이츠는 전체 인기 검색어 순위를 보여주는 UX가 달랐다. 여기어때의 숙소 예약처럼 결국 '지역'에 영향을 받는 온라인, O2O 플랫폼은 내 근처 혹은 내가 설정한 지역 근처의 상품을 보여주는 것도 중요하다. 화면 자체는 쿠팡이츠가 훨씬 더 깔끔했지만, 유용하다는 측면에서는 배달의 민족의 맛집 광고 영역이 더 와닿았던 것 같다.




세 번째는 쿠팡이츠와 쿠팡은 키패드 정책이 같을까? 하는 호기심에 쿠팡으로 향했다.

쿠팡_검색어 입력 전 iOS 키패드

그런데 쿠팡은 검색어를 입력하기도 전에 '검색'버튼이 활성화되어 있었다. 호기심에 눌러보았는데 active-default-active를 컬러로만 반복할 뿐 상태는 그대로였다. 그러면 아까 쿠팡이츠처럼 검색어 입력 전에는 비활성화해두는 게 낫지 않나?


키패드와는 별개로 생각해보니 쿠팡에서는 최근 검색어를 저장할 수 있는 기능을 제공하고 있었다.

쿠팡이 검색한 키워드를 기준으로 상품을 추천하다 보니 그게 귀찮아서 일부러 최근 검색어 저장을 꺼둔 것이었는데, 돌이켜보면 자신의 프라이버시를 지키고픈 고객에게도 필요할 수 있겠다는 생각이 들었다.



마지막은 여기어때로 향했다.


여기어때_검색어 입력 전 iOS 키패드

항상 이런 호기심이 발동할 때 그 끝은 내가 보고 있는 프로덕트다. 근데 뜬금없이 위아래 화살표와 '완료', 그리고 CTA가 '이동'인 것이었다...! 다시 배달의 민족을 살펴보니 배달의 민족은 '검색'도 '이동'도 아닌 return key였다. 배달의 민족처럼 '완료'를 클릭 시, 해당 키패드가 사라진다.


이게 모를 땐 안 보였는데 비교해서 보니 다른 서비스들은 키패드 제외한 영역을 인기 있는 상품을 추천하거나 광고 구좌로 쓰고 있어서, 최근 검색어로만 구성된 해당 영역이 아깝다는 생각이 들었다.






임팩트와 디테일


1) 검색 화면에서의 키패드 비율 최소화 (취소/완료 영역 제거)
2) '검색'으로 텍스트 표기
3) 검색어 입력 전에는 비활성화 -> 두 글자 이상 입력 후 활성화


벌써 하위 태스크가 세 개나 나왔다..ㅎ 쨌든 검색 화면에서 iOS 키패드의 return key 정책을 바꾸면 좋을 것 같은데, 혹시 또 다른 케이스가 없을지 궁금하여 iOS 개발자님께 애플이 정해둔 정책이 정리된 곳을 여쭤보았다. (UIReturnKeyType)


UIReturnKeyType

배달의 민족은 케이스가 'default'라 return key가 보인 것이고, 쿠팡이츠와 쿠팡은 'search', 여기어때는 'go'로 개발을 하여 이가 유저의 기기 언어에 맞게 한국어로 변환되면서 '검색'과 '이동'으로 보인 것이다. 


호기심에 애플 내에서 제공되는 검색 기능을 써보았는데, 애플의 경우 검색어 입력 전에는 'search' -> 검색어 입력 후에는 'move'를 띄우는 디테일이 숨어있었다. 그 외에도 일반적인 'next'와 'done', 메신저에서 자주 쓰이는 'send' 등이 보였다.



앱 기획은 운영체제에 대한 이해력도 필요하기에 어렵고도 재밌다.

솔직히 검색어를 입력하는 화면에서 저 엔터키의 정책을 바꾸는 것보다, 다른 서비스들처럼 '추천 검색어'나 '인기 검색어' 랭킹을 보여주는 것이 그다음 탐색 퍼널이나 구매 전환율에 훨씬 더 도움이 될 것이다.


그럼에도 불구하고 이런 자잘한 디테일도 공부하고, PO로서 제품에 녹이려는 노력은 계속될 것 같다.

네 화면을 함께 펼쳐놓고 보면 파란 컬러로 활성화되어있는 버튼이 확실히 눈에 띈다. 이 작은 디테일이 시력이 좋지 않은 고객에게는 도움이 될 수 있지 않을까? 별 것 아닌 디테일이라도 더 많은 고객을 배려하고 감동을 주는 제품을 만들 줄 아는 PO로 성장하고 싶다.


궁금해서 혼자 return과 enter의 차이를 알아봤는데, 수동 타자기 시대에서 줄 바꿈과 텍스트 입력을 위해 따로 구분하던 것에서 비롯되었다고 한다. 상반기 내내 하나의 큰 프로젝트에 집중하면서 return 한 줄씩 넘어가는 시간들을 보냈는데, 내일이면 enter! 또 다른 입력이 시작된다. 이번에 입력될 시간들은 전보다 더 능숙하고 유연한, 성장한 PO 스테이시가 되면 좋겠다.



임팩트도 디테일도 놓치고 싶지 않은

공부 일기 마침.





p.s. 구독자님들을 향한 소소한 공지

그동안 운영해온 <전지적 PM 시점> 매거진은 <전지적 예비 PM시점>으로 네이밍과 콘텐츠를 변경하여, 취준생 때의 기록으로만 남겨두려 합니다. 업데이트되는 글을 원하시면 매거진이 아닌 작가 김긍정을 구독해주세요 :')

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