Let’s connect
Let’s connect
Let’s connect
Let’s connect
Let’s connect
Let’s connect
Designing an AI-driven MVP Simulation Feature ✨
Designing an AI-driven MVP Simulation Feature ✨
What?
Increasing B2B sales and reducing churn for Nexoya.
What?
Increasing B2B sales and reducing churn for Nexoya.
How?
By helping define the user journey, UI, and copy for an AI-driven budget simulation feature (MVP).
How?
By helping define the user journey, UI, and copy for an AI-driven budget simulation feature (MVP).
AI
UX/UI Design
B2B
Webapp
Feature
Overview
Overview
🤔 What is Nexoya?
🤔 What is Nexoya?
👉 Nexoya is a Zürich-based cross-channel ad optimisation integration tool.
Show more
👉 Nexoya is a SaaS cross-channel marketing tool.
👉 Nexoya is a Zürich-based cross-channel ad optimisation integration tool.
Show more
👉 Nexoya is a Zürich-based cross-channel ad optimisation integration tool.
Show more
🤔 What stakeholders did I work with?
🤔 What stakeholders did I work with?
👉 I worked closely together with the CEO, Head of Product, CTO and developers.
👉 I worked closely together with the CEO, Head of Product, CTO and developers.
Tools used
Tools used
Figma
Notion
Mission Statement/Challenge
Mission Statement/Challenge
Mission statement
Mission statement
"We need to empower users with a scenario simulation feature that allows them to confidently understand and predict the impact of different ad budget allocations on performance metrics, enabling them to make informed, risk-free decisions for optimized results."
"We need to empower users with a scenario simulation feature that allows them to confidently understand and predict the impact of different ad budget allocations on performance metrics, enabling them to make informed, risk-free decisions for optimized results."
Affected Languages
Affected Languages
🇺🇸 English (American English)
Approach/Process
Approach/Process
Approach
Approach
The AI-driven scenario simulations feature is an MVP. Therefore, the design process was focussed on the best practices for "creating something new", while laying the groundworks for future adaptations to be easily added in.
The detailed design process to act as a base was as follows:
The AI-driven scenario simulations feature is an MVP. Therefore, the design process was focussed on the best practices for "creating something new", while laying the groundworks for future adaptations to be easily added in.
The detailed design process to act as a base was as follows:
Empaphise
Understand the user.
What are the goals, needs, wants and frustrations?
Define
Define the problem.
What needs to be solved?
Research
Generative user research. Interviews and other contact: What do we need to do?
Ideate
1. Lay out user flows: Create the base.
2. Create first designs to
visualise said flows.
Refine
Analyse designs from the ideate phase and improve. Create final versions for prototyping / testing.
Prototype
and test
Create a solid prototype to test with real users.
Does this solution add value for the user?
Refine
as needed
Incorporate user feedback into the design solution
Deliver
Final check: Rollout and hand-over design solution to the development team.
Empaphise
Understand the user.
What are the goals, needs, wants and frustrations?
Define
Define the problem.
What needs to be solved?
Research
Generative user research. Interviews and other contact: What do we need to do?
Ideate
1. Lay out user flows: Create the base.
2. Create first designs to
visualise said flows.
Refine
Analyse designs from the ideate phase and improve. Create final versions for prototyping / testing.
Prototype
and test
Create a solid prototype to test with real users.
Does this solution add value for the user?
Refine
as needed
Incorporate user feedback into the design solution
Deliver
Final check: Rollout and hand-over design solution to the development team.
Ideate phase 1
Ideate phase 1
Lay out user flows: Create the base.
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.
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.
Core Happy Flow
Core Happy Flow
Ideate phase 2
Ideate phase 2
Create first designs to visualise said flows.
Create first designs to visualise said flows.
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.
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 (draft) iteration
☑️ First (draft) iteration
(Scroll right below to see the screens in order)
❌ Designs that didn't make the first cut
❌ Designs that didn't make the first cut
In-page "Create a ____" design
Review selection inside "Wizard" drawer.
❌ Designs that didn't make the first cut
In-page "Create a ____" design
Review selection inside "Wizard" drawer.
In-page "Create a ____" design
Review selection inside "Wizard" drawer.
Refine
Refine
Analyse designs from the ideate phase. Iterate together with the team, and improve.
Analyse designs from the ideate phase. Iterate together with the team, and improve.
Simulation homepage / create simulation wizard
I: Simulation homepage / create simulation wizard
✅ Removal of different simulation types: Keep >budgets< version for the MVP for simplicity. Before and afters below:
✅ Removal of different simulation types: Keep >budgets< version for the MVP for simplicity. Before and afters below:
✅ Improve learnability: Explain simulation timeframe limitations, base scenario and budget steps.
✅ Improve learnability: Explain simulation timeframe limitations, base scenario and budget steps.
Scenario exploration view
II: Scenario exploration view
✅ Addition of slider, despite earlier removal.
✅ Positioning of the master table to the left of the chart to show hierarchy.
✅ Repositioning of comparison button to place greater emphasis on "apply scenario" button.
(Befores and afters for all three points shown below in the Gif 👇)
✅ Addition of slider, despite earlier removal.
✅ Positioning of the master table to the left of the chart to show hierarchy.
✅ Repositioning of comparison button to place greater emphasis on "apply scenario" button.
(Befores and afters for all three points shown below in the Gif 👇)
Prototype and test
Prototype and test
Create a solid prototype to test with real users. Does our solution add value?
Create a solid prototype to test with real users. Does our solution add value?
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 testers?
Testers fall into two main groups:
1. Our internal CSMs who have daily direct contact with our clients
2. The clients themselves.
And how was the solution received?
The tester consensus was positive overall towards the AI-driven simulations feature. Testers remarked how easy the data was to interpret, including the compare scenario feature. Notably, the testers were impressed by the slider widget at the top of the content area, which catered for easy scenario switching and data interpretation.
Ultimately, this shows how strong generative user research is a strong base for a design that speaks directly to specific user needs, minimising negative feedback in future usability testing. Needless to say, users will always point out things which us designers can overlook.
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 testers?
Testers fall into two main groups:
1. Our internal CSMs who have daily direct contact with our clients
2. The clients themselves.
And how was the solution received?
The tester consensus was positive overall towards the AI-driven simulations feature. Testers remarked how easy the data was to interpret, including the compare scenario feature. Notably, the testers were impressed by the slider widget at the top of the content area, which catered for easy scenario switching and data interpretation.
Ultimately, this shows how strong generative user research is a strong base for a design that speaks directly to specific user needs, minimising negative feedback in future usability testing. Needless to say, users will always point out things which us designers can overlook.
Refine as needed
Refine as needed
Incorporate user feedback into the design solution
Incorporate user feedback into the design solution
While the design solution was received well, there were a couple of areas where users were still asking questions.
While the design solution was received well, there were a couple of areas where users were still asking questions.
🤨 How accurate are the AI-generated results in the simulation?
🤨 How accurate are the AI-generated results in the simulation?
As with any AI-solution in SaaS, some users questioned the AI-generated result projections themselves, and how transparent this data is.
As with any AI-solution in SaaS, some users questioned the AI-generated result projections themselves, and how transparent this data is.
Solution
Solution
✅ Addition of a "reliability score". Placements: Master table and chart.
✅ Addition of "[metric] prediction range"
✅ Addition of a "reliability score":
Placements: Master table and chart.
✅ Addition of "[metric] prediction range"
Deliver
Deliver
Final check: Rollout and handover design solution to the development team.
Final check: Rollout and handover design solution to the development team.
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.
Results
Results
Results
Outcome
Outcome
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"
"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 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.
Project takeaways
Project takeaways
My personal takeaway: The value of well thought-out user journeys is crucial in allowing design teams to create a concrete product to drive engagement.
A strong user journey is the foundation on which design iteration processes can rest. Moreover, investing time and resources in good generative user research can actually make future evaluative user research more simple, saving time in the long-run.
My personal takeaway: The value of well thought-out user journeys is crucial in allowing design teams to create a concrete product to drive engagement.
A strong user journey is the foundation on which design iteration processes can rest. Moreover, investing time and resources in good generative user research can actually make future evaluative user research more simple, saving time in the long-run.
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