good morning everyone and welcome to the mobile app Academy this is our Live app building Series where we show you how to build and configure mobile apps on the platform my name is David ha and I'm an outbound product manager here at servicenow and I'll be your host for today's session and want to give you a warm welcome for joining us live here today um if you are joining for the first time uh welcome to the session our product experts are here to provide guidance best practices and answer any questions that come up along the way and we do host these academies every two weeks at 10 A.M Pacific and our recordings will be posted to YouTube as well as the servicenow community Channel just pointing out a few resources that we do have available um if you're new to mobile we recommend that you check out some of our self-enamed resources such as our mobile guidebooks white papers on the community site but we do have a plethora of other resources such as our mobile training on now learning as well as the playlist to all of our previous app academies for sessions like mobile agent quick start guides getting started with now mobile and many others um also if you do like sessions like these our servicenow teams do host other academies for HR Service delivery platform Foundation platform analytics virtual agent and many others and you can find all of these in their respective Community forms by navigating to those form tabs but to get started I do want to remind everyone that this is part two of three in our skill building Series in which we show you how you can learn and build your own custom apps from scratch and again this session we're going to be playing a pre-recorded video due to the fact that there are a lot of moving parts and had we just gone this tried doing this live it would probably take two hours per session and so to consolidate we wanted to be able to capture everything within a 50 minute recording with three videos and so we are playing a pre-recorded video today um but we are still going to take any questions that come up a long way so definitely feel free to reach out um but for today's session we're going to be doing a deep dive into functions and we're going to be covering things like scripted conditions scripted variables uh when to build a global function versus uh using record context how to enable search list on some of those parameters and then being able to apply UI rules to your actions and so this is a more advanced session for functions so if you're looking for more basic function uh configurations you know those are available on some of our past academies as well as the now learning training um and then you can find them product docs as well but what we found was you know there aren't as much documentation or content out there on kind of some of these Advanced use cases so we wanted to dive deeper into these topics okay and just to remind you this week um we're gonna be creating functions that allow your agents um well actually let me back up um again this is continuing our custom skills management app which in part one last week Ian built screens that showed us a list of our agent skills and skills that that agent might not have and this week Ian's going to be showing you how to create actions that allows your agents to be able to update and add skills to their profiles so you know if you have agents who are currently learning or maybe they're getting coached um they can actually use this function to add skills to their own profiles after their training is complete okay now the the point is with this is um we want to be able to teach you the fundamentals of being able to build these Advanced functions uh with your own mobile apps so um we are going to be posting an article with the update set so in case you wanted to reverse any engineer any one of these configurations or if you know you just want the data to help with your training we'll make that available for you okay um and we are building this on a San Diego instance and so this will also give us an opportunity to highlight any new features that come up along the way as well but with that being said let's go and get started um we'll jump straight into it and I will now start the replay of the recording let me share a new screen here okay all right so where we should be after the first session is to have a Mobile screen looking something like this with three UI sections skills team skills skills I want if you don't have that that's fine as David might have mentioned we have an update set that we created after our first session so just go find the first session on community and download the XML update set from there and apply it so now let's talk about adding some functions to our application and functions very simply are what are going to allow users to take actions within the mobile app if we talk about functions we need to talk about the fact that first of all there are different types of functions actions probably the most common where you know something like if I don't have a particular skill and I want to learn that skill or identify to my manager that I already have the skill then I can tap a button that's going to execute some kind of code like create a record update a record to lead a record and so on we also have navigations those allow the user to transition from one screen to another so for example if I'm looking at a record and one of those Fields presented on the record screen as a user I can tap on it and you know a navigation take me to a view on a separate screen of that user smart buttons are specifically engineered buttons for functionality like starting a call or GPS or message out of the mobile app next we should really talk quickly about function context so record context means that you need to be in the context of a particular record so again if I'm looking at my Oracle Financial skill that somebody on my team has and I don't and I want to learn that that particular function would need to have the context of the skill or the record in that case Oracle Financial whereas Global functions those are functions that can be executed anywhere within the app they would typically be added as a quick action at the top of the screen on iOS or at the bottom floating icon in Android where I can create a record like an incident would be a common use case identify them on shift or off shift those types of actions can happen from anywhere so first let's look at a global context function where we can add as a quick action here at the top of the screen for a user to submit a new skill to be added to the list so let's go ahead and open up mobile app builder and from here we're going to again select our skills management scope skills management mobile scope we're going to click on functions and create a new function and we can call this perhaps a new skill submission this can be just a descriptive name won't make be the label for a button that will configure on our function instance um it is going to be an action item and as we talked about earlier it's going to be Global context so from here we're also going to need to create an action item now the action item is what is actually going to perform the change on the system action items can be parameterized meaning there are some inputs for the user to complete as part of completing that action or non-parameterized meaning I can tap a button and make a change to the record and the logic is all implemented in the background hidden from the user now our function is going to be to create a new skill so we're going to need to collect some information from the user like who needs to approve it what's the name and the description of the skills so our function is going to be parameterized here so let's create a new action item and we can call it our new skills submission action item and in this case we're going to want to create a new record so we'll select new from the type for the table we'll use the mobile skills submission table that was created as part of our first session we'll skip over field values for now this is where we're going to apply the data we collect to the fields in the new record but we'll go first to actually create the form to collect that information so we'll click here on new for the input form screen and we can call this a new skill input form or just new skills fine and we can scroll down and we're going to need to find first of all just to let you know you can select for an individual page for each input so it's essentially going to make someone like a wizard like experience for the user or we could create a page and identify you know maybe two or three inputs or all inputs to be on that one single page so let's just leave it as default and then we have inputs and variables inputs allow us to collect ask questions essentially and variables would allow us to pre-populate values on our inputs and we'll look at how to build those and also how to script those which is a new feature that's available since San Diego so let's go ahead and Define some inputs the first one is going to be a skill and our label should be skill actually I'll give this a lowercase s and this input should be mandatory it's going to be a string we don't need to give it a page for input attributes since it's a string we can just leave this as it is and we'll give it an order just so we can make sure our inputs appear in the order that we want and then next let's identify also a description for this particular skill so we'll go back to our input form screen scroll down to the inputs again select new and we can call this one the description and give it a label of description and this one as well is going to be a string we won't make it mandatory we'll give it an or of 20 to order it after our skill name and again we'll skip the placement we don't need any input attributes because it's a string however for a slightly more complicated complicated type of input let's scroll down actually we'll choose our approver first before we go into the skill and description so for this one we'll give it a name of approver and a label of approver in order to have that question appear first we'll give it an order lower than the other two inputs we created and this particular one we're going to have as a reference so we'll select that because it's going to be a user from our user table and we're going to create a variable to autofill that but first let's just finish creating our input very important for reference inputs to give it a source table and a source field name so what table is this input where we're going to draw the data from essentially and what field in that table so let's select our source table don't need to really remember what those properties are anymore we can select them from a drop down which is nice so we'll do the source table and since it knows it's a table it's going to give us our table picker how much is our mobile skill submission table and secondly we'll click back on our input and we need one more attribute which is going to be the source field name we can select our table again just to allow us to easily select the field which in this case is going to be in this case we'll just use the assigned to for the task so that we can just simply create a task for the approver um who is going to review the requests for the new skill and create it if it's appropriate to be added so let's go ahead and save at this point next what we're going to need to do is add those inputs to our action item so that we can set the field values when the user submits Taps on that button so for example we can set our assign to to be the approver and we can set our short description to be something like a new skill submission and add our skill name here so it'll look like this and we can add our description as well let's go ahead and save this and let's take a look at our function as well and we might as well go ahead and add some messages here um or at least the success message um like a new skill submitted um pending review and then next let's quickly take a look at how that's going to look as a quick action within the mobile app so how we're going to add it we'll go back to our main screen and mobile app builder we'll go back to our screens and look for that launcher screen that we worked on last session so for example in this case the skill launcher screen and we're going to scroll down and look for our quick action function instance so you likely won't have anything here and we can click new and input our new skill submission we'll give it a display label like submit new skill in order in case we had multiple functions up here and we can also choose an icon I'm going to go probably with the plus icon just to keep it simple and then scroll down a little bit and choose the function that we added and we had called that new skill submission all right and click save now let's just do a swipe down refresh and we should see our action quick action appear at the top of the screen right here so let's quickly test it out so it's asking me the approver again asking me to give the skill name and asking me for a description foreign now I notice that this isn't capitalized it doesn't look that great um so let's just click back over to our function which we can get to easily from here and that name is coming from our input form screen name so let's open that up and capitalize these and Save cancel this swipe down refresh and start it again I noticed that this skill isn't mandatory here either so let's look at that input and make sure this mandatory is selected refresh again now it's mandatory and we have our description there now if I go back I also don't really think it's the best experience for the user to have to select the approver so I think it would be a lot better to select to have the system automatically populate my manager and if I need to then I can select another person but why have me choose my manager each time so let's take a look at how to do that so let's click back into our input form screen if we scroll down we can see our inputs here and obviously one of the one of them is the approver in order to auto set an approver we're going to have to use a variable so let's click new for variable and we can call this approver variable and here it would if I needed to select the current user that would be really easy I can just select user and it's very simple however if I want to get my manager I'm a bit stuck here because I don't really have a database field I can use off the record I'm creating this is a global function and so I can't you know pick you know the user dot manager from a database field um and a constant isn't really going to work because you might have a different manager than me so we're going to use this new script variable type that's new in San Diego it's not going to show up in mobile app builder here off by default into Mobile app builder is updated to reflect that new feature so in order for us to use it we'll just save this record and we'll click on the overflow menu here and open it in platform and from here we can select from the drop down scripted and for a scripted variable it simply needs an attribute with the name of script and what that script is going to look like let's first right click save here so we can open it it's going to ask for a script value here so obviously going to be hard to you know write a whole script in the value so what we would typically do is create a script include and then invoke that particular function from here so we'll come back to this later after we've created our script include so we'll go to script includes in the system under system definition and we're going to create a new script include that's going to pull the user's manager and return it now I've already typed the script out just in the interest of time here but let's take a look at how it's created well what I set up is one script include called scripted autofill I named it something generic just in case I have other variables within my app that I want to add functions to I can simply add to this file without having to maintain a separate script include for each case so if we open this up we can see that we have a script within our scope it's called scripted autofill give it a description you can make it accessible from all application Scopes if you have another scope possibly where you might need to invoke this function from and um let's take a look at the script itself so again we only have the one get manager sysid function in here as we go through creating our app we could add more and when we update the script variable we just referenced the appropriate function so in this case we are setting a variable called user ID with the current user assist ID and then we're grabbing that record from the user table and we are creating a return object which is going to have this reference input value um value and display value format so that the mobile app can know what to pass is the actual value and what to display for the value we're going to take that user Dot manager.sysid and for the display value we're going to get the display value for that particular record it's pretty straightforward here um the next thing that we're going to need to do is back on our variable attribute here we're going to actually invoke that particular function and to do that we're just going to as you might imagine type new and we'll we need to copy the name of our scope which in this case is for me is X underscore snc skilled management mobile and then Dot and it's going to be the name of our script include which was scripted Auto fill Open Bracket close bracket and then Dot and the function name which was get manager sys ID and we'll go ahead and update this and let's again go back to our variable and make sure that our script looks okay so this looks good to me so let's flip back to our mobile app again here and do a swipe down refresh let's try our function again now if you invoke the function again and it has an auto filled the user manager like it didn't just now for me a couple things to check so first you'll want to make sure that the user that you're logged in as has a manager identified on the record obviously and then next just pay careful attention to the function name that you select this whole string needs to be exactly entered correctly and so if I go back and look at my script includes copying paste here is kind of your friend because I have a feeling that I had ID here in uppercase and my function and back in my scripted variable script attribute I did not so let's fix that and save this cancel and refresh on the mobile app and now we have the manager automatically selected by default but what if we wanted to make our form a little more dynamic well with mobile UI rules we can hide or display fields on an input parameter screen make Fields mandatory or even perform field calculations so let's take a look at a simple example for our create new skill function where on our input parameter screen we're asking for the skill and description let's for example make it so that if it's a network skill we're going to require the description is mandatory whereas if it's not the description can be optional so when it came earlier to mobile UI rules on a mobile view or a card we can do those we showed doing those within Mobile card Builder for the forms we need to navigate over on the platform side to mobile UI rules and we can click new here we can give our rule a name like uh description required for a network skills and for our condition we're going to need to refer to the specific input name not the label on that particular parameter screen so if I tap next in the mobile app we're going to go after the skill input so if I look in mobile app builder and find that particular input I can see that its name is skill with a lowercase s so I'll click back to my new UI row here and we could say something like skill like Network for example now for a table from the drop down we're going to select the parameter screen and then we can select our parent and it's going to pre-populate the table for us allowing us to just use this lookup and find the particular function actually rather the functions input form screen on the action item which in this case we call new scale so we'll select that for a triggers because we want this change to be um this trigger to be unchanged when the user enters a skill that has that name we're going to need to we'll keep on load but we are going to need to add on change as well we can give this an order so if you had multiple UI rules the system knows in what order to apply them and in this case we'll check reversive false that should be okay so far so we can right click save and then we'll be shown our related list with the mobile UI rule actions so we'll click new on that list and first you're going to want to look at the operation so here what we have available are these options we're going to select mandatory and when we do that the Target Field is going to automatically populate with our inputs we have tied to this particular screen so in this case we want to make the description mandatory and we can give it a value here of true so if that condition we set is true then the description is going to be made mandatory so let's let's submit this and then on our mobile app we'll refresh again and we'll tap to open up our function move to the next page with the skill and we can put for example fiber Networks click next and we can see our description as mandatory but had we said something else like IBM Mainframe in this case when we tap next the description is not mandatory so that's just a simple example of a UI rule but very powerful what you can do within your forms okay so we now have our create new skill function built out pretty nicely we can test it out and end but before we do that and move on look at our app and other functions that we'd like to have I want to show one other cool feature that we can do as well so if you notice here I've tapped back into the function and we have our selection of the approver which is just a straightforward simple list of names based on the display value of the assigned to field on the task table what we can do instead with reference fields and it looks way nicer is to use an actual card for each of the elements in the result set so for example if I tap back and view the team members of a team here think something like this type of view would be a lot better for my results so to set this up we're going to first look for a card that's available on the system that is set up to show data from the user table of course you could also build your own template and card but to save time we'll just pick an existing one so I'm going to head over to my view config or card table which is sys SG view config it's probably a good idea for this table for you to add it to the favorites if you don't already have it there and let's refresh try that again that's better okay and um we can show make sure you show on the table on the list rather what table it's for so that we can filter by the user table and we can see that we have four results on this particular system if I want I can add the application field to this so I can see where it is and I noticed that I have the people AI search result available on in the now mobile application so you probably have this so let's just copy the sysid for that and then once we do that let's go into Mobile app builder and we'll look for our approver input we have here remember we set up those two attribute input attributes earlier in order to point it to a specific field so in this case we're going to want to use different attributes for the mobile view card view um so if I select the first input here and look at my list of properties I'm going to first select the mobile view ID and here it's mobile app builder is going to want to give me a list from my existing scope and I don't want to use one of these so what I would suggest to do here is just select one and Save and then just use the overflow menu open in platform and you'll notice that it's actually stored on the record the sysid of that particular card which we copied earlier so let's set that and once we have that done we can drop back into Mobile app builder and we'll select the source table which we also don't need anymore and we're going to instead change to the Target table input attribute and from here it's going to give us again the table selection and we just need to select that user table directly so we'll just find that and select it and save that and if we wanted to there are other input attributes we could use as well which will improve the functionality even more so for example if we wanted to we could add a condition here to the query like active equals true save that if we click back to the approver input and new again we could also add enable search which is also very handy because it's going to basically reduce the amount of scrolling that the user has to do to find a particular person from the list so let's save this as well and once that saves let's head back to our skills screen refresh and open up our approver our new skill function rather and we can see the function the approver input has been replaced by this user view which looks a lot nicer and we can also search to easily find a user as well and just to make sure this is all working let's tap alien to selector click next testing out and submitting this function so we can call this our new test skill and for the description you can just put in something like just testing our new mobile skills management app submit this and that was submitted successfully now to round out our app we're going to need a couple other functions added here for example in team skills I do not have we're going to want to have something so that so that our mobile user can tap to a function to indicate that they either want to learn this skill or maybe that they already have the skill and they just need the manager to approve it so in order to do that let's take a look back at our screens and we'll find the team skill screen should be a record screen right here and here let's select our details screen scroll down and we can see we have a section here to have to add footer function instances so if we create a new one here we can call this our um I want this skill function instance and we can say learn skill has the display labeled we can give it an order of 10. and scroll down and here we're going to create a new function which we can call I want this skill function it's going to be an action item it's going to have the record context this time because we want to take that skill and you know use it to create the mobile skill submission task and we can identify the table we want to pull from should be in this case cmn skill which is the skill table in terms of the condition we'll come back to that later because in order to make this work the best we don't want the button to appear anymore after the user submits the skills so we're going to need some type of check here to you know look into the database see if there's already an active uh skills submission task for this user and this skill and if so hide the button so we'll come back to that in a minute for a success message we could say something like skill added to your list and we might as well jump to the previous screen grief so next we're going to create the action item for this particular function so we'll click new here and we can call this I want this skill action item and in this case we're going to click new for the type because we want a new record the record that we're going to want to create is going to be in that mobile skill submission table and we're going to set some values here we'll come back into that in a minute because we're going to need to create a couple variables to facilitate this um so for the input form screen let's choose new there as well and we can call this I want this skill input form screen and here we don't need anything at this point for other for inputs we don't need because we already know which skill you were on we just need to pass that over to the action item so that it can create the record and identify the appropriate skill so we can click new for variables and here we're going to want to create a couple variables so one is going to be the skill so we want to be able to store or make available to the action item the particular skill that we're on so I'm going to choose database fields for the variable type and for the variable attributes we need to identify the field so where we're gonna we're gonna select field name here selecting the table again will just facilitate the selection of the actual value which in this case is just going to be the sys ID of that particular skill so that's the first variable that we want to create we'll click back to the input form screen create a second one which is going to be just one to store the user that is submitting this so this one here is going to be variable type user so let's save this and then we'll click over to our action item and then now we can start to populate these field values so the first thing we're going to want to do is for our type fields will select from the drop down learn skill because that's what we want to do we should also set a short description for this task so we can just say something like learning skill for the state let's set a state for the task to start us off and here we've got a couple State values we've added we'll choose learning skill the most appropriate and we're going to want to assign this task to the current user and this is where we're going to select that user variable that we just created and then lastly we want to store the skill that we have selected and we created a variable for that as well so let's save this and at this point we have our function instance and our functions so we see our nice new learn skill footer function and if we tap that we should see that the function submitted successfully and the skill was added to the list and also we can now see our skills I want list um that's now starting to populate now as I mentioned before there is one other little thing we need to clean up with this function which is if I was this user and I was right now to tap back into sap Basics I still see learn this skill here and I don't want that to be there so what we're going to want to do is go back and look at our function and our condition here and build a condition that will hide that button when this submission has already been done unfortunately we can't just select something off of the skills table there's nothing here that's going to help us to from a declarative condition type perspective so instead we're going to need to use a script and again rather than type the whole script here what I would recommend to do is just head back over to the platform View and create a script include we created one in the last session that we can leverage and that's called mobile condition helper so we'll include that in the chat and also with the recorded video if you're watching that rather than have you type all this out let's just quickly review what it does so in this script include we have a couple different functions that I've written here one is is I have this skill visible and the second is I want this skill visible and so taking a look at what these functions do essentially they're going to perform a local function call to a separate function first of all that's just going to check firstly is there a Mobile skill submission in review for this particular skill and if there is a mobile skills submission then it's going to return false meaning the button isn't going to show if there isn't a mobile skill submission then we also want to check does the user actually have this skill and so if they do have the skill then again don't show the button they don't need to learn the skill they already have it otherwise we would show that particular button both of these functions work in a very similar fashion one is just to support our function for if the user wants to learn the skill and the other is to tell the manager if they already have the skill so since we're working on learn skill in order to leverage this condition this function as a condition we're going to just first let's copy this API name and then for our script we're going to have JavaScript and then new and then we're going to paste in that full API name and we're going to just go to the end here and once we're at the end We'll add a Open Bracket close bracket and then Dot and then we'll check our script again and just copy the function name and add that to the end and then in here we're going to need to pass in the current object and we'll end that line with the semicolon so let's save and if this has been done correctly when we refresh here we should see that button disappear and if we were to select another skill that the user doesn't have we see the button so so far so good now at this point there's a lot more functions we could add to our app here but just to round out a version one let's add one more footer function here as a secondary button so we can see how that part's done so what we're going to do is Select again our details screen find our footer function function instances we're going to add a new function instance and this one is going to be to let our manager know that we already have this skill so we just need to them to approve that and add it to our list so it's going to be I have this skill function instance and for the display label it could be something like I have this skill and we can give it an order of 20 and what we're going to want to do is find our button emphasis color and here's where we can choose a primary secondary color based on our theme and we can also select destructive color so think uh you know rejecting an approval in this case secondary works well for us and we'll choose the existing function that I've already set up very similar to the other two so we won't spend time building that right now and it's going to be I have this skill let's save that if we look at the function we can see that it's set up in a very similar fashion instead of leveraging the I want this skill function from our script include we're leveraging the I have so with that in place we should be able to refresh our screen here and see our second button to indicate that we already have the skill if we tap it then similar to the new skill submission it's going to show us a list of users to select as an approver but in this case we can just add some comments like I already learned this last spring and submit and we see our successful message and we can also see that we're now we now have a skill under review all right and with that let's just look back at our goals for today we are looking to create scripted conditions we did that leveraging a script include we showed how to script variables we looked at what Global versus record-based context means and how we use that within our app we created card based results with searching for the approver selection in our input parameter screen and we also leverage functioning UI rules to make our description mandatory when the skill was a network type skill and with that I want to thank you all for listening and following along and I'll pass it back to David for any questions perfect um so we are at the top of the hour now um let me share a new screen here oops um but there are a few questions that came up along the way that I answered uh maybe just to highlight one of them John mentioned can we please make sure that these Advanced methods are being documented on on product docs and this is something that we're actually working on um especially you know product docs is something that we continuously try to improve over time but is actually very helpful um when we get feedback directly from customers so anytime that there's an area of product docs that you want um to be flushed out more uh definitely call call that out on mobile Community because our product teams are constantly on community um that is a great area to you know share that feedback directly with us and of course these are areas of opportunities that we found um as gaps and so our mobile app Academy series is an opportunity for us to fill those gaps in the short term as we build more training as we flush out more of our docs and so forth so hopefully these academies are helpful in filling in some of those gaps uh but with that being said um I'm going to go ahead and wrap up today's session um next week we're going to wrap up with our last part in this skill building series we're going to dive deeper into push notifications uh for this custom app and again if you are finding these sessions helpful please let us know in our post session surveys um there's going to be a couple of questions to ask you what other confidence do you want us to explore after our ad Academy Series so definitely let us know in those surveys and if you're interested in any of our past molot academies we are going to upload these on YouTube which you can find on our community site so make sure to subscribe to our community forum and register to our App Academy series with that being said thank you all for joining us in today's session and we hope to see you in our last part of our Live app building series next week or in two weeks from now thank you everyone