MadhavJoshi
ServiceNow Employee

 

Spoiler

If you’ve spent time in UI Builder, you know the setup cost: pages to scaffold, binding expressions to write, payload field names to look up, and formula syntax to memorize. Now Assist for Creator’s UI generation features are designed to eliminate that overhead — and this walkthrough shows exactly how, step by step.

The scenario is a realistic one. A UI developer at a service desk organization needs to build a new Experience. It has to serve two teams:

  • The Incident Response team needs a quick-access list of all open incidents, filtered by priority.
  • The Change Management team needs a task list of open change requests that opens each record in a new tab when clicked.

On top of that, a navigation button on the home page must dynamically change its label — showing "View Incidents" when the incident table is active and "Switch Table" otherwise. That's a conditional binding expression. Without Now Assist, that alone means formula syntax, context property paths, and a trip to the documentation.

 

With Now Assist, the developer describes it in plain English and moves on.

 

Here's how the full six-feature workflow plays out.

 

Prerequisites and role requirements

Before you start, make sure the following are in place:

 

Application

Now Assist for Creator (sn_now_creator) is installed from the ServiceNow Store

Role

ui_builder_admin required for all UI Builder and Now Assist features in this use case

Module generation 

An admin role is required for application menu and module creation

Skills

Experience Generation, Client Script Summarization, Data Binding Generation, and Module Generation must be active in Now Assist Admin > Features > Creator

LLM provider

Configure via AI Control Tower: Now LLM Service, Now LLM Long Term Stable, Azure OpenAI, Google Gemini, or Anthropic Claude on AWS

Release

UI Builder Agent and Module Generation are available from the Australia release onward. Data Binding Generation available from Zurich (28.1) or later.

 

The six-step workflow at a glance

 

1

Experience Generation

Generate a fully scaffolded, multi-page tabbed experience from a single natural language description — no manual page creation or layout configuration.

✓  Multi-page experience created in minutes!

 

2

UI Builder Agent

Use the Now Assist panel in the page editor to understand what was generated, then extend the experience by adding new components via chat.

✓  New button component added to home page.

 

3

Client Script Summarization

Get a plain-language explanation of the client script attached to the button — a high-level summary plus a detailed functional breakdown — before configuring its behavior.

✓  Script logic understood without manual code review.

 

4

Event Handler Generation

Configure click-based record navigation on two components using natural language — no payload field lookup, no binding expressions, no parameter schema reference.

✓  Button and task list navigation fully wired.

 

5

Data Binding Generation

Describe the conditional label logic in plain English and let Now Assist generate the IF formula — no syntax memorization, no context property path hunting.

✓  IF formula applied to button label property.

 

6

Module Generation

Step outside UI Builder and connect the experience to the platform navigator — generating multiple application modules from a single prompt.

✓  Three navigator modules generated and ready for use.

 

Step-by-step: what to do and what to expect

 

Step 1 — Experience Generation: Create the initial workspace

 

Navigate to All > Now Experience Framework > UI Builder, select Create, then choose AI-Generated experience. In the creation form, enter a description of your experience.

 

Now Assist Prompt

Create a Tabbed experience to help service desk agents manage Incidents and Change Requests. Include a home page with a button to navigate to open incidents by priority, and a task list page showing open change requests.

 

Select Generate preview to review the output. If the structure matches your intent, select Save and edit experience.

 

What you get: A multi-page tabbed experience with a Home page (navigation button, task list placeholder), a Change Requests page (list view for open change requests), and an Incidents page (list view filtered by priority). Pages, tabs, and component scaffolding — all in place, no manual layout work.

UIGen_Step1_ExperienceGeneration.png

 

💡

Tip: Select “Try an example” in the creation form to see sample prompts. For best results, include the experience title, navigation style, chart types, and table names in your description.

 

 

Step 2 — UI Builder Agent: understand and extend the experience

 

Open the Home page in the page editor, then open the Now Assist panel from the toolbar. Start by asking the agent to describe what was built:

 

Now Assist Prompt

What components are configured on this page, and what do they do?

 

The agent returns a plain-language breakdown of each component — its type, configuration, and how it connects to data resources or event handlers. Once you understand the structure, ask the agent to add a component:

 

Now Assist Prompt

Add a button labeled 'View Open Incidents' to the top of the home page.

 

The agent places the button, assigns a default label, and confirms the change. Review it and accept.

UIGen_Step2_UIBuilderAgent.png

 

ℹ️

Note: The UI Builder Agent operates only within the page editor. Try targeted questions like “What is a data resource?” or “Are any client scripts used on this page?” to get answers grounded in the latest ServiceNow documentation.

 

 

Step 3 — Client Script Summarization: Understand the generated script

 

When the button was added, a client script was automatically attached to handle its initial visibility state. Before configuring click behavior, it’s worth understanding exactly what that script does.

 

