UX/UI 디자인 설계 I(제6주)

lakebear·2023년 4월 11일
0

정보 구조 설계
✓ 정보의 체계, 구조, 동선을 만들어내는 작업
✓ 사용자의 사용 행동 중 탐색과 관련이 많음

IA설계

정보 정의 → 정보구조 설계 → 내비게이션 설계 → 검색 설계 → 필터/태그 설계 → 레이블링

정보 정의
서비스에서 제공할 정보를 정의하는 작업
정보 정의서에는 정보 계층구조, 유형, 현황, 정보 단위, 구성, 출처, 디지털 가공 여부, 제공 방식, 담당자, 업데이트 주기, 사용자 참여 방식 등의 정보가 들어간다.

정보구조 설계

  • 대>중>소로 이어지는 정보의 계층구조를 만드는 것이 가장 주된 작업
  • PC 웹과 달리, 모바일에서는 단계가 지나치게 깊은 설계를 지양한다.

계층구조(Hierarchy)
주로 햄버거 모양의 전체 메뉴를 배치해 순차적으로 원하는 정보에 접근할 수 있도록 하는 방식
정보 규모가 크고 단계적으로 정보를 탐색하는 경험이 많은 서비스에서 사용됨 (주로 PC에서 사용)
허브&스포크(Hub&Spoke)
홈 화면이 메뉴 링크(개인화, 추천, 바로가기, 목록 등)로 구성되어 허브 역할을 하고 개별 정보를 왔다 갔다 하는 방식
정보 규모가 작고 홈 화면의 의존도가 높은 서비스에서 주로 사용 (넷플릭스, 유튜브, 틱톡같은 미디어 서비스)
중첩 인형(nested doll)
메인에서 출발해 탐색, 조회, 주 활동 등을 거치며 마지막까지 단선적으로 진행되는 방식
정보 규모가 작고 이용흐름이 단선적인 서비스에 적합(날씨, 일정, 지도 같은 소규모 서비스 or 단일상품 예약 위주 서비스)
대시보드(dashboard)
허브&스포크 방식과 유사하지만 홈 화면에서 요약 정보를 보여주어 홈 화면의 역할이 훨씬 크다는 차이를 가진다.
간단한 핀테크 앱(헬스케어, 파일 관리, 스케줄 등)에서 많이 채택한다.

내비게이션 설계

  • 메뉴를 탐색할 때 쓰는 도구
  • 모바일에서는 내비게이션이 차지하는 비중이 PC보다 적고, 그 대신 제스처 (Gesture)와 상태변화(Transition)가 중요하다.
  • PC에서의 조작은 마우스 클릭, 올리기, 잡아끌기, 키보드 입력 등으로 제한되어있지만 모바일은 조작 방법이 매우 다양하기 때문에 제스처를 내비게이션의 한 요소로 활용할 수 있다

검색 설계
검색결과
연관검색어
검색옵션
카테고리 구분
추천 검색 결과

메뉴 탐색과 달리 키워드를 직접 입력하거나 조건을 여러 개 선택해서 원하는 정보로 빠르게 접근할 수 있는 탐색 방법
검색에서 설계해야 할 항목
검색어 입력 : 검색 입력창의 위치/ 자동완성/ 자동 추천/ 검색 기록
검색 옵션 : 검색 카테고리 선택/ 상세 검색 옵션/ 검색 결과 필터링
검색 결과 기능 : 연관 검색/ 추천 검색 결과/ 검색결과 카테고리화/ 검색 결과 정렬
검색 리소스 : 소셜 검색/ 외부 리소스 검색/ 메타데이터 / 시소러스
검색어 입력창에 안내 문구는 서비스 특색이 반영되어야 한다. (ex. '주문하려는 음식을 입력하세요.')

필터/태그 설계 - 개인화
특정 정보 범위 또는 특정 정보 하나에 바로 접근할 수 있게 돕는 중요한 경험요소
필터 : 원하는 정보를 찾는 조건을 사용자가 직접 고민하고 제스처 해야 한다. (목적의식적인 동기에 적합)
선택한 조건을 모두 만족하는 결과만 보여주는 방식 (AND 조건)
선택한 조건에 해당하는 결과는 모두 보여주는 방식 (OR 조건)
개인화와 밀접 > 매번 필터링하지 않아도 처음에 설정한 조건들이 자동으로 적용되면 좋은 UX를 제공할 수 있다.
태그 : 미리 제시된 것 중에 하나를 선택만 하면 된다. (비목적의식적인 동기에 더 적합)

레이블링
서비스의 메뉴명, 정보명, 검색 조건명, 필터명, 태그명 등을 설계하는 작업

레이블링의 원칙

  • 모든 레이블은 정보를 대표해야한다.
  • 사용자 입장에서 레이블 (전문용어/ 기술적인 용어/ 함축어/ 유행어/ 생략된 용어를 피한다.)
  • 사용자가 해야 할 서술적인 레이블이 좋다.
  • 일관된 레이블 원칙
    +하위 정보로 들어갈수록 보다 세밀화된 레이블을 적용
    +같은 내비게이션에 배치된 레이블은 문법적으로도 동일하게 적용
    +레이블은 일관된 폰트, 크기, 스타일로 구성
    +특정 정보에 대한 레이블은 사이트 어느 곳에서든지 동일한 이름을 가져야 한다.
  • 레이블이 너무 길면 좋지 않다.
  • 품사를 통일한다.
  • 언어도 통일한다.
    중복되는 레이블은 피한다.
profile
https://lakedata.tistory.com 블로그 이전

2개의 댓글

comment-user-thumbnail
2023년 4월 11일
답글 달기
comment-user-thumbnail
2023년 4월 13일
답글 달기