good morning good afternoon good evening wherever you may be thank you for joining us on another mobile app academy we're extremely happy to have you all i see quite a few names on here wow actually quite a few new ones quite a few ones that i recognize thank you for joining us wherever you are in the world we really appreciate it whether you're live or on demand my name is charlie steiner product marketing manager here at servicenow and today on our live building session we'll be walking you through getting started with the safe workplace apps that were released within the past couple months um so if you're brand new to mobile app academy we host these sessions every two weeks here on zoom 10 a.m pacific and if you're new to using our servicenow mobile apps definitely let us know in the chat we're browsing the chat for your questions we should get back to you fairly quickly and we love getting insight from all of you whether it's in the chat window or on our mobile community page on the servicenow community so we put these sessions together based on your feedback so definitely let us know and again whether it's here or in the community whatever you're working on whatever you're interested we'd love to hear from you um and we want this to be a two-way street so get in touch with us with all that said and the admin over i'd love to introduce david haw our senior product marketing manager to get things started david thanks for the intro charlie good morning everyone and welcome back to our mobile app academy let me go and share my screen really quickly uh and then we'll just uh get started on the agenda so let's see here all right so you should be able to see my screen now so my name is david hawt and i'm an outbound product manager here at servicenow i want to give a warm welcome to everyone joining us here live today so uh in case you're wondering for today's topic uh i will start off by giving you a background on our safe workplace mobile apps and then we'll be doing a live building session leveraging the out of the box employee health screen mobile app from the safe workplace app suite and then how we can consolidate those workflows um into the now mobile app uh there are some uh there's a few past topics that we covered uh including configuring navigations migrating from the service down mobile classic app as well as the emergency response mobile app and if you're curious and learning more about those feel free to check out our mobile app academy recordings that we post on youtube and it's going to be found on our now support youtube channel but if you just do a quick search on mobile app academy it should be the first few videos that you see there uh and so within today's agenda in the custom workflow that we will be building today we'll start with the now mobile app and uh with the out of the box experience that's really readily available to use upon plugin installation we're going to be focusing on the general employee or the requester use case today and what we're going to do is we're going to enable the out of the box health screen mobile app from the service down store and this is one of the mobile apps that's available from our safe workplace app suite i'll provide a general overview on these apps in just a moment and then to improve this out of the box experience we're going to consolidate the workflow by moving some of the content from this plugin into a single apple launcher and then we're going to also enable two different personas for this workflow one for the general employee who's looking to return to the workplace and then the other is the screener who will use their mobile app to collect health screening data and grant entry for the employee or the visitor and then we'll also talk about some of the things you should consider around ux best practices when creating custom experiences for different users and then uh if you're curious on what topics we're going to cover in the next two weeks we'll be covering native manager dashboards so there's native screens for single scorecards time series and latest score pa widget okay so these will be the topics that we'll be covering in today's session um and if you are new to mobile we recommend that you check out uh our resources on mobile community there you can find some quick links to our mobile implementation guide as well as well as our past mobile app academy recordings um and i think an important note uh to consider today is you know if you're new to mobile uh mobile hierarchy and understanding the mobile hierarchy is important and it's essential in learning how you can customize and deploy your own custom workflows so i highly recommend checking out some of those materials that you find on mobile community also a reminder our mobile app academies will take place on an orlando instance uh although some of the features that uh we're configuring are also supported on new york instances um if you are on a new york instance you might find that some of the configurations may look different okay with that being said this is a live building session that will last about 50 minutes and then we'll open up the q and a in the last 10 minutes if we have time um and if you have any questions throughout today's presentation feel free to send them over in the qa section of zoom and then at the end of the presentation we'll circle back and address them okay so um the first thing that i want to dive into is a quick update and overview on our emergency response and safe workplace apps and we do have these available for mobile in case you're new to this so um with the impact on the uh of covet 19 on the workplace you know we're really seeing how this impacts the global workforce and as organizations plan for their employees to return to the workplace their ability to deliver the employees the right digital experience for the return is super detrimental and it's essential and you'll actually find that mobile plays a critical role in this and rapidly changing the work environment so servicenow solution for the kova 19 response consists of a suite of apps from both the emergency response management as well as safe workplace and these are all the mobile experiences that we have enabled so far within those two suites and for organizations who are who have limited resources and you're looking to react quickly so that you can expedite your employee's return to the workplace these experiences are pre-built and they can be quickly installed and deployed as is as soon as you have that plugin installed and uh with our mobile platform you can easily customize the experiences as needed as well um starting with the emergency response apps uh we've enabled emergency outreach as well as emergency self-report to help organizations prepare for their workplace readiness and the emergency outreach mobile app helps you stay connected with your employees via an email or push in which you can share updates or emergencies and you can ask your employees to report their statuses on the mobile apps as well and then with the emergency self report app um it provides employees a quick and easy way to report those statuses to their managers and also have follow-up actions for any employees who are affected and then with these safe workplace apps we've enabled employee surveys employee health screening and workplace ppme inventory management so any organization that's looking to help prepare employees for workplace readiness this essentially gives organizations the visibility into their employees wellness as well as being able to validate safety requirements for workforce re-entry all which can be surveyed or enforced on their mobile apps and today we'll be focusing on enabling just the employee health training app but just know that any of the learnings and concepts taken from today's session can be applied across any one of our out-of-the-box mobile apps and uh what we're going to be covering during this live building session is going through the common use cases that you might find yourself configuring or tweaking for your own organization okay so let's go ahead and transition over to how we can get started customizing this workforce this work flow on the mobile platform okay so i think you should still be able to see my screen but let me reshare just in case i'm sure okay so this should be better okay so to get started uh we're gonna need to enable the following first you're going to make sure that you have installed the now mobile app from your device's app store these out of the block safe workplace apps um they're available for the now mobile app um and in the previous academies we showed you how to do things like configure um pre-built experiences for my request my services um some of these that you can find out of the box on this now mobile app right and we also did things like add requests add new fields to outlets or add new catalog items um and also walk through some of the flows and use cases of what's available immediately upon enablement if you're looking to learn more about that kind of content we've uploaded those past videos onto the servicenow now community channel on youtube so if you haven't already seen this feel free to check out those videos and get caught up with those now mobile pre-built experiences okay so once you have the now mobile app downloaded then we're going to switch over to our instance and we're going to set up our environment um and so you're going to check that your instance is upgraded to new york and beyond my instance is on the latest orlando and once you've upgraded you should already have your now mobile plugin installed and you can check this if you look at plugins and the only plugin that you need to enable your now mobile app i will give this a second to load okay and then the only plugin that you'll need for the mobile web is going to be called mobile apple launcher uh servicenow now mobile app screens in apple launcher so you can see that i already have this installed and so i'm good on my now mobile lab and it's ready to be configured on my instance the next thing i'm going to install is a pre-built experience for the employee health screening right and you can actually find that plug-in inside of our store the servicenow store and it's going to be one of these apps in featured here so if i click view view more you will see the employee health screening mobile um and this actually you know having this mobile app in the app store allows us to continuously make updates you know much more frequently than our family releases so you can actually find the latest release notes uh on this stock as well as well as our product documentation okay so uh once you open this up you will just click get you'll fill in your high credentials get your instance information and then this plugin will show up on your instance plugin list if we look up employee help and you can see here that i have installed this all okay so that's uh the plugin that i've installed and once i have it installed we're all good to go so let's go ahead and hop over to our mobile device and so here you find that i have my out-of-the-box experience for now mobile i have services informations for me all this is already familiar but if you navigate over to our more tab um you're gonna see a few new apple launchers for screening health status instead of a visit okay so i'm actually going to show you a couple percentages um so um this is going to be our health employee health screening workflow and the first person that i'm going to show is uh the user that i'm logged in as for beth england who is the general employee and the other employee is going to be for alyssa the screener uh so let me show you a quick demo real quick um so uh what i'm going to want to do today is consul uh consolidate the employee health screen workflow into the for me apple launcher so that i don't have to you know see too many tabs on my number one and this for me tab has all the reports and actions that you know i would typically use in my day to day uh for my general employee so consolidating it's all into a single app launcher is going to make my mobile experience much more slicker and much easier to use right um so you know i have my typical out of the box apple launchers for services information for me uh in my uh more tab i'm gonna move some of this content over to my for me um and within this native workflow uh immediately out of the box uh from this content that was uh pulled over from employal screening some of the things you can do out of the box is uh you can pre-screen your employees by verifying their health status and compliance and before they return to the workplace they can complete some forms on their mobile app and they can get a qr code to validate on-site that their compliant lv this also triggers off some emails to send re-entry requirements so that you can keep your employees informed and connected at all times um and this mobile workflow also allows you to screen your employees and their visitors temperature or if they have any personal protection equipment like face masks before they enter the website so all this can be done on the mobile app uh and let me show you that now um so uh i'm logged in as beth as you can see or sorry i'm logged in as ben actually um so let me log out ben was my assistant admin i'm going to re-log in as beth so beth england okay so now i'm logged in as beth and now i can only see health status as well as set up a visit so um uh the first thing i can do is i can check my current health status uh but if i tap into my status here uh you can see that i uh oops looks like health ads has already cleared i'm actually going to clear out some of this data so if i check out health status and safety requirements employee health verification so i actually skipped a couple steps uh i'm actually going to clear some of this data really fast okay no that's all right so um so here i can check my status as beth typically you know i would this would show as no data uh because beth hasn't completed anything yet um but uh typically the first thing that you'll do as a general employee to get your health verification is you need to complete a health verification form to make sure that beth the general employee has met all the criteria on site and so to update this uh what i would need to do is i would need to navigate to my services and i would browse a service that is found on can we help you and there is a catalog item for health certification so this is how you kick off the workflow um and as beth she needs to read um the correct criteria that my organization has for me in order for me to be able to be on site um and if i complete all these criteria i just acknowledge that i've met the criteria and then i submit right and then this generates a qr code for beth in which i can uh show my screener who would be at the door at the location and they would scan me and get the latest information on my status okay and i can also access my qr code here too my safety qr code okay so that's my general employee uh workflow for uh health status um i noticed that there's a health verification test i'm actually going to remove that really quickly so let's i was doing some testing earlier so let's remove that so i don't cause any confusion notification okay so now if i refresh i should only see these two out of the box safety qr code my status okay so that was the workflow for the general employee but once the general employee is on the website there's going to be a site team member or that health scheme that's going to be on site to help check people in right so next i'm going to log in as the health screen and my health scanner is a list of you know so we're going to log in as alyssa okay and as a health screener um i'm going to see the screening at the launcher that was hidden from my general employee um and this apple launcher allows me to uh help me verify employees that they satisfy the health and safety requirements before entering the building so the first thing that i'll do as a health screener is i'll use my native qr code scanner and i'll scan for entry and it's going to be looking up a qr barcode i think you should be able to see my screen if i navigate over here i'm going to scan this qr code from beth and then if i do a search um when best showed me her qr code it says that her requirement is cleared and so beth is good and she's completed that form um uh and you know i can see some additional information on that as well here uh and i can configure some fields here as well if i want but uh the most important thing is i see that employee has cleared her requirement status for the day and so the next thing i'm going to do is if she wants to entry into the building i need to fill out a request entry form for that so i'm going to open up this request entry form it's going to ask who this employee is and so i'm going to type in beth and then i'm going to measure her temperature and she registers at a 98.6 and i need to check to make sure that she has any pp knee in this case she's wearing a face mask so she's okay and uh so i'll collect uh her temperature as well as her pv and submit and uh because she didn't um because her temperature is good and she's uh wearing all the pp required to enter the building her entry has been granted and this would allow beth access into the building okay uh so that's the workflow for the screener and uh if you know there's a lot of visitors and employees that are entering the building um i can quickly screen another employee with top of the button okay uh the very last workflow that i want to show is uh the uh is how you can how employees can request for visitor guest access um and i actually need to navigate back to the general employee let's do this so um this comes in two parts so let me first log in back into the general employee so i log in as beth the general employee and let's say that um you know i have a customer that's coming on site and i need to have a meeting with this customer this customer's name is david i'll need to set up a visit for david my visitor and the first thing to that i need to do is i need to complete the setup of visit form the host employee will automatically fill in my name as well as my location uh and my visitor's name is gonna be david last name i'll um i can type in their phone number uh it's not required but i can make it required if i want to but for the visitors email this is going to be the most important thing because this is going to send a confirmation email to my visitor so i'm actually going to use my work email and i'll show you the email that gets sent to this visitors company it will be service or now service uh reason for visit will be customer meeting okay and then there's a watch list field so if you want to share this let me the rest your team or your manager know that you have a visitor coming you can do that right now the only watch list is beth i can also add able if i want to and you'll get a follow-up email for both beth and abel so let's go and submit this i've now completed a set up a visit form for my uh visitor and now um this should trigger off an email often uh off my instance and that email should get sent to david.haw at servicenow.com just to make sure that this email did get triggered we'll look up my emails on my instance and it looks like there was an email sent today at 10 23 so now i just have to quickly check my email to make sure that i got it and we'll give it a second just to upload so i'm ready so let's do a refresh real quick [Music] so i'm seeing this record on the email list so this is a good sign i think it just needs to wait a second for me to receive it oh there it is okay so uh so i got an email from my help desk and you know it's gonna give you some additional information about your visitors and the criteria that they have to meet in order to visit the office so i'm the visitor david i got this email from the company um i'll read this email i'll say that i've fulfilled all the criteria here you know i'm not coughing i'm not sneezing uh and you know i'm not waiting for results on my chronograph steps and so if i fulfill all these conditions uh in order to confirm uh my visit all i have to do is email back yes as the first word in the email body so let's go ahead and reply to this and we will say yes and then send and then i should shortly get a confirmation message back from the organization's it department so let's just make sure that this email was triggered so i did receive from david and now i should be waiting a confirmation message shortly this might actually take a while so uh i can navigate back here uh once i do receive it okay um and uh once uh that's been confirmed uh the flow then gets passed on back to the wizard right so um as a visitor david who enters the building um i got my confirmation message now the visitor just has to screen the visitor and to complete this workflow i'm gonna log in back as the visitor or the screener um and the screener is going to be elicit chanel okay uh and then as a screener i just need to uh fill out this request visit entry form for them so david's waiting at the door and the screener uh where there should be a visitor look up uh data that gets populated here uh if they complete the uh that uh email and form that got sent to them earlier and so i can see that look up i could there's a data for david uh it will automatically populate these fields based on how that form was filled out and it david does meet criteria the location of this building is san francisco i'll check his temperature which also registers at 98.6 he's wearing a face mask so he's good and then we'll see and now that visitor is allowed to enter if i need to screen any other visitors i can quickly pull up that form as well with the top of the button okay so that was a demo uh of the out of the box experience for this employee health screening mobile app um and uh there's a few things that we want to do here um just to clean up this experience you know you can kind of see that there's a lot of things going on i have to click around on a whole bunch of different tabs but this would be a much easier experience if i had consolidated it all into a single apple launcher so that's what we're going to go through today uh for today's exercise um so let's go ahead and jump straight to it um and we're gonna we're first going to customize the general employee experience uh so i'm gonna log back into um beth england the general employee and i'm going to customize the experience for her okay so uh what we're going to do is um you know as a general employee on my for me tab you know i can see things like popular services popular articles my to-do's my requests um all of these things are still relevant to my day-to-day but an additional thing that i want to bring over is health status to be able to quickly pull up my safety qr code as well as being able to check my status these are things that i would do in a normal day-to-day but um and these are the most important things that i need to see in my blood um and so i'm going to consolidate these two applets into my for me landing page so i can easily uh and quickly access everything on a single screen okay so to do this there's a few things that i want to move over uh first it's odd that i have to go to a completely different tab just to submit uh health verification right so i would have to first go to services and then open up can we help you and then open up a health verification form i can also look up health verification form on my global search right and that'll also pull up the form but you know that's just an extra tap still that i have to navigate over to services to do that uh so um we're actually gonna create a url uh url applet that points to this catalog item uh and we're gonna actually uh uh move it over to the top of my forming tab um and then the second thing that i'm going to do is i'm going to take my ct qr code from health status as well as my status outlet and we'll also move it over to my forming tab uh and then the last thing we're going to do is we're going to uh move the set of a visit applet into the same tab as well and since there's four outputs total i'm going to display all of all four of these as a horizontal icon section at the very top it's best practices to only use horizontal icon sections when you have three or more outputs anymore you know i would recommend displaying it as vertical instead um and just a reminder on hierarchy in case you are new to mobile [Music] let me show you the hierarchy really quickly so let's close out of this okay so uh you start with your three different clients right for agent now mobile and onboarding and then you have a navigation bar uh actually it might be easier if i show my mobile app as well so let's actually bring this over okay there we go okay so uh i have a navigation bar here on my left and uh on this navigation bar i have different navigation tabs which are my services information for me um and within this navigation tab you can have these different tabs can represent different apple launchers or applets apple launchers are landing pages and applets are different types of reports on the applet launcher you have um different ui sections and these ui sections can either be icons icon outputs such as these or they can be uh item sections which are these things here what we're going to want to show is we're going to show them as um icon sections uh but instead of going down vertically it's going to go horizontally so that's what we're going to configure okay um so let's go and do that now uh let's start our configuration for this so um first thing that we're going to want to pull over is from this health status apple launcher let's bring over my dqr code as well as my status and we're going to create a new ui section at the top for me so let's uh first we're going to open up the apple launcher and find the apple launcher for me i think this apple launcher is called home so if i open up home home page uh the home page is for the now mobile plugin so i know that this is the right one and on this for me home page um the for me tab is called uh believe it's called oh no sorry uh each one of these sections represent these things here so you have popular services uh popular articles in my tds and we're going to create a new ui section at the very top so that i can display those icon sections so let's switch into the scope [Music] and the scope's going to be now mobile app streams and app launchers uh we're going to insert a new row here on the apple launcher section and we're going to create a new ui section for icon sections notice that there's three other types of sections as well since we are in a orlando instance you know you can't start configuring uh native charts you know for single score cards time series and latest or pa widgets there's also item sections which displays your records uh such as this these are different records and the media sections are like creating banners but what we want is an icon section uh and we can uh label this icon section uh let's call it we call it health status uh i can hide the header if i want to but i will keep it and then the apples i don't have to recreate any applets since they've already been recreated for me so now i just have to find what these applets are um and just point to it point to this icon section so there is first there's an icon section for my safety qr code and then there's a second applet for my status and then we do want this in a horizontal section instead of vertical so we'll leave it as horizontal and then since this is my general employee i don't need to apply any roles here and then i'll submit uh i'll click this check mark to save and then we'll save the apple entry as well so now if i go back to for me and i refresh this i have my safety qr code as well as my status um the third thing that i want to pull over is set up a visit that's also relevant to me as a general employee right i can set up my um uh this is to set up a visit for visitors but also have set up a visit for myself which lives on services so let's actually move up set up a visit first and then we'll move set up a visit for employee after so we'll go back into this health status ui section and then we're going to bring over a third applet for um set up a visit it should be called setup with visit and then we'll save here okay so now if i refresh i should see that third icon output and there we go okay so the very last icon applet i want to show is on this is um if i navigate to services i have to open up can we help you and then open up health verification so why don't we actually create this as a url output as opposed to opening it as a catalog item office services so let's go and do that now um uh but in order for you to understand this hierarchy i'm gonna need to show you uh what's happening on the back end on now mobile so i'm gonna duplicate this tab and i am going to show you um uh the back end tables for this structure for services so first um you know our we want to find health verification catalog item off of browse services so let's open up the browse services applet to see what's going on here we'll look up browse services okay so it looks like there's three different browsers and they all live on now mobile web but the description here is this is the parent so i'm going to assume that the browser's top level view here is this one okay so i'll click into this this will take me to the list screen which is exactly what we see here this is the list screen for ground services um and inside of it uh we have to in order to navigate to can we help you this service is here we have to continue clicking into the backend tables um let's review the hierarchy uh deck really fast just uh in case you're new to mobile i'll explain item stream segments and so forth so we'll navigate back to this screen um whoops here we go okay so um let's make this a little bigger and that should actually expand this okay so um you have your clients we want to build inside of now mobile app and we want to be able to configure the navigation bar from the enamel blob if we go further you can then specify you know what tab that you want to configure on that navigation bar on how mobile and then once i have this tab you specify the tab whether you want an apple launcher or an applet the apple launchers are landing pages right applets are different types of screens and reports so i have an apple launcher for for the for me tab and within this apple launcher contains uh an applet and the output that i have is a list tablet uh so let's actually go to screen number eight uh oh and just to help better explain it with screenshots so these are navigation tabs right on the now mobile app the apple launcher is the landing page itself and then if we go to ui sections these are the different ui sections within my landing page for the apple launcher and now these are this is kind of this is a different applets that live uh on my mobile app um this specifically is a form screen um but you know i have list screens map screens and so forth um what i'm trying to explain is the item stream segment so on a list screen uh you can have different segments and this allows you to control what type of data that you want um here you can see that this is a list screen that contains two segments the first segment for open instance and then this close segments for closed instance so you can you can control the conditions of the same table um using those segments but you can also see that i have work order tasks as well as instance so you can bring in multiple tables within each segment as well the item stream is uh what represents which data so i can have an item stream for instance item stream for a request item stream for cases we dig further um the item stream contains the date item and the data item controls your conditions of those records um and then you get to your master item uh if you click into the segment and this the master item uh basic controls what fields are displayed on your list item um and you control this with the item view json okay so this is all um i've we've covered uh this information on previous videos but this was just a quick reminder and refresher highly recommend checking out the mobile app recordings in case uh this is confusing we dedicated a couple of videos the first two videos covering the mobile hierarchy but now that i've explained to you the master item this will help explain what's going on here on the back end so i've opened up the list item for browse services and i'm trying to navigate to this next screen and when i click on can we help you so to navigate there i have to open up the master item for for this browse services right each one of these is a different master item um and on this master item i'm i'm expecting a navigation function that takes me to a different screen and that allows me to get to this services screen so let's go and do that now i'm going to click into the item stream segment into the item stream and now into the master item okay so there so as i was expecting there are a couple functions based on the conditions where it navigates to next um instead of navigating to the next category i want to actually navigate to the catalog item itself so i'm going to check out this function that takes me to the catalog item and then this navigation function uh we'll open this up here and this navigation is taking me to a screen called services and that's exactly what i was expecting so if i tap on can we help you it takes me to services which is another list output so let's keep on navigating uh on services i can open up services and then um i'm gonna open up continue navigating to the master item and then here uh it then opens up uh my catalog items so if i want to open up um health verification form what is this url that's opening this up um and i'm expecting there's some sort of dynamic url from the mobile mesp mobile experience service center employee service center sorry um and i'm trying to grab the url off of this catalog on it and in order to get that url um there's a new another navigation that takes me there so let's open this up and let's check out this function how does it dynamically open up all these different um catalog items we'll open up this function and here is the url for it so it looks like it takes you to the mesp the mobile employee service portal and it takes the sys id of that catalog item so i'm going to copy and paste this link url and we are going to copy into our notes to save it later and so the next thing i'm going to do is i'm going to open up my employee service center and i'm going to find health verification there should be a sys id in the url so if i look up health verification there is the catalog item here and now in my url there is a sys id that points to this this id here i'm going to copy this over and with the url that i had earlier i'm going to hard code this so that i can create my url output so all i have to do is remove these brackets remove these brackets and then paste into this id so now i have my url so now but back on mobile we're going to create our url output now that i have my url so let's go and do that now uh let's create a new applet and again just to remind you what we're doing is on the for me tab i'm going to add a fourth url applet that opens up that catalog item so let's do that now we're going to create a new applet uh browse screen is the url url type applet uh let's name this um the catalog is called health verification uh the icon we'll use this url icon we'll use one of the iphones i'll explain your icons in just a second and then url we're going to paste the url that we hard coded okay so now if i submit i now have my url output done and now i just have to associate it to this ui ui section so we're going to open up um uh the for me tab again and we're gonna associate the new icon outlet that we just created so let's open up apple launcher uh open up i think it's called home home page home page the scope is now mobile uh and then we created this health status ui section here and we'll give it a second to load and then uh for applets i have three so far let's add the fourth one for uh what they call it it's health verification and then we'll save okay now if i refresh the mobile app i should see my health verification if i open it if i tap on health verification it will take me to that form so now i have all the things that i need to do as a general employee for the employee health health status stuff right instead of having go to a different apple launcher and then opening up this app launcher just to get to my health status i now have it all consolidated into a single screen um and so now you know this apple launcher has all my things that i i would typically do in that day-to-day i can pull up my safety qr code i can check my status if i need a set of visits for visitors i can quickly do that here and then if if i need to fill in another health verification form which is something that i typically need to do daily uh i can do that here okay um and now uh the next thing i want to do is actually create the apple launcher for the health screener so i've completed one persona now the second persona is for the health screener um and you can see here that you know i don't have that screening apple launcher because it's restricted by role um and only uh only alyssa chinoi is able to see that apple launcher so let's actually navigate to our second persona um and if i don't need these anymore i can actually remove it from my client if i want to let's move on to the second person the health screener so we're going to log in as alyssa chinoy the health screener and then for alyssa chinoy you can see the screening apple launcher it already has all of my applets that i have um and i actually don't really need to do anything here right uh it already has all the related information that i need to do as a screener i can screen my general employees i can screen my visitors um and i can screen their qr code here as well and then if i need to manually look up uh different employees and visitors in case they need to re-enter the building or something you know i can quickly look up beth england and do that here as well so i don't actually need to consolidate anything here it's already done for me um but you know this is kind of a plain and simple apple launcher let's actually um uh kind of configure uh the landing page so it just matches our organization's brands and colors a bit more so we're gonna cover some of the ux practices here so just make this landing page look more like a custom landing page um as a standalone landing page let's add a media section to this um and the media section is like a banner and maybe it helps you brand your landing page so uh let's open up this landing page for health screen employee health screening so i think it's yeah employee health screening and it should have my four outputs which i can see here okay so i currently have an icon section that's going vertically i can add a media section at the very top just to use more of that white space so let's switch into the scope employee health screen notice that there is a role for this apple launcher and that's the reason why the general employee can't see it we did associate the monitoring monitoring user role to elicit chinoi and so only users with this role should be able to see this specific landing page it'll be hidden for anyone else that doesn't have this role so let's create that media section now we'll create a new section we'll change the type to media click okay i will call this health screen uh the headline let's call it um let's call it employee health screen and then the description can be the four employees enter the workplace verify their health by screening for elevated temperatures and this is the image that i'm going to use for the image you just have to attach the make add an attachment so we'll choose our image file we'll use this one and then once it's attached you should then be able to see it on your image field which is called media0 you can add functions to this so if you want it to navigate anywhere i don't have any actions uh or use cases for this banner so i'm going to leave it blank but just know that you can have your end users click on it and it will navigate to different screen or maybe even a different url okay so let's go and submit um we'll click this check mark to save we're going to set the order to zero so that it shows above this icon section and then we'll save this app launcher um and then uh if i do a refresh now i have a media section with an image i have the description on what this landing page does and now my screeners know exactly what this landing page is for and that you know this specific landing page is specifically made for them um just a few other things that i can do is i can customize these icons um you know they're they're gray they're grayed out let's actually um make them so that the icons match the color a bit better so to change icons on applets typically you can do it in mobile studio but since all this stuff is built on now mobile you actually have to do it on the now platform ui so let me show you how to do that so if you open up an applet we're going to look up the request entry applet and here's the icon that they used so we'll just open up the icon and these are the colors and background colors that they changed um and here you can change the font names and shapes as well if you need to if you want to know how you can customize your icons there is product documentation on this so if i open up product docs and i will check out orlando on the left side there should be uh docks for mobile icons and to see that all the different icons that are support you just check it out here um but all i want to do today is i just want to change the values so that they aren't gray so uh for the font icon uh i'm going to use your cy style we'll do this one here so let's do background color this and then the font color will be this we'll save and if i refresh uh you can now see uh that the color of the icon has changed i think uh let's choose a different background color just make sure press entry font color background color let's double check uh we're going to open up the request entry so i'm going to troubleshoot my apple real quick to see why the icon color is not changing so i have my url output and this is the icon that's attached if i open up this record i should be able to change the font colon back and color uh alternatively i can use an icon that already had pre-built out of the box so let's use a so another thing that you can do too just to make sure that you know your icons and colors are supported if you open up studio typically we manage our icons and colors through studio right and when you create an applet when you create an applet you know this is where you control your all the supported icons and colors here i was trying to do it through a manual process and maybe one of my configs is off but you know if if you want to make sure that this works i'll choose one of the supported icons here let's say for the request entry we want it to be this icon and then this color blue and then we'll call this test and this will be a list applet i'm going to fill in some data real quick just to have just to use i'll call this test table and i'm just using this as a template so that i can pull over this icon so i'm gonna look up test and then we'll save okay so now i'm actually gonna look up test icon uh this test applet so if i open up applet and then i look up my test tablet the list screen test so here's the icon it's called icon edit let's actually change open this record and let's call it for request request entry icon and then we'll save okay now if i go back to my applet for request entry oops i'll click we'll find the request entry output switch into the scope uh we'll select the request entry icon then we'll save and this should be able to change the icon as well there it is so now you can have that icon that we created okay so that was kind of just a quick uh overview on some of the us ux best practices and things you can do to help your landing page stand out more and look better um and so here i uh just to quickly summarize we created a landing page for the employee health screener right and this screener is for alyssa chinoy but i also created a second persona for the general employee as well by log into the general employee for beth england we also customized the out of the box for me um apple launcher so that i have all of the uh um call status uh reports uh quickly accessible to me all on a single screen and of course you know i would apply some of my ux best practices here as well you know change the icons and colors of these so they have better matches i would add a media section and if there's any applets here that you know aren't relevant to me or i want to remove i'll just simply uh take it off of this landing page okay so that kind of wraps up what i wanted to show today um uh we are at the top of the hour but we'll uh we'll stay for another 10 minutes to help answer any questions uh that came up along the way uh food are there any questions that we want to highlight from the audience yeah that was a really good question about um well actually there was a there was a really good concept that you touched upon is basically you've taken and an out-of-the-box application and one of them is called browse services and as you if you notice that browse services has some drilling capability so it goes down to a particular catalog it goes down to a particular item and if you reverse engineer it there are like navigation functions now that can be intimidating at first but if you know the schema the structure of it you can basically extract anything and add it and create your own experiences right you can what does what david has did he just added a and then uh an item a url applet and just extract it and put it there this is why he hard coded the sysid so if you're very comfortable with that kind of environment feel free to do it it is possible so and the other question was about record producer so one question was can i remove the template the temperature or ppe can i customize my field so we recommend that you don't do that because you also have to make modifications to the scripts and then of course there are tables and they're probably business rules um that gets uh executed so we don't advise you to do but if you if you want to it's possible right it's something that you can't do just know that you know you might run into collisions uh when you upgrade because you know this is in the service on store and they do make updates to that app every two to three weeks um and so if you're able to handle those upgrades um you know it is something you can customize with with our with the platform um and just to give you an example of how you can customize this um if you open up the service catalog for example uh let's say i wanted to customize my health verification form right uh i would just look up this service catalog item um and i know that lives on can we help you and it looks like it's this health verification form here you know i can easily uh if i go to edit configure item i can easily change the description here uh short description and you know kind of whatever that you can control here all the things that you can do one quick fix is you know probably a probably a common use case people run into so when you look up um health verification you'll notice that there's no image here and it's because this record isn't using a picture but if i change into the scope um i can quickly add a picture uh here uh and if i choose the file i think i already have an image ready test image open click ok we save right oh whoops not insert oops hopefully that didn't do anything but anyways if i refresh and look up health verification there's that image so right there's a lot of things that you can tweak um but there's a lot of things that you can customize and tweak as you can see here but again the only thing to consider is you might run into those collisions uh when you upgrade okay um any other uh things we should highlight food yeah there's another question i just came through about the applet icon color that wasn't changing and you had to do it in mobile studio um do you know what was the issue there yeah so um it's possible that the icon that they were using wasn't supported and so when i was trying to configure it it just wasn't working but what i would recommend is best practices use one of the icons from mobile studio and then just attract that icon and then use that as a template that's what i would recommend and then you should change you should be able to change the icons and the text and background color as needed and all the supported icons are on the product docs right so if you look at mobile icons uh you can find more information out here i had to speed through it just because we we're running on time we have another question can you change the qr code screen to have date and person name on that screen so the oh for the q this screen this or the scan um oh the scan i need no no i think she i think he uh he or she meant the screen uh no i think uh that is that's out of the box and that's actually displaying that qr code is actually reading the it's generating the user id not this user sys id it's actually user id so uh i'm not sure how that's done and out of the box but that i mean we can if if we know how to figure that out like uh how how that's actually done you can actually like append the values um but it can only only scan one or display one value so you can have it like some sort of json if you wanted to have multiple key value pairs so i think this is a ui page and this qr code is simply just pulling the sys id of the user so if i were to scan this qr code right now i'm logged in as beth england uh and i actually yeah if i'm logged in as about england when you pull up the qr uh reader uh it will just manually input um beth.england which is the her user id and then i'll look at the record on beth and i can show that really quickly just as a reminder so i log in as um my health screener elicits annoying uh and then ids screening scan for entry i think i have the qr code on this word doc see so yeah it looks up the i think can you see my screen oops oh yeah sorry okay so yeah uh i don't know if you saw the scan but yeah i scanned the qr code and it manually populated that payment if i do it it'll look good so you notice that the qr code is a string so if you want to add like date and person name you have to you have to embed that value into some sort of json and then stringify and then on your qr script you would have to figure out how to parse it so it's it can be done it's just a little bit more scripting yeah any other questions uh there's one one just came through is it possible to have different health scripts for different jurisdictions um that's a good question that's probably a question for our bu um so any other additional you know uh questions can also be submitted to the um uh committee page that they have so they have a community page called uh safe workplace app suites and they actually have their bu developers um that's monitoring the uh that page so i'd recommend posting that um questions there and hopefully someone from that team should be able to help so we aren't actually the bu experts of this app uh we uh we kind of just generally know the mobile platform so we aren't able to know that that's possible within this bu at this time uh but yeah definitely post it on the uh safe fourth place app suite community page someone there should be able to help you okay uh sweet okay thanks everyone um so one last thing i want to cover uh while i still have you are additional resources um so first you know we have our developer um or some additional resources to get started in case you are new to mobile um so first we have the developer site as well as the email learning site and this covers all the fundamentals from mobile and how to think about it if you are new to mobile we give you a test instance and we give you hands-on training as you make your way into becoming a mobile expert so definitely check that out if you're completely new mobile we also have mobile community where you can access our faqs articles and ask questions around your mobile implementations and our internal mobile teams are on this quite frequently so this is a great place for you to share feedback and ask these questions and of course is uh we have the mobile app academy our youtube building app building series um and you can watch our past academies on the now support youtube channel uh and yeah continue to join us live uh we're continuing to have this every two weeks on tuesdays and if you uh check out our community page uh we'll have the latest updates there as well and then of course party dots where you can read the release notes and new features uh and then idea portal uh this is if you want to share with us any enhancements to the mobile platform um that those get sent straight to our backlog and we kind of further discussion from there okay so that wraps up everything that i want to share for today um thank you everyone for joining us today uh we will have this recording up in the next few days uh but i hope that you found this session helpful and informative and if you have any uh questions further from sing feel free to keep posting on our community site as we continue to explore other configurations and feature academies so thank you everyone for joining us and uh hope to see you at the next academy bye everyone