Create and Design Dynamic WhatsApp Flows in Meta
Updated
WhatsApp Flows enable businesses to create interactive, multi-step user experiences directly within WhatsApp. Flows can be used for use cases such as lead capture, appointment booking, surveys, product selection, and other guided customer journeys.
This article explains how to create and design a WhatsApp Flow in Meta before integrating it with Sprinklr.
Create a WhatsApp Flow
1. Log in to Meta Business Manager and navigate to the Flows section in the left pane.
2. Click Create Flow in the top right corner.

3. On the Create flow page, enter the required Flow details:
Flow Name
Category
Other mandatory flow configurations

4. Click Create in the bottom right corner.
You will be taken to the Editor window, where you can add the required screens and components.
5. Save the flow configuration.
6. Open the Flow JSON and confirm the version is set to:
"version": "7.3"
This version is required for compatibility with supported WhatsApp Flow functionality.
Designing the Flow
You can design the flow using either of the following methods:
Use the Meta Playground UI Editor
Build directly in Flow JSON
Option 1: Use the Meta Playground UI Editor
1. Open the Meta Developer Playground.
2. Create each screen using the available UI components.
3. Configure the required fields, buttons, forms, and layouts by clicking + Add content and adding the required components.

The JSON will be generated in the Playground.
4. Click Copy Flow JSON to copy the generated code into the Flow Builder in Meta Business Suite.

5. Open the Editor screen in the WhatsApp Manager and paste the code.
6. Click Save to add the flow to the drafts and click Publish to publish the final flow.

Note: The generated JSON provides the visual structure and layout of the flow. Additional modifications may be required when integrating the flow with Sprinklr.
Option 2: Build Directly in Flow JSON
You can also edit the Flow JSON directly in Meta Business Suite using the available component definitions and JSON examples. This approach is typically used for advanced flows that require custom navigation logic or dynamic behavior.
1. Open the Meta Developer Playground.
2. In the left pane, expand Guides, then click Components.

3. Click the desired flow components on the screen.

You will be redirected to the component JSON flow, which can be further customized as per the use case.

Dynamic Flow Actions
WhatsApp Flows support multiple actions that determine how users move through the flow.
Navigate Action
The navigate action moves the user from one screen to another without calling any external endpoint. Use this when the next screen depends on user selections already available within the flow.
Use Cases
Multi-step forms
Conditional screen navigation
Collecting user preferences
Internal flow branching
Example
"on-select-action": {"name": "navigate","next": {"type": "screen","name": "NEXT_SCREEN"},"payload": {"name": "${form.first_name}","lang": "${form.favourite_language}"}}
Data Exchange Action
The data_exchange action sends information to an external endpoint and retrieves data before loading the next screen.
Use Cases
Dynamic product recommendations
Customer validation
Inventory checks
External API integrations
Real-time data retrieval
Example
"on-select-action": {"name": "data_exchange","payload": {"discount_code": "${data.discount_code}","items": "${form.selected_items}"}}
Complete Action
The complete action is used on the terminal screen to end the flow. A terminal screen is the final screen from which no further navigation exists.
Use Cases
Form submission
Survey completion
Order confirmation
Lead capture completion
Example
{"type": "Footer","label": "Submit Data","on-click-action": {"name": "complete","payload": {"name": "${form.first_name}"}}}
Best Practices
Use meaningful screen names for easier maintenance.
Keep flow navigation simple and intuitive.
Use navigate wherever possible to reduce unnecessary API calls.
Use data_exchange only when external data is required.
Ensure all flow paths eventually end with a complete action.