Multi-page Calculators
Multi-page mode lets you divide a Calculator into separate pages rather than presenting everything on a single canvas.
This can be useful for larger Calculators where Inputs, assumptions and results are easier to understand as a guided journey.
For example:
Business Inputs → Assumptions → Results
or:
Current State → Future State → Business Case
What multi-page mode does
When multi-page mode is enabled, you can:
Add multiple pages
Rename pages
Reorder pages
Remove pages
Choose horizontal or vertical navigation
Assign elements to specific pages
Set visibility conditions for individual pages
Focus on individual pages while editing
This gives you more control over how users move through a Calculator.
When to use multiple pages
Consider multi-page mode when a single-page Calculator has become difficult to understand or navigate.
It can be particularly useful when the model naturally contains several stages.
For example:
Page 1 — Your Business
Current volumes Employee numbers Current costs
Page 2 — Improvement Assumptions
Automation rate Time reduction Adoption
Page 3 — Business Case
Annual Benefit Net Benefit ROI Payback
Each page has a clear purpose within the overall journey.
Enable multi-page mode
To enable multiple pages:
Select Multi-Page Options in the toolbar.
The Setting Pages dialog opens.
Turn on Enable Multi Pages for this Calculator.
Choose the navigation style if required.
Add the pages you need.
Configure each page.
Select Save.
The Calculator now uses the configured multi-page structure.
Add a page
Inside Setting Pages, select:
+ ADD
This creates a new page.
Add the number of pages required for the Calculator journey.
Avoid creating unnecessary pages simply because the feature is available.
Each page should represent a useful stage or grouping of information.
Name your pages
Give every page a clear Page Title.
Page names should describe the content from the user's perspective.
For example:
Your Business
Current Costs
Improvement Assumptions
Results
are generally more useful than:
Page 1
Page 2
Page 3
The page title becomes part of the navigation experience, so it should help users understand where they are going.
Set the Page Type
Each page has a Page Type.
The available types are:
inputs
outputs
Choose the type appropriate to the content you're placing on the page.
An Inputs page can be used for assumptions and user-adjustable values.
An Outputs page can be used for calculated results and business-case presentation.
Reorder pages
Pages can be reordered inside Setting Pages.
Drag the pages into the sequence you want users to follow.
Think about the Calculator as a journey rather than simply a collection of screens.
For example:
Understand the environment
↓
Set the assumptions
↓
Review the impact
↓
Understand the business case
A logical sequence makes the Calculator easier to use.
Choose the navigation direction
Multi-page Calculators support different navigation orientations.
Enable Vertical Navigation when you want pages presented vertically.
When this isn't enabled, the default is Horizontal Navigation.
Choose the orientation that best fits the structure and presentation of the Calculator.
Preview the result before publishing.
Assign elements to pages
Once multi-page mode has been configured, elements can be assigned to individual pages.
To assign an element:
Select the element on the canvas.
Find its page selector.
Choose the page where the element should appear.
The selector can show:
Unset
or the title of an available page.
Assign each relevant element to the appropriate page.
Unset page membership
An element can show:
Unset
when it hasn't been assigned to a page.
If an element appears in the wrong place or isn't behaving as expected, check its page assignment.
For a fully structured multi-page Calculator, review any Unset elements and decide where they belong.
Switch pages while editing
When multi-page mode is enabled, the toolbar provides:
Select page
Use this to control which page you're currently focusing on while editing.
You can select:
ALL
A specific named page
Choosing a particular page makes it easier to work on that part of the Calculator without the rest of the model competing for attention.
Use ALL view
Select ALL when you want to review the overall structure.
This is useful for checking:
Which elements belong to each page
Whether anything is still Unset
The overall Calculator structure
Relationships between pages
Use a specific page when arranging its content, then switch to ALL when reviewing the complete model.
Page visibility conditions
Individual pages can have a Visibility Condition.
This lets the Calculator determine whether a page should be shown based on a condition within the model.
For example, a particular results or assumptions page might only be relevant when another option has been selected.
Configure the Visibility Condition within the page settings.
For more information about conditions, see Conditional Visibility & Calculate on Hidden.
Page visibility creates dependencies
If an Input or other element is being used to control page visibility, that element becomes important to the Calculator structure.
ROI Studio can prevent you from deleting it while the page visibility condition still depends on it.
If deletion is blocked because an element is used for pagination visibility:
Open Multi-Page Options.
Open Setting Pages.
Find the page using the element in its Visibility Condition.
Change or clear that condition.
Save the page settings.
Retry the deletion.
This prevents page behaviour from being broken accidentally.
Reordering elements in multi-page mode
Page setup also affects how elements can be moved.
If you attempt to move an element before page configuration is complete, ROI Studio can display:
Cannot move! Before that, Setup the pagination
If this occurs:
Open Multi-Page Options.
Complete Setting Pages.
Save the configuration.
Assign the element to the appropriate page.
Try moving it again.
Use the Navigator with multiple pages
The Navigator can be particularly useful when working with a complex multi-page Calculator.
Use the page selector to focus on a specific page while arranging its contents, and use the Navigator to understand and change the component structure.
For more information, see Reordering & Layout with the Navigator.
Headers behave differently
Input and Output Headers are designed for the single-page canvas layout.
They aren't used in the same way when multi-page mode is enabled.
In a multi-page Calculator, the page structure itself provides much of the high-level organisation.
For more information, see Headers & Model Structure.
Dual Column and multi-page mode
Dual Column is hidden while multi-page mode is enabled.
This is expected behaviour rather than an error.
If you're looking for Dual Column and can't find it, check whether the Calculator currently has multi-page mode enabled.
For other layout options, see Columns, Accordions & Micro Tabs.
Removing pages
Before removing a page, review the elements associated with it.
Move, reassign or remove elements as appropriate before deleting pages they depend on.
This helps avoid leaving parts of the Calculator without the intended page structure.
Turning multi-page mode off
Multi-page mode can be turned on or off from Setting Pages.
Before disabling it on an existing Calculator, review the current structure and consider how content that has been organised across several pages should work within the resulting single-page experience.
Preview the Calculator after making the change.
Design each page around one job
A useful principle is:
One page = one clear purpose
For example:
Page 1 — Business Profile
Collect the basic operating information.
Page 2 — Assumptions
Let the user adjust the expected improvement.
Page 3 — Results
Present the financial and operational impact.
This is generally easier to understand than distributing unrelated Inputs and Outputs across several arbitrary pages.
Don't create too many pages
Multi-page mode can simplify a complex Calculator, but too many pages can create unnecessary navigation.
Create a new page when there is a meaningful change in task or context.
If several related Inputs can comfortably exist together, they may be better placed on one page using Columns or Accordions.
Preview the complete journey
Don't Preview only one page.
Before publishing, work through the entire Calculator in the order a user will experience it.
Check:
Page titles
Page order
Navigation orientation
Element assignments
Visibility conditions
Input behaviour
Calculated results
Overall journey
Also test conditions that cause pages to appear or disappear.
Example Calculator journey
A customer contact centre Calculator might use:
1. Contact Centre Profile
Annual Calls Agent Numbers Average Handle Time Agent Cost
↓
2. Automation Assumptions
Eligible Calls Containment Rate Expected Handle Time Reduction
↓
3. Investment
Implementation Cost Annual Technology Cost
↓
4. Results
Calls Automated Agent Hours Saved Annual Benefit Net Benefit ROI Payback
This turns a larger calculation model into a guided experience.
Best practices
When building a multi-page Calculator:
Give every page a clear purpose.
Use business-friendly Page Titles.
Put pages in a logical user journey.
Assign elements deliberately.
Review any elements showing Unset.
Use page visibility only where it improves the experience.
Remember that visibility conditions create dependencies.
Use a specific page while arranging content.
Use ALL to review the overall structure.
Don't create more pages than the Calculator needs.
Preview the complete journey before publishing.
Last updated