필터의 역할은 유저의 검색 시간과 정보의 복잡성을 줄여주는 것이다. 원하는 정보에 도달하는 데 드는 에너지를 줄여준다.
결국 구매 전환으에 기여되기 때문에 좋은 사용자 경험을 가진 필터를 구축해야 한다.
필터 기획 시 고려할 점
1. 유저 퍼스트
유저의 검색을 도와주는 것이 필터의 역할이다.
유저가 필터를 어떤 맥락에서 사용하는지 고려해야 한다. 공급자가 아닌 유저의 입장에서 생각할 것.
유저의 사용 시나리오를 구상하면서 어떤 순서로 정보를 보고싶을지 상상해본다.
2. 서비스 데이터 구조 이해
하나의 상품이나 콘텐츠가 어떠한 데이터에 의해 분류되는지 구조를 파악해야 한다.
분류되는 기준과 입력하는 데이터의 형태는 서비스마다 다르다. 분류의 기준과 데이터의 형태를 이해하고 있어야
서비스에서 어떤 필터가 적합한지, 어떤 UI패천을 사용할 지 결정할 수 있다.
또한 필터가 적용되지 않는 누락 상품이나 콘텐츠가 존재하지 않도록 모든 데이터를 반영해야 한다.
3. 필터 모의 테스트
필터의 조건을 너무 상세하게 나누면 한 필터에 의해 분류되는 상품의 개수가 적어진다.
이렇게 된다면 오히려 좋지않은 유저경험을 줄 수 있다.
데이터팀과 협업해 필터를 적용했을 때 나열되는 모의 결괏값을 미리 파악하면서 너무 적은 결괏값이 나오는 필터링 조건을
기획단계에서 제외할 수 있다. 결과가 만족스럽지 않은 필터링 조건을 보완하면서 팀의 리소스를 현명하게 사용할 수 있다.
필터UX의 유형들
풀 스크린 필터
전체 화면을 덮어 필터의 옵션을 보여주는 방식.
한 번의 클릭으로 필터 전체가 모인 화면으로 진입.
전체 화면으로 인해 유저가 모든 필터를 둘러볼 수 있도록 유도한다.
필터의 종류에 압도될 가능성이 있을 때, 슬러이더나 체크박스, 컬러칩들을 사용한다.
정교한 필터 설정이 필요한 서비스나 필터에서 보여주는 정보가 많을 때 풀 스크린으로 자주 사용된다.
바텀 시트 필터
버텀 시트가 하단에서 올라오는 구조.
원하느 필터를 선택하면 해당 필터가 하단에 나타나면서 화면 전체를 덮지 않아 사용자는 부담스럽지 않다.
손쉬운 필터 설정을 유도할 때나 필터에서 보여주는 정보가 많지 않아도 될 때 사용된다.
사이드 바 필터
화면 사이드에서 나오는 세로가 긴 형태의 필터
필터를 누르면 측면에서 필터가 나와 여닫을 수 있다.
유저가 한눈에 전체 필터와 위계를 파악할 수 있다.
상단 고정형 필터
필터의 짐입점, 선택 영역까지 상단에 고정된 필터
화면 상단의 좁은 영역을 이용해 필터를 열고 설정할 수 있다.
화면을 많이 가리지 않아 유조가 콘텐츠 탐색을 이어가도록 유도한다.
가벼운 액션으로 필처 설정을 유도하고 싶을 때, 필터의 선택지가 많지 않을 때 사용한다.
필터 없는 필터링(예외 사례)
검색 화면에 국한되지 않은 필터링, 유저가 찾으려는 콘텐츠를 예측하여 제공하는 필터
검색없이 원하는 콘텐츠를 찾을 수 있다.
유저가 원하는 콘텐츠로 도달하는 과정을 줄이고 싶을때. 유저의 선호 정보를 미리 파악할 수 있을 때 사용된다.
