대시보드 디자인 (구성 요소, 타입, 레이아웃)

수현·2024년 1월 30일
1

Dashboard

목록 보기
4/5
post-thumbnail

대시보드 디자인 구성 요소

1. 대상 사용자 파악

  • 대시보드를 사용할 대상과 그들의 특정 요구 사항을 식별해야 한다.
  • 적합한 형식 및 접근 빈도를 결정해야 한다.
  • 예시: 매출 관리자를 위한 대시보드는 매출 추세, 지역별 판매 데이터 등을 중점적으로 표시해야 한다.

2. 대시보드 목적과 기능 설정

  • 대시보드의 목적에 따라 기능 및 사용자 상호작용 정의가 필요하다.
  • 탐색(Exploration) 또는 설명(Explanation)에 중점을 둔다.
  • 예시: 탐색용 대시보드는 사용자가 데이터를 자유롭게 조사할 수 있도록 다양한 필터 및 드릴다운 기능 제공한다.

3. 형식과 레이아웃

  • 대상 사용자가 대시보드를 보는 방식에 따라 형식 결정한다.
  • 정보 흐름을 지원하고 사용자의 질문에 답할 수 있도록 레이아웃을 구성해야 한다.
  • 예시: 모바일 사용자를 위한 대시보드는 스크롤이 많지 않고 정보가 잘 정렬된 레이아웃을 선호한다.

4. 시각적 구성 요소 결정

  • 주요 지표를 바탕으로 다양한 값, 차원, 형상을 나타내는 시각적 요소들을 결정한다.
  • 예시: 매출 데이터를 나타내는 대시보드는 막대 그래프, 원형 그래프 등으로 중요 지표를 시각화한다.

대시보드 목적: 탐색용 대시보드 vs 설명용 대시보드

1. 탐색용 대시보드(Exploratory Dashboard)

  • 목적: 사용자가 데이터를 자유롭게 탐색하고, 자신만의 인사이트를 발견할 수 있도록 한다.

  • 사용자 상호작용: 사용자 상호작용이 높다. 사용자는 다양한 필터, 드릴다운, 데이터 분할 등을 통해 데이터를 다각도로 분석할 수 있다.

  • 특징:

    • 탐색용 대시보드는 사용자 맞춤형 데이터 세분화를 위한 필터를 갖추고 있다.
    • 탐색 선택지를 넓히기 위해 사용자가 설정할 수 있는 내비게이션 패널을 제공한다.
    • 더욱 세밀한 데이터 조회를 위해 드릴다운 기능을 포함한다.
    • 사용자가 가설을 검증하고 유용한 인사이트를 찾을 수 있도록 상호작용적인 시각 자료를 제공한다.

2. 설명용 대시보드(Explanatory Dashboard)

  • 목적: 특정 데이터 포인트나 스토리를 사용자에게 명확하게 전달하고, 특정 결론에 도달하도록 유도한다.

  • 사용자 상호작용: 사용자 상호작용이 제한적이다. 대시보드는 사전에 정의된 데이터 포인트와 시각화에 초점을 맞춘다.

  • 특징:

    • 설명용 대시보드는 데이터가 이미 특정 스토리를 전달하기 위해 필터링되어 있기 때문에 필터와 상호작용이 적다.
    • 이러한 대시보드는 이미 발생한 사건들을 설명하는 사전 정의된 스토리라인으로 구축된다.
    • 경영진에게 발표할 때 흔히 사용되며, 실행 가능한 인사이트를 제공한다.

대시보드 형식 선택

  • 표준 형식: 대부분의 대시보드 컴포넌트가 화면에 보이고 스크롤이 의도되지 않은 16:9 비율의 직사각형 대시보드이다.

  • 긴 형식: 가로 스크롤이 유용할 수 있으며, 타임라인 대시보드처럼 스토리를 전달하는 데 적합하다.

  • 세로 형식: 신문의 긴 칼럼 스타일처럼 읽히며, 주로 모바일 애플리케이션에서 사용된다.


대시보드 레이아웃

1. 2차원 그리드 시스템 사용

  • 대시보드 레이아웃은 균형 잡히고 대칭적이며 탐색하기 쉬운 2차원 그리드 시스템을 사용한다.

2. 고위급 KPI 지표 배치

  • 고위급 KPI 지표(일명 BANs)는 가시성을 위해 대시보드 상단에 그룹화하여 배치한다.

3. 정보 흐름 고려

  • 대시보드의 정보 흐름을 고려하는 것이 중요하다.
  • F-패턴은 웹 콘텐츠를 스캔하는 가장 일반적인 눈동자 움직임 패턴이다.
    • F자를 상상해보면, 시청자의 눈은 가장 먼저 왼쪽 상단을 스캔하므로 KPI와 같은 핵심 정보를 배치하기에 최적의 위치다.
    • 오른쪽 하단은 대시보드에서 가장 덜 볼 수 있는 부분이므로 정보 배치 시 고려해야 한다.
profile
데이터 분석 공부중:)

0개의 댓글