The Logic map is a powerful visual tool that helps you map out the structure of your form or app, making it easier to track conditions, variables, and logic paths.
It simplifies understanding of how user input and variables interact, enhancing your form-building experience.
Visualize and optimize your forms with conditional flows
The Logic Map is a visual representation of your form’s structure, conditions, variables, and the logic flows.
It allows you to see how each field, condition, and variable is connected, helping you refine the user experience.
The map displays each element of the form as a box, with arrows showing the flow and connections based on conditions.
📝 Additional insights:
How to add basic conditional logic: Learn how to quickly set up simple if/else conditions on your form fields to control the flow and ensure users only see the most relevant sections based on their inputs.
How to add advanced logic to your form: Take your form's behavior to the next level by leveraging complex conditions, multi-condition rules, and cross-field logic for highly customized user experiences.
Why use the logic map
Simplify complex logic: The logic map provides a clear, visual understanding of your form’s logic. It’s especially helpful in forms that use multiple variables, like quizzes or pricing calculators, by showing how conditions and variables work together.
Example: In a BMI calculator, the map shows how user inputs like weight and height update the BMI variable, ensuring calculations are correct.
Troubleshoot efficiently: The logic map gives you an overview of how everything connects, allowing you to catch potential issues early.
It highlights conflicting logic or missed connections that could lead to errors.
Optimize user flow: With a clear visual layout, the logic map helps ensure your form flows logically and smoothly.
You can track how data moves from one question to the next and ensure users have a seamless experience.
Key benefits of the logic map
Visualize complex interactions: You can see how each user input and variable affects the rest of the form.
Identify and fix issues: The map helps you pinpoint conflicts or problems in your form’s structure early in the design process.
Refine the user experience: With a clear view of your form's flow, you can optimize the user journey by adjusting logic paths.
How does the logic map Work
The logic map works by visualizing the conditions, variables, and logic flows that govern your form.
The map shows how each field interacts with others based on the rules you've set, such as “If the answer is X, then show field Y.”
Steps to access the logic map
Open the settings tab: In the form editor, go to the Settings tab.
Click on "Logic map overview": Once you open the Settings tab, you’ll find the Logic map overview section. Clicking this will show the map.
Review variable pathways: The logic map will display how each field is connected, allowing you to check if the conditions and variables flow correctly.
Examples of the logic map in action
Example 1: BMI calculator
In this example, the logic map visualizes how the BMI (Body Mass Index) calculation is triggered based on the user's weight and height inputs.
The map shows how different BMI value ranges (calculated from user input) redirect the user to different ending pages based on the outcome of the BMI calculation.
For example:
Condition: If the BMI value is greater than or equal to 25 and less than or equal to 29.9, the user is classified as Overweight.
Action: After submitting the form, the user is redirected to an Overweight ending page.
In the logic map, you can clearly see the branching structure:
For BMI values in the range of 25 to 29.9, users are redirected to the Overweight page.
For other BMI values, such as those corresponding to Underweight, Normal weight, Obese, etc., the map shows which ending page the user will be sent to.
This setup ensures that users will see the most relevant feedback based on their BMI category, improving the user experience.
Example 2: Personality quiz
For a personality quiz, the logic map is used to categorize users into different personality types based on their responses.
The map visualizes how the user's answers to various personality-related questions impact their total score and determine their dominant personality trait.
For example:
Condition: If the user selects "A thrilling adventure story" in question #7, they earn points towards the "Socializer" personality.
Action: Based on their accumulated score, the user is redirected to an ending page that describes their personality type (e.g., Socializer).
The map shows how logic conditions determine which result page to display, depending on the highest score.
Example 3: Branding questionnaire
In this example, the logic map is used for a branding questionnaire where the user is asked about existing brand elements.
If the user selects "No" for having existing brand elements, they are immediately skipped to the next relevant question without having to answer a redundant question.
Example:
Condition: If the user answers "No" to "Do you have any existing brand elements (logo, colors, fonts)?"
Action: The logic jumps the user to the next relevant question, skipping the "Upload Logo" step.
This Jump action helps streamline the process by skipping unnecessary fields and ensuring a smoother user flow, especially when the information being asked for is not relevant to the user.
If the answer is "Yes," the user will proceed to the "Please upload your logo here" step.
If the answer is "No," the logic skips the logo upload question and goes directly to the "What kind of visual style resonates with your brand?" question.
By using Jump logic, the form is optimized for the user, making it more efficient and reducing unnecessary steps based on previous responses.
Key actions in logic mapping
Show/Hide fields: Control which fields are visible based on the user’s previous input in classic forms.
Jump to fields: Skip over irrelevant sections or fields to enhance the user experience in multi-step forms.
Set values automatically: Assign specific values to fields based on conditions, making the form dynamic.
Redirect to ending page: Direct users to a custom success page after form submission.
The logic map is an essential tool for anyone to create dynamic, user-friendly forms. It helps you understand how your form’s logic and variables interact, making it easier to manage complex workflows and provide a smooth user experience.
By visualizing the flow and spotting potential issues early, the logic map ensures that your forms work as expected, leading to higher user engagement and smoother processes.
📝 Additional insight
Automate actions with "On Update" logic
Looking to streamline your workflows even further? With "On Update" logic, you can automate actions not just when a form is submitted, but whenever a response is updated.
💡 Why use "On Update" logic?
✔️ Automatically notify users when key responses change.
✔️ Reassign tasks based on updated priorities.
✔️ Trigger webhooks to sync data with external tools.
✔️ Send Slack messages to keep teams informed in real-time.
🔗 Learn more about how "On Update" logic works and how to set it up:
👉 What is "On Update" logic and how it works? 🚀