Case study

Unlocking data visualisation insights with charts for a B2B SaaS no-code platform

Gradient
Charts for B2B saas no code platform

I led the UX and product design for a project focused on enhancing data visualisation within a no-code B2B SaaS platform. This platform enables businesses to build CRMs, internal tools and businesses applications by integrating data from multiple sources. It provides a user-friendly interface to manage and visualise this data, automate tasks and offer granular access to insights.

The project’s goal was to empower users with flexible charting options that seamlessly integrate with their data, allowing them to visualise and analyse insights effectively while addressing the needs of key Enterprise leads.

Key results 1 week from launch

  • 75% adoption rate of the new charts feature

  • 4.8% increase in annual revenue by signing three new Enterprise customers

  • Enhanced user satisfaction and engagement

Methods

  • Competitive research

  • Feedback + Data analysis

  • Usability testing

  • Wireframing + UX principles

  • UI design

Collaboration & Timeline

I collaborated with a Product Manager and two Front-End Engineers. The main stakeholders were the CEO and CTO.

The project spanned ~2 months in 2023, with 3 weeks of design and 4 weeks of development.

This case study has been anonymised for confidentiality purposes. The name of the company and product has been omitted while maintaining the integrity of the project outcomes.

Metrics charts b2b saas

The status quo

Since 2020, customers had been asking for a charts feature to visualise data from Airtable, Google Sheets and the platform’s own database, as they wanted to build dashboards and display data snapshots in their apps. We launched a beta version in 2021 with a couple of basic options, but it was clunky and full of bugs – our support team had to step in constantly just to keep it running.

By early 2023, more than 300 customers had made it clear that charting was essential for showing key insights: many had resorted to embedding external tools, which were a pain to set up and not always accurate or synced.

Feedback reinforced the need for improvement, with financial analysis, performance monitoring, customer segmentation and operational efficiency emerging as key use cases.

Our goals

It became clear that unlocking the platform’s data visualisation potential would transform how customers displayed and analysed insights. We also had three Enterprise leads who would only consider signing with us if we had a robust charts feature.

We set ambitious goals to release a fully integrated, flexible charting feature by the end of Q2 2023, while sunsetting the beta version.

Our objectives were to:

  • 📊 Give customers a flexible way of adding data visualisation to their applications, wherever they wanted

  • ⚙️ Integrate data visualisation seamlessly with existing data in our users’ backend

  • 📈 Provide at least 3 types of charts, blending functionality and aesthetics

feedback about charts for the platform

Shaping the solution

Through competitor analysis, historical user feedback and UX surveys, I identified that users wanted charts with flexible interfaces for displaying key data. Their main needs were:

  • metrics charts

  • pie charts

  • bar charts

  • line charts

Working with the CEO, CTO, PM and Engineering Lead, we aligned on integrating these chart types as widgets in user layouts to address immediate needs while keeping development focused and efficient.

To balance user needs with technical constraints, we decided to initially exclude more complex chart types, such as line charts.

I defined clear principles to ensure the charts were visually cohesive, responsive and easy to integrate, providing a strong foundation for future expansion while managing scope.

The design & delivery

After defining core principles, I designed both the appearance and functionality of the charts within the layout interface. This included creating a flexible, intuitive way for users to add and customise charts. I focused on sleek, user-friendly designs that balanced typical and edge case scenarios, while incorporating familiar patterns and moments of delight.

Development began with an iterative approach: Engineers built and tested each chart type, while I collaborated closely to ensure quality and conducted lightweight usability testing. After four weeks, we launched the feature for Enterprise customers, receiving positive feedback.

⭐️ The beta version was sunset, and with help from our fantastic Customer Support team, users transitioned smoothly to the new charts.

The results

As of June 2023:

  • 75% of Enterprise customers adopted the charts feature within the first week

  • more than 240 charts were created in the first week

  • 3 chart on average were created per application

Thanks to the delivery of this feature, we were able to sign three new Enterprise contracts with the customers who were undecided and were considering our competitors because of the lack of data visualisation.

This led to a 4.8% annual revenue growth.

Shape of charts

Takeaways

What made this project successful?

  1. Collaboration and continuous feedback: close collaboration with Engineers ensured high design quality, while regular user feedback and testing helped us make improvements early on.

  2. Lean usability testing: by testing in a live environment, I gathered real-time insights, enabling quick design adjustments to improve the user experience.

  3. Phased rollout: the feature was initially released to Enterprise customers, allowing for a controlled rollout and the chance to address issues early. Positive response validated the approach.

  4. Smooth transition: I worked closely with Customer Support to ensure a seamless shift from the beta version to the new charts feature, guiding users through the transition effectively.

Check out the final designs 👇