Are you interested in learning UI Builder? Me too! but I feel overwhelmed because I tried diving in and found it totally unintuitive. I think this is because of two main reasons 1) the inherent complexity of UI Builder makes it a lot to get used to, and 2) working in UI Builder differs significantly from typical ServiceNow development I’m used to.
Change is scary, but, remember, we’ve been through this with several ServiceNow components lately. We are still here, thriving, and now we have more tools! For example, I talked about Flow Designer vs. Workflow in my article about ChatGPT.
I know when I have that gut reaction to run away, I have to remind myself: We are not doing ourselves (or our customers!) any favors by avoiding these new technologies, nor will they disappear just because we ignore them. So let’s push past being uncomfortable and get started!
What is UI Builder?
The Next Experience UI Framework (Next Experience) is ServiceNow’s JavaScript framework for building User Interfaces (UI). It allows developers to create modern web-based user experiences (UX) using reusable web components. ServiceNow released the Next Experience UI in ServiceNow’s San Diego version in early 2022.
UI Builder (UIB) is a web user interface builder, part of the Next Experience UI Framework. UI Builder can build pages for configurable workspaces, App Engine Studio-generated workspaces and portals, and web experiences using Next Experience Components and custom web components. Believe it or not, ServiceNow released UI Builder in Quebec in early 2021!
UI Builder allows the construction of two primary interfaces: workspaces and portals. Before UI Builder and Next Experience,
- For portals, we had Service Portal capabilities. Most customers have end-user-facing portals based on Service Portal technology. Due to the current limitations of UI Builder, which I will detail below, there is no planned deprecation of Service Portal features.
- For workspaces, we only had access to static and limited configurable workspaces provided by ServiceNow for baseline applications. Also, many fulfillers still work in the good ole platform UI, now referred to as “classic.” ServiceNow is working to replace legacy workspaces with UI Builder-based workspaces.
When should I use UI Builder?
Currently, UI Builder has some limitations, and they are essential for deciding how and when to use UI Builder in our applications. Here are ServiceNow’s recommended usage, confirmed to be current as of the Washington, D.C. Release.
| Capability | UI Builder | Service Portal |
|---|---|---|
| Target Audience | Fulfillers | Requestors (End Users) |
| Portal Capability | Workspaces and small, departmental portals |
Enterprise portals |
| Responsive | No | Yes |
| Pixel Perfect Design | No | Yes |
| Service Catalog | Very limited support | Fully supported |
| ATF Testing | Partial | Fully supported |
| Public Pages | Difficult to set up | Yes |
Source: Next Experience Product Hub Article: UI Builder and Service Portal last updated by ServiceNow on April 17, 2024.
Given that information, UI Builder would not be applicable in the following situations:
- You need an end-user-facing Service Portal with a specific color scheme or design, for example, to match company branding.
- You need an enterprise portal, like Employee Service Center, to combine multiple disparate organizational portals for a consolidated user experience.
- Guest users that need to access or interact with your portal outside of authentication.
- You use Service Catalog or ATF heavily.
- A large user base must access your portal from a mobile phone browser. NOTE: An alternative is configuring a second Mobile app experience for phone users; however, this requires an app installed on the device.
All of these represent significant investments for your organization, and right now, it doesn’t make sense to replace those experiences with a UI Builder Builder interface. That said, the “right now” bit is important. I expect features like Service Catalog and ATF support to be available in future releases. So if just a few roadblocks are holding you back, don’t lose hope!
Even if those situations above apply, that doesn’t mean you can’t use UI Builder interfaces in other areas.
How do I get started with UI Builder?
There are several getting-started resources available for Next Experience and UI Builder. Here are the top three resources I recommend.
- Next Experience Center of Excellence – Community Article: The #1 best place to start. This is a one-stop shop where ServiceNow product managers update content frequently.
- UI Builder Quick Start Guide – Community Article: This guide will walk you through the steps to get up and running with the new UI Builder (UI Builder) released in Quebec. It contains some foundational content with additional links for the other UIB topics.
- UI Builder Fundamentals (Utah) – NowLearning Course: A free, on-demand course where you can learn the basics of using the UI Builder as a web user interface builder within ServiceNow.
Where do I go next?
Next, I plan to walk through the You and I Builder Live! series on YouTube. I love any live series from current and former ServiceNow Developer Advocates because they always bring a bit of whimsy to educational content, which makes it more enjoyable to consume. I’ve already made it through the first episode sloooooooowly because I had to pause and learn how to create some of the elements Brad prebuilt for the session. I plan to detail what those elements are in my next blog so you can more easily follow along.
