The Configurator with Graphic Segmentation uses large imagery and calculators to showcase products or services that best fit the user's needs. As the user makes choices, questions will be populated based on the previous choice. This configurator is great for prospects who are later in the funnel and looking for a solution that fits their needs.
We recommend that you receive expert-level ion training before using this Quick Start because it requires familiarity with full-page slider, logic and custom forms. Feel free to contact your customer success manager for a brief orientation if needed.
Because this Quick Start utilizes advanced logic, we have also put together a logic template to help you understand the inputs and outputs of this experience. Click here to review the logic template for the Configurator with Graphic Segmentation.
What You’ll Need to Get Started
- Content/copy for question and segment
- 6 large images to be used in the background
- 14 small to medium images such as iconography
- 1 form
- Data export
Get to Know This Quick Start
Here's a brief orientation to this Quick Start.
Configurator with Graphic Segmentation - Landing Page & Quiz
The landing page of the Quick Start features a large background image and a CTA to begin the configurator.
Once users select to begin the experience, they will be navigated through a series of questions that will take the user on a journey that will be based on their selections.
Each question leverages iconography and reveal tiles to help tell the story.
As the user answers questions, interstitials are populated to share details about that previous selection. These interstitials encourage users to continue moving through the experience.
Configurator with Graphic Segmentation - Results
The result page features custom results that are based on the user's selection to the questions. The Quick Start uses backend logic to display a plan that meets the user's needs and is based on choices that they made during the configurator. Optionally, additional plans are displayed to the user on the result page as well.
A form is in place prior to the result page that asks the user to enter their state and email address.
This experience includes:
- Full page slider to create a seamless transition between questions and pages. For more information about the full-page slider component, click here.
- Reveal tiles to showcase imagery and copy in a more engaging way. For information about reveal tiles, click here.
- Subtle animations are leveraged to capture attention to the questions. For information on the animation component, click here.
Tips & Tricks
- We recommend you complete expert ion interactive training to use and modify this Quick Start because it contains sophisticated advanced rules and custom forms for the quiz. If you use this Quick Start with no custom modifications at all, expert skills are necessary.
- Everything within this experience can be edited by double clicking each page element. For more information on publishing & editing content within ion interactive pages, click here.
- You can adjust the layout of the page content by altering the grids, columns and rows that are published into the creative’s containers. For more information on working with grids, click here. We recommend intermediate ion training to adjust the layout of your pages.
- Update the placeholder form to one from your ion interactive Form Library. Double click the placeholder form and navigate through the Form Library to select your own form. This requires that you already have a form created in your library.
- Connect the form to your own pre-configured export, to ensure the data that is collected is exported to your external third party systems. For information on connecting your form to your exports click here, or for information on export options, click here.
- For this expert Quick Start, we assume you will use an existing form from your ion interactive Form Library. For more information on creating forms with ion interactive, click here. We recommend intermediate training for form building.