Navigating Data Visualisation: Understanding Common Challenges

Ray Wu
3 min readJul 22, 2022

--

In the world of data, projects often encounter difficulties due to unclear user requirements and expectations. Even when successfully delivered, these projects may not stand the test of time. It’s clear that many dashboards don’t meet essential design standards, such as WCAG 2.1 (Web Content Accessibility Guidelines), and could benefit from the expertise of UX designers to improve user engagement and convey information effectively.

Common issue arises where BI developers, data analysts, and scientists tend to make visualisations overly complex with unnecessary algorithms.

Through discussions with clients, it’s become evident that there’s a perception that data visualisations from sensors lack lasting value. Users often forget the insights quickly, making projects fail despite meeting initial requirements.

Most dashboard designs have align closely with David McCandless’s design principles:

- Functionality: They make it easy to discern trends and patterns.
- Aesthetic Appeal: They are visually pleasing and well-structured to captivate readers.
- Integrity: They accurately and honestly present the data.
- Interest: They are relevant, meaningful, or reveal new insights.

Additionally, Figma offers a range of UI kits that developers can utilise to quickly mock up dashboards without requiring backend data.

In the real world, BI developers excel at data engineering and integrating data into the frontend. However, there’s often a lack of focus on user experience (UX), such as user journey mapping, usability testing, and adhering to design guidelines.

This current approach can be time-consuming and costly, particularly when clients request changes or iterations during development and deployment.

To address these challenges, normally a integration of design processes and UI tools would needed. This would enable a deeper understanding and fulfilment of UX research, UX design, and service design requirements, particularly in the realm of data and large-scale projects.

Design Process for Business Intelligence (BI) — adaptable based on project needs

I would allocate 70% of the time to ideation, user testing, and prototyping, reserving 30% for development and deployment. This allows for the seamless integration of development once a design blueprint is established in Figma.

Within Figma, various tasks can be accomplished, including collaboration, gathering feedback, basic interaction design, usability testing, applying design guidelines, and ensuring accessibility.

Workshops

Incorporating design workshops into data projects, as they facilitate learning and understanding of different roles within a company and their contributions to the final product.

Figma Testing

Collecting data metrics during the design process is invaluable and cannot be effectively done within BI tools. Hence, it’s essential to have this capability within the prototype process.

Integrating Figma into Power BI

Similar to how UX/UI/Graphics Designers share mockups with developers, Figma files can be extracted into image files or CSS/HTML code for website/app development. For the Power Platform, this process can be automated through the Figma API, eliminating the need for developers.

Tips

- Ensure Figma frame sizes match Tableau/PowerBI frame sizes (e.g., 16:9 /1920 x 1080).
- Keep colour codes/font names accessible in the Figma workspace for easy transfer to BI tools.

Final Thoughts

Integrating UI tools into the workflow of BI developers has no drawbacks and can significantly enhance product effectiveness. Increased involvement of designers in data projects is crucial, as even the best products can fail if user experience is neglected.

Pros:

- No need to install software; Figma works directly in the browser.
- Figma organisation offers additional benefits.
- Easy sharing with clients for feedback.
- Collaboration with other data visualization designers.
- Significant resource, cost, and time savings, particularly when requirements change.
- Templates can be reused.
- Microsoft is expanding Figma API coverage within the Power Platform.
- Enhances overall design quality.

--

--

Ray Wu

Passionate data viz enthusiast. Sharing my insights, one pixel at a time. Enjoy the journey! | https://ray-wu.com