UI Builder is a web user interface builder. Use UI Builder to build pages for App Engine Studio generated workspaces or custom web experiences using Next Experience Components and custom web components.

UI Builder overview

UI Builder quick start

Get started with UI Builder

Note: UI Builder is not yet capable of building or configuring ServiceNow base system service portals, such as the Employee Center. For service portals, continue to use the Service Portal Designer.

Key features of UI Builder

Create or customize pages for workspace and portal experiences. A page is a collection of components that make up a workspace or portal UI.

Note: The ui_builder_admin role is required to complete tasks in UI Builder.
Figure 1. UI Builder
Full UI Builder screen.

Create variants of pages to target experiences for different audiences. For example, you can create a home page for agents, and a variant for managers at the same URL.

Use the UI Builder library of components to build your pages. You can add them to your page. Configure them any way that you need and then connect your company data to them.

First nine components available in the component list.

Bind data to your components using data resources to dynamically expose your data from tables, records, or other elements on your page. Data resources let you reuse your components.

Create any type of page design by changing the layout of the page.Sample page with a large layout and multiple components.

Use CSS to change the visual style of a component in your workspace or portal experience. For example, you can add a background color to a container component.

Change data visualizations in UI Builder

You can change data visualization types via a drop-down in the configuration panel to preview different data visualization types. Each data visualization can be configured to display different data depending on who is using your experience.

Data visualization type options in a drop-down.