---
sourceDocument: Australia Build or modify applications
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/application-development

 Release :

    - australia

ft:locale :

    - en-US

ft:publication_title :

    - Australia Build or modify applications

ft:clusterId :

    - cadev

bundleId :

    - cadev

workflow :

    - Development, Data, and Analytics


---

# Create a UI interaction

# Create a UI interaction {#ariaid-title1}

Release version: Australia  
Updated March 12, 2026  
![](https://www.servicenow.com/docs/portal-asset/ico-clock) 2 minutes to read  
Create a UI interaction and attach it to a component event in UI Builder. UI interactions are reusable flows that combine UI, logic, and scripts into a single unit, including custom UI built with Component Builder, and can be triggered from any component event on a
page.

## Before you begin

Role required: ui_builder_admin

## About this task

In this task, you create a UI interaction and define its behavior using the diagram editor. You select an interaction type, add and configure steps, define logic and branching, and specify inputs that the interaction requires
at runtime.  
Important:  
UI interactions don't run on their own. After creating an interaction, you must attach it to a component or page event so it can run when that event occurs.

## Procedure

1. Navigate to AllNow Experience FrameworkUI Builder.
2. From the UI Builder home page, select CreateUI interaction.  
   Figure 1. Create UI interaction
3. In the creation modal, enter a name for the interaction.  
   Figure 2. UI interaction creation modal
4. Select an interaction Type.  
   Generic interactions are used with no dependencies on form or list controller data. Form interactions use form-specific steps such as validating or saving a record. List interactions use list-specific steps such as
   refreshing or querying a list. If you're unsure, choose Generic.
5. **Optional:** Enter a description that summarizes what the interaction does and when it runs.  
   For example, <kbd class="ph userinput">Displays a confirmation modal before deleting a record</kbd>.
6. Select Create.  
   Figure 3. UI interaction editor  
   The diagram editor opens with a start and end node connected by an add icon ![]().
7. Select the add icon ![]()between the start and end nodes to open the toolbox, then select a step to add it to the diagram.  
   Note:  
   The steps available in the toolbox depend on the interaction type that you selected.
   Figure 4. UI interaction toolbox
8. Select the step to open its properties in the configuration panel.
9. Configure the step properties in the configuration panel.  
   Properties vary depending on the step. For example, a modal step lets you set button labels and field content, while a script step lets you write server-side logic.
10. Repeat steps 7--9 to build out your interaction.  
    Steps execute in sequence. To run steps in parallel, select the And step to create parallel branches. Each branch represents a separate path of steps and executes in order from top to bottom. To create conditional paths, add an If/Else step from the toolbox. This step creates branches that run when conditions are met. For more information, see [Edit an existing UI interaction](https://servicenow-prod.fluidtopics.net/~FYomN77vfL1qWoqQFRy5Q "Edit or modify an existing UI interaction by inserting new steps, swapping or deleting events, removing steps, or updating step configurations in the diagram editor.").
11. Use the Inputs pill to add any data your interaction needs at runtime.  
    Supported input types are: String, True/False, Choice, Reference, and JSON.
12. Select Save.

## Result

The UI interaction is created and ready to be attached to a component or page event. Once attached, it runs its configured steps whenever the specified event occurs. See [Trigger a UI interaction from a page event](https://servicenow-prod.fluidtopics.net/lMSJJEhBYIo7sDnFhfZvZg "Attach a UI interaction to a UI Builder page event so the interaction runs when a user performs an action on a component.").

To trigger this UI interaction from a form or list button using a declarative action, see [Trigger a UI interaction from a declarative action](https://www.servicenow.com/docs/access?context=configure-da-ui-interactions&version=australia&pubname=australia-platform-user-interface&ft:locale=en-US).

*[\>]: and then