Real Design

검색 UI 패턴 본문

UI&UX/Search

검색 UI 패턴

GS Real Design 2013. 2. 25. 11:06

UI 디자인 패턴이란?
 - 패턴 : 반복되는 일정한 형태나 양식, 유형
 - 여러 앱에서 자주 나타나는 화면 및 인터랙션의 방식
 - 좋은 UI 패턴을 자주 익히면 화면의 목적과 성격에 알맞은 UI를 구성할 수 있다.
 
UI Pattern을 활요한 기능별 화면의 구성
 a. 캘린더, 계산기, 매거진..
 b. 기능에 반복적으로 적용되는 화면의 틀을 공통적으로 적용, 이후 세부 UI 결정

 

 

검색, 정렬 및 필터

a. 검색 : 검색어 자동 완성, 결과 바로 보여주기, 검색 범위의 선택과 조건 검색
    - 항목을 찾는 가장 일반적인 방법
    - 문자 입력을 최소활 할 수 있는 방법 제공
    - 연관 검색을 통한 스마트한 검색
    - 검색어 자동 완성 : 검색어 입력을 시작하면 자동으로 검색어 추천, 검색 사이트에서 제공하는 방법
    - 결과 바로 보여주기
      ① 입력한 문자에 대한 검색 결과를 즉시 보여주는 방법(Filtering)
      ② 입력한 검색어 위치로 건너뛰는 방법(Jumping)
      ③ 한글의 경우 초성검색을 통한 결과 보여주기
    - 검색 범위의 선택과 조건 검색 : 검색 대상의 범위를 좁혀 검색하는 방법, 특정 검색어가 아닌 조건을 입력하여 검색하는 방법
 b. 정렬 : 목록 순서를 변경
    - 다양한 조건에 의하여 목록의 순서를 변경하는 방법
    - 순서 변경 조건을 제공하는 다양한 방법(탭, 드롭다운, 선택 목록 등)
    - 현재 설정된 정렬 조건과 순서에 대한 명확한 피드백 제공
 c. 필터링 : 조건을 부여하여 목록의 개수
    - 범위 또는 조건을 부여하여 목록의 개수를 줄이는 방법
    - 정교하고 다양한 조건 제공보다 빠르게 설정할 수 있는 방법의 제공

 

 

0 Comments
댓글쓰기 폼