Let’s connect
Let’s connect
Let’s connect
Let’s connect
Let’s connect
Let’s connect
Designing AI-Simulations:
Creating a SaaS USP and Driving Sales
What?
Increasing B2B sales and reducing churn for Nexoya.
How?
By helping define the user journey, UI, and copy for an ad budget simulation MVP feature to safely forecast business impact.
AI
UX/UI Design
B2B
Webapp
Feature
MVP
Analytics
Designing AI-Simulations:
Creating a SaaS USP and Driving Sales
What?
Increasing B2B sales and reducing churn for Nexoya.
How?
By helping define the user journey, UI, and copy for an ad budget simulation MVP feature to safely forecast business impact.
AI
UX/UI Design
B2B
Webapp
Feature
MVP
Analytics
Designing AI-Simulations:
Creating a SaaS USP and Driving Sales
What?
Increasing B2B sales and reducing churn for Nexoya.
How?
By helping define the user journey, UI, and copy for an ad budget simulation MVP feature to safely forecast business impact.
AI
UX/UI Design
B2B
Webapp
Feature
MVP
Analytics
PROJECT OVERVIEW
PROJECT OVERVIEW
Main Challenge
Creating a budget forecasting MVP feature: Nexoya needed to allow users to simulate the impact of different ad budget allocations on their target metrics in a risk-free way.
Creating a budget forecasting MVP feature: Nexoya needed to allow users to simulate the impact of different ad budget allocations on their target metrics in a risk-free way.
What's Nexoya?
Solution
I translating a CEO-driven vision into a usable product: While the empathise, definition stage was shaped by the CEO's deep expertise in performance marketing users, I was responsible for turning into a functional user experience ready for delivery.
I translating a CEO-driven vision into a usable product: While the empathise, definition stage was shaped by the CEO's deep expertise in performance marketing users, I was responsible for turning into a functional user experience ready for delivery.
See AI-Simulations design in action!
Impact
MVP feature creation: Budget simulations
SaaS USP: User ability to forecast budget changes
Overwhelmingly positive client feedback:
CLIENT
MY ROLE
Lead UX/UI Designer | UX Writer
PROJECT TIMEFRAME
ca. 1 Month
TEAM
CEO, CTO, Head of Product,
Developers (2)
TOOLS USED (2)
Figma, Notion
AFFECTED LANGUAGES (1)
🇺🇸 English (American English)
Client feedback
"Simulating scenarios allows us to make data-driven decisions and frees up time for other strategic objectives".
"Simulations are a gamechanger for performance marketing".
"Visualising data in such an easy to understand way makes it easier to answer critical business questions"
"Simulating scenarios allows us to make data-driven decisions and frees up time for other strategic objectives".
"Simulations are a gamechanger for performance marketing".
"Visualising data in such an easy to understand way makes it easier to answer critical business questions"
Client feedback
"Simulating scenarios allows us to make data-driven decisions and frees up time for other strategic objectives".
"Simulations are a gamechanger for performance marketing".
"Visualising data in such an easy to understand way makes it easier to answer critical business questions"
APPROACH/PROCESS
APPROACH/PROCESS
Context:
Turning this vision into a usable, scalable product required translating expert knowledge into an intuitive design. This is a common approach in fast-moving scale-ups, where leadership insight often drives innovation. In the context of design thinking, this meant that the empathise, define and research stages were largely defined by C-level industry-expertise and insights.
Design thinking: And why?
I use it because it balances empathy, creativity, and iteration, while allowing for speed and user validation. It's especially effective for building MVPs in fast-paced, collaborative scale-up environments.
Context:
Turning this vision into a usable, scalable product required translating expert knowledge into an intuitive design. This is a common approach in fast-moving scale-ups, where leadership insight often drives innovation. In the context of design thinking, this meant that the empathise, define and research stages were largely defined by C-level industry-expertise and insights.
Design thinking: And why?
I use it because it balances empathy, creativity, and iteration, while allowing for speed and user validation. It's especially effective for building MVPs in fast-paced, collaborative scale-up environments.
Empathise
Understand the user.
What are the goals, needs, wants and frustrations?
Define
Define the problem. What needs to be solved, and how do we do it?
Research
Generative user research: Interviews and other contact: What do we need to do?
1.Ideate
Lay out user flows: Create the base.
Create first designs to visualise said flows.
2.Refine
Refine the designs from the ideate phase and cut out the noise.
3.Prototype
and Test
Create a solid prototype to test with real users.
Does this solution add value for the user?
4.Refine as
needed
Incorporate user feedback into the design solution.
5.Deliver
Final check: Rollout and hand-over design solution to the development team.
Empaphise
Empathise
Empathise
Understand the user.
What are the goals, needs, wants and frustrations?
1.Define
Define the problem.
What needs to be solved, and how do we do it?
2.Ideate
Conceptualise designs: Bring ideas to life.
Discuss with team: Review and improve.
3.Refine
Cut out the noise: Iterate and focus on the smaller details.
4.Prototype
and test
Create a solid prototype to test with our CSMs.
Does this solution add value?
5.Refine
as needed
Incorporate user feedback into the design solution
6.Deliver
Final check: Rollout and hand-over design solution to the development team.
Ideate
Get ball rolling: Translate definition phase into something deliverable.
I) LAY OUT USER FLOWS: CREATE THE BASE
I) LAY OUT USER FLOWS: CREATE THE BASE
The foundation of every MVP comes from a user journey that acts as a base. The "Happy flow", which shows the core structure of the simulation flow, is shown below.
Happy Flow
How did we decide on this core happy flow?
How did we decide on this core happy flow?
From the previous research phase of this project, we were able to identify the following as core stages and corresponding user needs.
From the previous research phase of this project, we were able to identify the following as core stages and corresponding user needs.
Setup
User need:
Ability to set up different simulations quickly.
Solution:
Feature set up with a familiar Nexoya feel.
Most suitable approach: Integration of prominent "Simulation" category into 2nd level architecture.
Exploration
User need:
Easily review the impact of diff. budgets on metrics.
Solution:
Intuitive simulation exploration mode. Emphasis on transparency and clarity, and scenario comparison.
Most suitable elements: Charts and tables.
Application
User need:
"I want to apply this budget forecast to my portfolio."
Solution:
Option for the user to apply a budget from a simulation scenario to their portfolio to achieve their target metric.
Most suitable element: Primary button.
Setup
User need:
Ability to set up different simulations quickly.
Solution:
Feature set up with a familiar Nexoya feel.
Most suitable approach: Integration of prominent "Simulation" category into 2nd level architecture.
Exploration
User need:
Easily review the impact of diff. budgets on metrics.
Solution:
Intuitive simulation exploration mode. Emphasis on transparency and clarity, and scenario comparison.
Most suitable elements: Charts and tables.
Application
User need:
"I want to apply this budget forecast to my portfolio."
Solution:
Option for the user to apply a budget from a simulation scenario to their portfolio to achieve their target metric.
Most suitable element: Primary button.
II) CREATE FIRST DESIGNS TO VISUALISE THE USER FLOW
II) CREATE FIRST DESIGNS TO VISUALISE THE USER FLOW
As our user flow has been laid out above, we now had a physical structure on which we could start visualising the simulation feature. Naturally, this stage would come with some experimentation and A/B testing to assess the viability of certain design directions and UX best practices against each other.
First Mid-Fidelity iteration: Screens with concepts worth selecting.
See slideshow version: Screen by screen
See slideshow version
III) DESIGNS USED IN FAVOUR OF OTHERS
III) DESIGNS USED IN FAVOUR OF OTHERS
Throughout the ideation process, several design ideas were discussed and visualised. This naturally meant that some design ideas didn't make the cut. In these, some examples are:
A: Not included in design: In-page Create a [type] Simulation design
B: Used: Single simulation type: Budgets
Why go for B?
Replacing an in-page selection with a simulation overview table gives users a clearer understanding of existing setups, promotes informed decision-making, and reduces cognitive load. It places the emphasis on context: Helping users orient themselves before committing to creation.
A: Not included in design: Start simulation pre-launch wizard element
B: Used: Start simulation pre-launch modal
Why go for B?
Using a modal for the pre-launch simulation highlights it as a critical, review-focused step. It separates it from the setup flow, preserves context, and prompts user attention. It ensuring users pause, assess, and confirm before proceeding, rather than treating it as just another form step.
Aren't multiple variations just a waste of time?
Aren't multiple variations just a waste of time?
Aren't multiple variations just a waste of time?
Aren't multiple variations just a waste of time?
Refine
Refine the designs from the ideate phase with the team. Continue to cut out the noise.
I) KEY THEMES
I) KEY THEMES
To continue the collaborative design approach, the key stakeholders and I refined the MVP simulations feature further to fine-tune the design before testing. Together, we focussed on the three user steps: Setup, simulation analysis, and application.
II) SIMULATION SETUP
II) SIMULATION SETUP
1.Simplicity
Issue:
Multiple simulation exploration types: Too much for an MVP.
Solution:
Replace 3 individual simulation exploration types (Budgets, CPA, ROAS) with just Budgets simulation.
Why this solution?
Why this solution?
Why this solution?
What did the design changes look like?
What did the design changes look like?
A: Previous design: 3 exploration types: Budget, ROAS, CPA
B: New design: 1 exploration type: Budgets only
A: Previous design: Simulation setup
B: New design: Simulation setup
Learnability
Issue:
Need to help guide the user: Provide additional information to explain concepts.
Solution:
1. Add question mark icon, tools and explainer for "Budget steps between scenarios".
Add tooltip in datepicker.
Why this solution?
Why this solution?
Why this solution?
What did the solutions look like?
Addition of tooltips and explainers
Addition of tooltips and explainers
Addition of tooltips and explainers
III) Exploration
III) Exploration
1.Discoverability through Hierarchy
Issues:
1) One of the key ideas of the exploration mode is to allow the user to switch between scenarios quickly and intuitively. However, users often missed chart-based scenario click function to switch scenarios. It was easy to get stuck.
2) The scenario data itself is the most important information for the user to be able to scan and digest. The chart view was too dominant on the page.
3) Users wanted to compare data between scenarios as a core function of the feature. This function felt subordinated as a secondary button compared to the primary "Apply scenario" button.
Solutions:
1) Switch scenarios quickly: Addition of prominent scenario slider.
2) Scenario data: Repositioning of the scenario table to the left.
3) Compare scenario data: Reformatting "Compare scenarios" as a primary button and moving it to the top.
What did the design changes look like?
What did the design changes look like?
Before refinement
After refinement
What did the design changes look like?
Before refinement
After refinement
Before refinement
After refinement
1.Simplicity
Issue:
Multiple simulation exploration types: Too much for an MVP.
Solution:
Replace 3 individual simulation exploration types (Budgets, CPA, ROAS) with just Budgets simulation.
Why this solution?
Why this solution?
What did the design changes look like?
A: Previous design: 3 exploration types: Budget, ROAS, CPA
B: New design: 1 exploration type: Budgets only
A: Previous design: Simulation setup
B: New design: Simulation setup
Learnability
Issue:
Need to help guide the user: Provide additional information to explain concepts.
Solution:
1. Add question mark icon, tools and explainer for "Budget steps between scenarios".
Add tooltip in datepicker.
Why this solution?
Why this solution?
What did the solutions look like?
Addition of tooltips and explainers
1.Discoverability through Hierarchy
Issues:
1) One of the key ideas of the exploration mode is to allow the user to switch between scenarios quickly and intuitively. However, users often missed chart-based scenario click function to switch scenarios. It was easy to get stuck.
2) The scenario data itself is the most important information for the user to be able to scan and digest. The chart view was too dominant on the page.
3) Users wanted to compare data between scenarios as a core function of the feature. This function felt subordinated as a secondary button compared to the primary "Apply scenario" button.
Solutions:
1) Switch scenarios quickly: Addition of prominent scenario slider.
2) Scenario data: Repositioning of the scenario table to the left.
3) Compare scenario data: Reformatting "Compare scenarios" as a primary button and moving it to the top.
What did the design changes look like?
Before refinement
After refinement
Prototype and Test
Create a solid prototype to test with real users.
I) TESTERS
I) TOUCHING BASE WITH KEY STAKEHOLDERS: WHERE ARE WE AT?
All Figma screens for this feature were carefully connected into a prototype, which could then be used to put our solution to the test.
Who were the users to test the prototype with?
Who were the users to test the prototype with?
The testers fell into two main groups:
1. Our internal CSMs who have daily direct contact with our clients
2. The clients themselves.
How was the prototype received?
How was the prototype received?
On the whole, we were glad to see our work was received well!
To summarise the findings:
✅ Positives
Data was easy to interpret.
Slider widget was easy to use.
🤨 "Huh?" Moments
How accurate are the simulated results? And can they be trusted?
✅ Positives
Data was easy to interpret.
Slider widget was easy to use.
🤨 "Huh?" Moments
How accurate are the simulated results? And can they be trusted?
Refine as needed
Incorporate user feedback into design solution.
I) INCORPORATING USER TESTING
I) INCORPORATING USER TESTING
Transparency: How accurate are the simulated results?
Issue:
Users questioned how accurate the simulated results are. They asked themselves: Where do these figures come from, and can they be trusted?
Solution:
1) Addition of Metric prediction range.
2) Addition of a reliability score. Placements: Metric tooltip, Chart tooltip, Table tooltip.
Why this solution?
Why this solution?
Why this solution?
What did the solutions look like?
What did the solutions look like?
Table
Table tooltip
Chart tooltip
Transparency: How accurate are the simulated results?
Issue:
Users questioned how accurate the simulated results are. They asked themselves: Where do these figures come from, and can they be trusted?
Solution:
1) Addition of Metric prediction range.
2) Addition of a reliability score. Placements: Metric tooltip, Chart tooltip, Table tooltip.
Why this solution?
Why this solution?
What did the solutions look like?
Table
Table tooltip
Chart tooltip
Deliver
Final check: Rollout and hand-over design solution to the development team.
I) FINAL CHECKS
I) FINAL CHECKS
Before handing over to dev, a final check was in order. This includes checking for final copy, consistencies and double-checking with wider members of the team before handoff.
Before handing over to dev, a final check was in order. This includes checking for final copy, consistencies and double-checking with wider members of the team before handoff.
II) DEVELOPED SOLUTION: IT'S LIVE!
II) DEVELOPED SOLUTION: IT'S LIVE!
RESULTS
RESULTS
Users were overwhelmingly impressed with the scenario simulations feature. Reviews include:
Users were overwhelmingly impressed with the scenario simulations feature. Reviews include:
"Simulating scenarios allows us to make data-driven decisions and frees up time for other strategic objectives".
"Simulations are a gamechanger for performance marketing".
"Visualising data in such an easy to understand way makes it easier to answer critical business questions"
Project impact
Project impact
The project was an MVP, acting as a base for future iterations and improvements, depending on changing business needs and future user feedback.
By investing time and strategic decision making to this project, we were able to increase sales, reduce churn and add real value to the daily tasks of performance marketers. It also highlights the value of creating a powerful UI: A frame to allow AI to do its work.
The project was based on a V2, acting to improve initial designs based on data and business direction.
As mentioned to the Nth degree throughout this case study, the theme of "trust" is invaluable in increasing retention metrics in SaaS. Trust brings transparency, and transparency brings user confidence in maintaining partnerships that positively impact both sides. Product design isn't always about creating something new, but improving what you already have in presenting it in a "manageable" way.
Project takeaways
Project takeaways
My personal takeaway: One thing that stuck with me is the value of a strong "Definition" phase of the design process together with key stakeholders.
By bringing in expertise from different areas of the company, including intricate customer knowledge and being aware of technical limitations, we could create something to ship relatively quickly. Therefore, foundations are key in saving time down the line.
My personal takeaway: One thing that stuck with me is the value of a strong "Definition" phase of the design process together with key stakeholders.
By bringing in expertise from different areas of the company, including intricate customer knowledge and being aware of technical limitations, we could create something to ship relatively quickly. Therefore, foundations are key in saving time down the line.
My personal takeaway: One thing that stuck with me is the value of a strong "Definition" phase of the design process together with key stakeholders.
By bringing in expertise from different areas of the company, including intricate customer knowledge and being aware of technical limitations, we could create something to ship relatively quickly. Therefore, foundations are key in saving time down the line.
My personal takeaway: One thing that stuck with me is the value of a strong "Definition" phase of the design process together with key stakeholders.
By bringing in expertise from different areas of the company, including intricate customer knowledge and being aware of technical limitations, we could create something to ship relatively quickly. Therefore, foundations are key in saving time down the line.
"Simulating scenarios allows us to make data-driven decisions and frees up time for other strategic objectives".
"Simulations are a gamechanger for performance marketing".
"Visualising data in such an easy to understand way makes it easier to answer critical business questions"
"Simulating scenarios allows us to make data-driven decisions and frees up time for other strategic objectives".
"Simulations are a gamechanger for performance marketing".
"Visualising data in such an easy to understand way makes it easier to answer critical business questions"
How can I help your business? Let’s chat!
2025, Benjamin Bruton
How can I help your business? Let’s chat!
2025, Benjamin Bruton
How can I help your business? Let’s chat!
2025, Benjamin Bruton
How can I help your business? Let’s chat!
2025, Benjamin Bruton