Report Builder AI

SaaS Product

UX/UI Design

UX Research

Role & Timeline

I led the end-to-end design from early discovery, user research to interaction design, prototyping, and collaboration with engineering. With the entire team, we worked together to define the behavioral logic to shape the framework for usage tracking and metrics.

Role

Product Designer

CEO
Product Manager
Fullstack Engineers (2)

Team

Duration

~3 Months

Refreshing Explo’s AI-powered Report Builder to modernize chart creation

As AI capabilities evolve, so does the way we interact with data. Explo is an embedded analytics platform that helps SaaS companies deliver dashboards and reports to their customers.

In early 2025, our team redesigned the Report Builder experience to support faster, more intuitive chart and report creation through natural language. This refresh introduced a conversational AI along with a new look to help users generate new views quicker, reduce UI friction, and iterate through feedback-driven chart refinement.

How we design a conversational AI experience for chart creation that feels intuitive while preserving consistency with our current design system?

AI-powered reporting— Generate real-time, contextual reports for your end users

By embedding Explo’s AI-powered Report Builder, companies can offer their customers a modernized, conversational reporting experience that feels native to their product. The embedded setup gives every SaaS platform its own unique look while maintaining Explo’s powerful AI capabilities.

Chart Suggestions at Your Fingertips

Get AI-powered recommendations for charts based on your data, then refine them with simple, natural language prompt.

Iterate with Your AI Assistant

Quickly adjust chart types, dimensions, and measures through conversational feedback without starting from scratch.

Visualize Data in Your Way

Create reports that adapt to multiple visualization types, helping users uncover insights from every angle.

Research, Scope, and Early Learnings

My design approach prioritized refreshing the product with a modern approach with familiarity. My goal was for users to create charts through conversational AI while ensuring the system felt intuitive and consistent with Explo’s design language.

Problem Scope

Before redesigning the Report Builder, I set out to understand how customers were already using AI and where friction existed in the workflow. Through user feedback from customer success and logs of early AI queries, we identified recurring pain points.

  • Too much scrolling to find AI responses,

  • Lack of persistence across views

  • Limited ways to refine charts once they were generated.

Screenshots of previous UI as a modal: rigid workflow, limited chart space, unnecessary scrolling

We also looked at how our end users were conversing with the current AI.

End User from XXX:

What sales have I lost money on?

What sales have I lost money on?

End User from XXX:

What items do we sell at less than 10% margin?

What items do we sell at less than 10% margin?

End User from XXX:

Show me all units that will be over 15 years old by 2028

Show me all units that will be over 15 years old by 2028

Companies have been blocked out due to privacy.

From our observations, users was separating or exploring how data could take shape. We also saw patterns in phrasing, repeated follow-ups, and high abandonment rates after certain queries.

These insights sparked a series of hypotheses around improving intent recognition, context retention, and response clarity—all of which would shape the foundation of our redesign.

Takeaways

The research revealed that users didn’t just want a chart builder- they wanted a collaborative partner. One that understood context, offered clear choices, and let them stay in control of their workflow. The experience needed to be less of a hand-off and more of a dialogue.

These insights shaped our design principles moving forward:

Prioritize clarity and flexibility over rigid automation

Let users stay in the flow of their dashboard work

Make the AI feel more like a helpful collaborator, not a black box

With this foundation, we moved into exploration—reimagining the product’s conversational flow, UI behavior, and visualization entry points.

Initial Wireframes

With the research insights in hand, I started exploring multiple ways to integrate conversational AI into the Report Builder. The goal was to help users generate charts faster, refine them through natural language, and maintain familiarity with the existing design system.

We sketched out several approaches, from inline AI prompts to dedicated panels and pop-up modals, testing how each could support the workflow without overwhelming the user.

#1 New Modal
One early prototype used a modal-based AI assistant that would pop up when a user wanted to create a chart. While visually distinct, this approach introduced friction: users had to leave their current view to interact with the AI, which interrupted their workflow and felt disconnected from the report itself.

#2 Chatbot Corner
Another approach considered embedding the AI directly inline with the chart canvas. This reduced the cognitive overhead of switching between modal and main view, but initially it crowded the interface and risked overwhelming users with too many options at once.

#3 New Tab
A third approach explored dedicating an entire new tab to the AI chart creation experience.

Recognizing from the previous approaches that AI-powered chart creation required substantial space for an optimal user experience, we designed a split-screen layout where users could watch their chart come to life on the left while engaging with the AI assistant through a chat interface on the right.


Through several rounds of iteration and internal testing, we agreed that the third wireframe shown above was the best solution. We moved forward with iterating different versions of this design while maintaining our design system. The following were different versions of how we could integrate the chat bot with our current design system.

Final Iterations and Prototype

With our design direction established, we moved into the final iteration phase, focusing on refining the user experience while ensuring seamless integration with Explo's existing design system.

This stage involved extensive prototyping to perfect the balance between AI assistance and user control, fine-tuning interaction patterns, and validating our assumptions through user testing. The iterations that followed centered on optimizing the chat interface, improving the real-time chart preview, and creating smooth transitions that would make the AI feel like a natural extension of the Explo platform rather than a separate tool.

Report AI Kickoff
We strategically relocated the Report AI button to the right panel, creating a clear visual association between this area and the AI-powered chart creation process. This placement helped users understand where to begin their AI journey while maintaining the logical flow of the existing interface.

New Tab
Upon clicking the Report AI button, a dedicated tab opened where users were presented with two pathways: they could either input their own natural language query directly or explore pre-generated suggestions based on their available data. This dual approach accommodated both users who knew exactly what they wanted and those who needed inspiration to get started.

Chatbot
The chat interface became the primary communication channel between users and the AI, designed to feel conversational yet purposeful. Users could refine their requests, ask follow-up questions, and provide additional context through natural language, making the chart creation process feel more like a collaborative dialogue than a rigid command structure.

Chart creation
As users interacted with the chatbot, charts began materializing in real-time on the left side of the screen. This immediate visual feedback allowed users to see their ideas take shape instantly, creating a satisfying connection between their words and the resulting visualizations.

Exploring charts
Once charts were generated, users could continue the conversation to modify, refine, or create variations of their visualizations. The AI remained available to help users explore different chart types, adjust styling, or dive deeper into their data through additional queries and iterations.

After working with engineering, the final result looks like the below where styling (fonts, color, sizing) can be edited to best be embedded into the client's current platform.

Reflection

The Report AI refresh served as Explo's foundational exploration into AI-powered features, establishing both the technical infrastructure and design patterns that would inform future AI integrations across the platform.

Aside from creating a functional chart generation tool, a main objective was to thoughtfully incorporate AI capabilities into our existing design library, ensuring that these new interactions felt native to the Explo experience rather than bolted-on additions. The design system components, interaction patterns, and user flows we developed during this project became the building blocks for subsequent AI features.

Working through the design constraints and iterations on this project was challenging but very rewarding as I got to work closely with product engineering to watch it come to life. As 0->1 project, each step of the project felt extremely vital, influencing future designs while taking account of previous ones. This experience reinforced the idea of balancing and inventing new ideas with practical constraints and I hope to take these learnings to the next.

Previous Project

Previous Project

Thanks for visiting!
Always open to chat via email / linkedin 👋🏼

(c) christina ip 2025

Thanks for visiting!
Always open to chat via email / linkedin 👋🏼

(c) christina ip 2025