8 mẹo giúp bạn tự tin thiết kế Dashboards

Dashboard có thể được hiểu là một bảng điều khiển kỹ thuật số (digital control), hay một giao diện số được dùng để thu thập và tổng hợp dữ liệu của tổ chức hay doanh nghiệp lớn nhỏ. Chính vì Dashboard chứa rất nhiều thông tin nên khi thiết kế sẽ phải lưu ý những gì để giúp người dùng không bị “ngợp" đây?

Các UI/UX designers hãy thử tham khảo một số tips dưới đây để giúp bạn tối ưu bản thiết kế dashboard của mình nha!

1. Sử dụng Grids (Lưới)

Lưới giúp bạn sắp xếp và phân cấp nội dung. Bạn có thể bắt đầu với một wireframe đơn giản và xếp nội dung của bạn xung quanh dựa trên mức độ quan trọng của nó.

‍

2. Content hierarchy (Phân cấp nội dung)

Sắp xếp và ưu tiên nội dung của dashboard theo quy luật F-pattern hoặc Z-pattern để hướng người dùng đến kết quả họ mong muốn.

‍

3. Consistency (Đồng nhất)

Tránh để quá nhiều thông tin trên trang dashboard của bạn. Thay vào đó, mỗi thẻ chỉ nên chứa thông tin quan trọng nhất dưới dạng tóm tắt, và có CTA để xem thêm chi tiết khi click vào từng thẻ.

‍

4. Sử dụng Shadows (Đổ bóng)

Đổ bóng nhẹ để biểu thị thẻ chứa thông tin.

‍

5. Phân chia nội dung của bạn

Mỗi thẻ chỉ nên chứa một chủ đề. Tuy nhiên, bạn có thể tách các dữ liệu liên quan trong một thẻ thành các blocks nhỏ hơn để giúp người dùng không bị quá tải hay hỗn loạn thông tin.

‍

6. Click area (Vùng nhấp)

Nếu hành động duy nhất trên một thẻ là click vào thẻ đó và xem thêm chi tiết, bạn hãy biến cả thẻ đó có thể click được. Đừng bắt người dùng phải mất thêm chút công sức để click vào hyperlinks hay buttons trong thẻ.

‍

7. Navigation (Điều hướng)

Khi hiển thị một biểu đồ dữ liệu, bạn hãy cung cấp các điều hướng để giúp người dùng dễ dàng chuyển đổi giữa các chế độ xem và thời gian khác nhau.

‍

8. Labels (Nhãn)

Bạn cần có các điểm neo (visual anchors) để giúp scan trang dashboard một cách nhanh chóng và hiệu quả. Ngoài ra, hãy thêm nhãn hoặc tiêu đề cho mỗi thẻ, lưu ý sử dụng các quy ước đặt tên thích hợp nhé.

‍

‍

Tổng hợp bởi đội ngũ Capi Demy. 

Nếu bạn có câu hỏi nào đừng ngần ngại kết nối với đội ngũ Capi Demy nhé, chúng mình luôn ở đây và làm điểm tựa vững chắc cho các bạn!

Thông tin liên hệ tư vấn: 

Fanpage: Capi Demy

Email: capidemy@gmail.com

Website:

Capidemy.com

Địa chỉ:

Cơ sở 1 HN: Tầng 6, số 35 Tô Vĩnh Diện, Khương Trung, Thanh Xuân, Hà Nội

Cơ sở 2 HN: Tầng 2 số 2 ngách 28, ngõ 93, Hoàng Văn Thái, Thanh Xuân, Hà Nội.

‍