Part 1: Create your first experience using UI Builder

Create your first UI Experience

Before we start, I would like to brief about what UI Builder is.

As part of Quebec release, Servicenow has introduced UI Builder as part of Now experience framework. It is easy to use UI builder, which let’s you create your Portal, Workspace etc. with simple drag and drop components.

As part of the entire series, we are going to build the portal for our fictitious company called “Panda Tech”.

To learn more about what the UI Experience is, check out this Servicenow Blog.

Let’s first create UI experience

• Navigate to Now Experience Framework > Experiences.
• Click New.
• Fill in the fields, as appropriate.

1. Title – Panda Tech
2. Page – Leave that blank for now
3. App Shell UI – Select Portal App Shell here (More info)
4. URL Path – panda_tech
5. Active – True
6. Admin Panel – Create a new admin panel with our (Admin panel helps you manage portal themes, App routes, Launch UI Builder etc.)
7. Auth routes – Put following snippet (We will revisit this later in detail)

   { "login": "login", "logout": "login"}

• Click Submit

Fill in the fields, as appropriate.

1. Name – Panda Tech App Config
2. Active – true
3. Landing Path (This will be homepage) – home (We will create a page with this route later)
4. Description – Configuration for Blog Demo App Config
5. Click Submit.

Great!! We have created our very first portal experience Panda Tech.