Power BI 모바일 앱에서 데스크톱 리포트를 그대로 세로 화면에 보여주는 것이 아니라, 모바일 전용 레이아웃으로 다시 설계하는 것이 좋습니다. Power BI 모바일 앱은 폰을 세로로 들었을 때 자동으로 모바일 최적화 화면을 보여주고, 가로로 돌리면 기본 데스크톱 뷰로 전환되기 때문에, 세로 화면에 맞춘 레이아웃 설계가 필수입니다.
Power BI 모바일 레이아웃의 기본 개념
Power BI Desktop에서 페이지를 만들고도, 각 페이지에 대해 Phone Layout(Mobile Layout)을 별도로 설계할 수 있습니다. 모바일 최적화 화면은 iOS와 Android용 Power BI 앱에서만 세로 방향으로만 표시되며, 브라우저에서는 데스크톱 기준 화면만 보는 구조입니다. 따라서 데스크톱 리포트는 그대로 두고, 모바일용 레이아웃은 새로 배치하는 설계 작업이라고 생각하는 것이 맞습니다.
주요 비주얼과 텍스트만 골라서 세로로 재배치하고, 불필요한 장식 요소나 배경은 줄이는 것이 좋습니다. Power BI는 모바일 레이아웃에서 필요한 비주얼만 선택하고 재배치해 작은 화면에서 읽기 쉽고 사용하기 쉽게 만드라고 권장하고 있습니다.
모바일 스크롤 규칙
모바일 세로 화면에서는 한 번에 모든 정보를 다 보여주기보다 위에서 아래로 읽히는 단일 세로 흐름으로 설계하는 것이 사용자에게 더 직관적입니다. 다음 규칙을 지키면 실제 사용성이 크게 개선됩니다.
- 첫 화면에 핵심 KPI만 먼저 배치합니다. 예를 들어 전체 매출, 성장률, 목표 달성률처럼 한 번에 보고 판단해야 하는 값이 가장 위에 나오게 합니다.
- 가로 스크롤을 최소화합니다. 모바일 앱은 세로 스크롤에 최적화되어 있고, 가로 전환 시에는 일반 데스크톱 뷰를 보는 구조라, 세로만 남는 설계가 안정적입니다.
- 표, Matrix, 긴 범주형 차트 내부 스크롤은 피하는 편이 좋습니다. 작은 화면에서 페이지 전체가 스크롤되고, 내부 비주얼이 또 스크롤되면 터치 포인트를 잡기 어렵습니다.
- 페이지 길이는 길어질 수 있어도 섹션 단위는 명확하게 나누는 것이 좋습니다. 예를 들어 위에 KPI, 중간에 추이 차트, 아래에 상세 분석 표 같은 구조로 나누면 사용자가 어디를 보고 있는지 금방 파악합니다.
- 비주얼 간 여백을 넉넉히 가져가는 것이 좋습니다. 장식 배경이나 테두리보다, 터치 가능한 영역의 여유가 더 중요합니다.
예를 들어 데스크톱에서 12개 비주얼이 있는 영업 리포트가 있다면, 모바일에서는 상단 3~4개의 KPI 카드, 중간 1~2개의 핵심 차트, 하단에 1개의 상세 테이블만 두는 식으로 단순화하는 것이 좋습니다.
모바일 폰트 규칙
모바일 리포트에서는 폰트가 예쁘게 보이는 것보다 한 번에 읽히는지가 더 중요합니다. Power BI에서 폰트 선택과 크기 조정은 사용자 입장에서 가독성과 접근성에 직접적으로 영향을 줍니다.
- 본문성 텍스트와 라벨은 18pt 전후를 기준으로 설계하는 것이 좋습니다. 작은 화면에서 12~14pt 글자를 그대로 유지하면, 축 라벨, 범례, 카드 제목이 모두 뭉개져 보입니다.
- 좁은 공간에서 글자를 줄여야 한다면, 그냥 작은 글자로 두기보다 14pt bold처럼 굵게 해서 가독성을 높이는 방식이 더 안정적입니다.
- serif보다 sans serif를 우선하는 것이 좋습니다. sans serif는 가독성과 접근성 측면에서 더 읽기 쉽습니다.
- 불필요한 텍스트를 줄이는 것이 폰트를 줄이는 것보다 더 중요합니다. 모바일에서는 정보량을 줄이면서도, 핵심 해석에 필요한 값만 남기는 방식이 결과적으로 더 좋습니다.
- 축 라벨, 범례, 데이터 레이블을 동시에 보이게 하면 너무 빽빽해집니다. 이 중 하나는 숨기거나 Drill‑down, 드릴스루로 분리해서, 화면에 한 번에 노출되는 텍스트를 줄이는 것이 좋습니다.
실무적으로는 제목 18–22pt, KPI 숫자 24pt 이상, 일반 카드 라벨 14–18pt, 세부 보조 문구는 12pt 미만으로 내려가지 않게 관리하는 것이 모바일에서 안정적인 범위입니다. 12pt 이하 글자는 모바일에서 읽기가 어려워지기 때문에, 텍스트 양이 많을수록 크기 축소보다는 정보량 축소가 우선입니다.
모바일용 반응형 재배치 방법
Power BI 모바일 레이아웃은 웹에서처럼 자동으로 유동 배치되는 구조가 아니라, 모바일 전용 뷰를 별도로 재배치하는 방식에 가깝습니다. 설계할 때는 다음 순서를 따르면 됩니다.
- 데스크톱 페이지에서 모바일에 꼭 필요한 비주얼만 골라냅니다.
- 상단에 KPI 카드, 중단에 1~2개 핵심 차트, 하단에 보조 분석 순서로 세로 배치합니다.
- 필터(slicer)는 상단에 최소한으로 두고, 자동으로 펴지거나 접기 기능이 있는 형태로 설계합니다.
- Power BI의 Auto‑create 기능을 사용해도, 그대로 배포하지 말고 여백, 높이, 폰트 크기, 배치 우선순위를 다시 조정합니다.
실무에서 지키기 좋은 모바일 설계 체크리스트
- 세로 화면 기준으로, 위에서 아래로만 읽히는 단일 흐름을 유지합니다.
- 가로 스크롤이 없도록, 가로 방향 비주얼은 최소화합니다.
- 표, Matrix, 긴 분류형 차트의 내부 스크롤은 최대한 없애거나, 모바일에서 카드 형태로 전환합니다.
- sans serif 계열 폰트를 기본 폰트로 사용합니다.
- 제목과 KPI 숫자는 18–24pt 이상, 일반 라벨은 14–18pt 범위를 기본으로 잡습니다.
- 모바일 Phone Layout 뷰는 Power BI Desktop에서 모든 페이지에 대해 개별로 설정해 둡니다.
- 데스크톱 뷰를 먼저 설계하고, 그 다음 모바일 뷰를 별도로 재배치하는 방식으로 워크플로우를 고정합니다.
Power BI 모바일 레이아웃 설계 팁 정리
- 데스크톱 리포트는 그대로 두고, 모바일용 레이아웃은 전용 뷰로 재배치합니다.
- 세로 스크롤을 중심으로, KPI → 추이 → 상세 순서로 구간을 나눕니다.
- 불필요한 비주얼과 텍스트는 모바일 기준으로 먼저 제거합니다.
- 가로 스크롤와 내부 스크롤이 겹치는 구조는 피하고, 터치 여유를 넓게 가져갑니다.
- 폰트는 크기 축소보다 양 축소 + sans serif + 18pt 기준을 우선 적용합니다.
이 규칙을 기본으로 하면 Power BI 모바일 앱에서 데스크톱 리포트를 그대로 보는 것보다, 실제로 사용자 눈높이에 맞는 직접적인 리포트 사용 경험이 크게 달라집니다.
놓치면 아쉬운 추천 글, 함께 읽어보세요!
- 추천 글을 불러오는 중입니다...