From the page editor, open the Data and scripts panel, locate the client script on the button component, and open it. The Explain Code panel appears automatically (requires the ui_builder_admin role and the Client Script Summarization skill enabled). Select Explain this code.

 

What you get back:

  • A concise high-level summary — for example, that the script initializes the button’s visibility state based on the current table parameter in the workspace.
  • A detailed functional breakdown covering each logical block, where the script triggers, and which properties it reads or modifies.

UIGen_Step3_ClientScriptSummarization.png

 

ℹ️

Note: If the script is modified after running Explain this code, a message in the Explain Code panel notifies you. Select Explain again to regenerate the summary from the latest version.

 

 

Step 4 — Event Handler Generation: wire navigation with natural language

 

This step handles the core navigation requirements. Two components need click behaviors configured.

 

For the button: Select the “View Open Incidents” button, open the Button clicked event from the events panel, and select Add handler > Link to destination. In the Now Assist input panel, type:

 

Now Assist Prompt - Button

Open a simple list page with a table from the state parameter.

 

Now Assist identifies the simple list page, sets it as the destination, and binds the table parameter to the correct workspace state parameter. Review the preview, select Accept and edit, then save.

 

For the task list: Select the Change Requests task list component, open the Reference link clicked event, and select Add handler > Link to destination. Type:

 

Now Assist Prompt - Task List

Open the record page in a new tab with the fields table and sysid from the event payload.

 

Now Assist sets the destination to the record page, binds the table and sys_id parameters from the event payload, and enables “Open in new tab.” Review, confirm, and accept.

UIGen_Step4_EventHandlerGeneration.png

What this eliminates: No payload field name lookups, no binding expressions to write, no record page parameter schema to reference.

 

 

Step 5 — Data Binding Generation: conditional label logic without syntax

 

In the page editor, select the button component, then open the Label property in the configuration panel. Select the data binding icon to open the Data Binding popover, then select Get started and enter:

 

Now Assist Prompt

If the current table in the page state is 'incident', show 'View Incidents'; otherwise, show 'Switch Table.'

 

Now Assist converts this into valid formula syntax and displays it in the Formula Builder for review:

 

IF(@context.props.table = "incident", "View Incidents", "Switch Table")

 

Select Accept and Edit, then Apply to attach the binding to the Label property. Preview to confirm the label changes correctly.

UIGen_Step5_DataBindingGeneration.png

 

💡

Tip: Data Binding Generation supports natural language synonyms for formula operators — “how many” maps to LEN, “total” to SUM, “check” to IF, and more. There are over 70 operators, each with multiple synonyms mapped to it.

 

 

Step 6 — Module Generation: connect the experience to the navigator

 

This step moves outside UI Builder. From the application navigator, select All > Create menu. In the Title field, enter Service Operations. Optionally, restrict the menu to the ITIL role for service desk agents. Select Create.

 

On the Add modules page, select Generate multiple modules at once using Now Assist and enter:

 

Now Assist Prompt

Add: a list module called 'Open Incidents' showing active incidents assigned to me, a list module called 'Change Requests This Week' for all change requests scheduled this week, and a dashboard module called 'Service Desk Overview.'

 

Select Generate. Now Assist produces three modules with full configuration:

 

 

Module

Configuration

Open Incidents

List module — table: incident, filter: active=true^assigned_to=javascript:gs.getUserID()

Change Requests This Week

List module — table: change_request, filter: scheduled_date within this week

Service Desk Overview

Dashboard module — empty dashboard ready for component configuration

 

Each generated module shows an AI indicator. Review them, select Accept and Edit for each, optionally adjust any configuration fields, then select Done. The modules appear immediately in the platform navigator.

 

UIGen_Step6_ModuleGeneration.png

 

 

See what you built!


UIGen_Stepper.gif

 

End-to-end summary

Across all six steps, here’s what the developer typed and what Now Assist did:

 

Step

Feature

Developer input

What Now Assist did

1

Experience Generation

Natural language description of your experience

Generated multi-page tabbed experience with components and layout

2

UI Builder Agent

Questions and modification requests in chat

Explained page contents and added a new button component

3

Client Script Summarization

Selected Explain this code

Produced plain-language summary and detailed functional breakdown

4

Event Handler Generation

Two natural language navigation prompts

Configured Link to destination handlers with correct payload bindings

5

Data Binding Generation

Conditional label description in natural language

Generated valid IF formula and attached it to the Label property

6

Module Generation

Single multi-module prompt

Created three fully configured application navigator modules

 

References

For official product documentation on UI generation in Now Assist for Creator, see:

UI generation — Now Assist for Creator (ServiceNow Docs, Australia release)

 

 

© 2026 ServiceNow, Inc. All rights reserved. ServiceNow, the ServiceNow logo, Now, and other ServiceNow marks are trademarks and/or registered trademarks of ServiceNow, Inc., in the United States and/or other countries.

Version history
Last update:
yesterday
Updated by: