UI Builder Fundamentals
Create an Experience
Lab 1 15 minutes
Lab objectives
In this lab, you will be launching the App Engine Studio (AES) to view an application called
Safety that already exists in your student instance. This application is meant to allow users to
log and track safety related issues.
It already includes a portal starter experience that contains only the default pages that get
added when creating an experience within AES. You will then create a new workspace
experience and view it in UI Builder from AES.
A. Explore the Safety Application
Review the Safety application in App Engine Studio and preview the portal experience.
1. Navigate to App Engine > App Engine Studio within the All menu on the Unified
Navigation header. App Engine Studio (AES) will open in a new browser tab.
2. Select the Get Started button within the Getting Started dialog box.
3. Within the My recent apps section, select the Safety card to open this application.
4. Review the contents of the Safety app. Among other items, It contains the following:
Data: Issue table
Experiences: Safety Portal (portal), User (form), Approval (form), Issue (form)
Security: safety_admin and safety_user roles
Image below.
Note: As you begin to work within AES, you will be presented with callouts to guide you
through it and to learn about its capabilities. Take a moment to read through each of
these instructions before proceeding. These can be turned off using the Guidance
toggle pointed out in the image above.
5. Within AES, you can view the Safety Portal experience by selecting Preview on its
Experience row (see image above). This opens it in a new browser tab.
B. Create a New Workspace Experience
1. Within AES, select the +Add button on the Experience row to begin adding a new
workspace experience.
2. Select the Workspace tile.
3. Select the Begin button.
4. Specify Safety WS for the name, leave the default values for the other fields, and
select Continue.
5. Leave Issue as the Primary Table and select Continue.
6. Once you see the Success! message, select Done.
7. View the new starter Safety WS workspace experience by selecting Preview on its
Experience row. This opens it in a new browser tab.
Note: The Home page in this starter workspace experience contains a dashboard where
you can configure each data visualization by selecting Edit. We will be configuring data
visualization components in a later lab.
8. From within AES, you can also open an experience in UI Builder to edit it. To do so,
select the three dots on its Experience row and select the Edit option or just click on
the row itself.
Image below.
9. There are a couple items to notice here:
• UI Builder opens in a new tab within AES.
• Because we created the new experience within AES, it already includes a
number of pages that are ready to use.
Note: The Home page just keeps loading in UI Builder, a defect in the Tokyo release. We
will not be using this page, so it will not affect the labs in this course.
Congratulations! You have completed this lab.
