As far back as the London release, ServiceNow has been slowly building the capabilities and components available with the UI Builder. With the latest release from ServiceNow, Quebec, it’s finally starting to evolve into a suitable option for development teams wanting to build elegant Workspaces or Service portal experiences.

This is how ServiceNow explains it.

“ServiceNow® Now® Experience UI Builder is a WYSIWYG web user interface builder. UI Builder enables developers to build new pages or customize existing web-based workspace and portal experiences using ServiceNow® Now® Experience Components and custom web components. UI Builder is a new application in the Quebec release.”

ServiceNow has compiled a rich library of pre-built components and configuration options for developers to choose from, which seems to hit all the high notes. Once you’ve become accustomed to the nomenclature changes, i.e., components vs. widgets, the redesigned UI allows for a friendly experience when structuring and laying out your components.

Below are a few of the highlights as explained by ServiceNow.

UI Builder highlights for the Quebec release

  • Create pages for workspace and portal experiences. Your pages can be tailored for anyone in an organization like agents, analysts, human resources, and more.
  • Build your workspace and portal user interfaces on top of the ServiceNow® platform.
  • Empower your builders to create and edit UI pages using Now® Experience Components and custom components.

See UI Builder for more information.

Overall, it’s a massive improvement from previous iterations. Developers will find it improves their ability to build workspaces and services portals that deliver value to their organization or customers with greater efficacy and supports a modern work experience.    


This information in this article is intended for ServiceNow Administrator (s), implementation owner (s), and select users who have the role (s) workspace_admin, ui_builder_admin, admin.


It is a starting point to provide a workable and reference able framework that enables you to build and deliver value faster—an opportunity for you to deliver an elegant experience to your customers.

Before We Start

For demonstration purposes, I will be using the ServiceNow Releases of Paris and Quebec. Depending on which ServiceNow release your organization is running, the information and techniques to follow may appear differently on your instance.

Part 1

Introduction to User Experience Building Workspaces and Services Portals in Paris

  • Building a Workspace in Paris
  • ServiceNow Paris UI Builder Tutorial Documentation
  • Developers have the ability to add page components using drag and drop interface.

Part 2

Introduction to User Experience Building in Quebec

  • The Now Experience Quebec release documentation
  • Review “Introduction to the New Now Experience UI Builder”.
  • Review ServiceNow documentation pages
  • Watch ServiceNow Live Coding Happy Hour Episode (below).

LCHH Episode: Building a Services Portal in Quebec Release

Still, Have Questions? Need Help?

Contact ME with questions or requests.