Cách tốt hơn để tối ưu thiết kế di động trên Power BI

Ứng dụng Power BI Mobile phù hợp ở đâu trong kế hoạch xây dựng báo cáo của bạn? Chủ đề này không được thảo luận rộng rãi trong các cộng đồng Power BI. Nhiều blog và hướng dẫn tập trung chủ yếu vào việc phát triển báo cáo Power BI cho màn hình máy tính để bàn. Cụ thể hơn, một thiết kế báo cáo phù hợp với màn hình rộng. Tuy nhiên, việc xây dựng báo cáo cho ứng dụng dành cho thiết bị di động cần phải xem xét thêm.

1. Tình trạng hiện tại của thiết bị di động

Trước khi đến với các đề xuất về phát triển báo cáo trên thiết bị di động, chúng ta hãy thảo luận về tình trạng hiện tại của việc xây dựng báo cáo trên thiết bị di động. Để tạo chế độ xem tập trung vào điện thoại di động, máy tính để bàn Power BI, hãy làm theo các bước sau:

• Bước 1: Nhấn vào nút View trên thanh công cụ
• Bước 2: Nhấn vào nút có nhãn Mobile layout

• Portrait Mode Only

Thao tác này sẽ đưa bạn đến một màn hình mới, nơi thiết bị di động được đặt ở chế độ dọc. Tại thời điểm viết bài này, không có tùy chọn nào để xây dựng chế độ xem di động theo chiều ngang. Nếu bạn muốn có một báo cáo trên điện thoại di động có thể được xem ở chế độ ngang, bạn thực sự phải tạo chế độ xem báo cáo bình thường nhưng với màn hình hẹp hơn.

• Trải nghiệm xây dựng đơn giản hóa

Khung báo cáo được đơn giản hóa rất nhiều. Có nghĩa là bạn không nhận được tất cả các tính năng nâng cao của một trang báo cáo bình thường. Việc xếp chồng các hình ảnh lên nhau không phải là một lựa chọn. Thay đổi màu nền không phải là một tùy chọn trên màn hình này.

Thay vào đó, để thay đổi màu nền của trang trên thiết bị di động, bạn phải rời khỏi chế độ xem trên thiết bị di động. Quay lại chế độ máy tính để bàn thay đổi màu sắc và sau đó quay lại chế độ xem trên điện thoại di động.

2. Cách tiếp cận thay thế

Do những hạn chế nêu trên, bạn nên tạo một trang báo cáo với các dimension tùy chỉnh. Chiều rộng của một trang từ 600 đến 800 pixel đáp ứng hầu hết nhu cầu. Độ dài trang có thể dài đến mức bạn cần để tất cả các hình ảnh cần thiết có thể vừa với trang. Các trang trước đây đã tăng độ dài lên đến 1000 đến 2000 pixel.

2.1. Làm thế nào để tùy chỉnh kích thước trang?

Làm theo các hướng dẫn sau để thay đổi kích thước trang

• Bước 1: Nhấn vào một vị trí bất kỳ trên trang Report để bỏ chọn tất cả trực quan
• Bước 2: Mở Visualizations Pane
• Bước 3: Nhấn vào nút Format, có hình cây lăn sơn như ảnh dưới
• Bước 4: Mở phần được đặt tên là Page Size như ảnh dưới
• Bước 5: Thay đổi phần menu thả xuống ở mục Type thành Custom
• Bước 6: Nhập vào chiều rộng (Width) và chiều dài (Height) mới cho trang

2.2. Thay đổi chế độ xem báo cáo để cuộn

Bằng cách làm cho trang hẹp hơn nhưng dài hơn, chế độ xem mặc định của báo cáo sẽ gây ra các thách thức về trải nghiệm người dùng. Để khắc phục điều này, báo cáo sẽ cần hiển thị dưới dạng một đối tượng có thể cuộn được. Để làm điều này, chúng ta sẽ điều chỉnh cài đặt chế độ xem của trang

• Bước 1: Nhấn vào nút View trên thanh công cụ
• Bước 2: Nhấn vào nút Page View
• Bước 3: Một menu thả xuống sẽ xuất hiện
• Bước 4: Từ menu thả xuống nhấn vào tùy chọn Fit to width

2.3. Cân nhắc về UI/UX khác

Là một nhà thiết kế báo cáo, điều quan trọng là phải xem xét giao diện người dùng. Trong hầu hết các báo cáo, mọi thứ được thiết kế phải đảm bảo người dùng có thể thấy phù hợp trên một trang, cuộn trên một trang không phải là một vấn đề lớn. Khi tính năng cuộn trên thiết bị di động được giới thiệu đã có một số sự cố về hình ảnh.

Hình ảnh bảng (Table Visual) là nguyên nhân Sự cố: Ví dụ một hình ảnh bảng, tự nó đã tích hợp sẵn tính năng cuộn. Vì vậy, nếu bạn đang cuộn một trang trên thiết bị di động khi bạn chạm vào bên trong bảng và vuốt lên, trải nghiệm di động sẽ vuốt hình ảnh bảng. UX này có thể khiến người dùng bị hút vào bên trong bảng khi cố gắng cuộn trang.

Giải pháp cuộn bảng (Table Scrolling): Một giải pháp để giải quyết vấn đề người dùng bị mắc kẹt bên trong bảng là cung cấp một bảng điều khiển pixel. Người nội trú có thể là người ở trọ kép ở bên trái và bên phải hoặc chỉ là người ở trọ bên trái hoặc bên phải. Bên trong nội trú này không đặt bất kỳ hình ảnh nào yêu cầu cuộn, chẳng hạn như bảng.

Thêm một Scrim để thêm rõ ràng: Ngoài việc chỉ giữ lại khoảng cách pixel ở các cạnh, bạn cũng nên thêm một số màu vào nền. Khái niệm về màu sắc trong các khối hoặc thông qua một màu chuyển sắc. Bạn có thể xem script mẫu tại đây để tham khảo.

Hy vọng qua bài viết này các bạn đã có thêm những thông tin hữu ích về Power BI. Đừng quên đón đọc các nội dung thú vị sẽ được cập nhật thường xuyên tại BAC’s Blog.

Nguồn tham khảo:
https://powerbi.tips/

Nhu cầu đào tạo doanh nghiệp

BAC là đơn vị đào tạo BA đầu tiên tại Việt Nam. Đối tác chính thức của IIBA quốc tế. Ngoài các khóa học public, BAC còn có các khóa học in house dành riêng cho từng doanh nghiệp. Chương trình được thiết kế riêng theo yêu cầu của doanh nghiệp, giúp doanh nghiệp giải quyết những khó khăn và tư vấn phát triển.