logo

NJP

Workspace Navigation and Experience Demo

Import · Jun 20, 2023 · video

[Music] hey everyone it's Justin thank you for watching and welcome to my house that's Justin's house in this video I want to talk to you about workspaces and UI Builder workspaces are quickly becoming one of my favorite things I'm spending a lot of time learning and training on UI Builder and I stumbled across something this was in the May 2023 updates from the servicenow store but I wanted to share it with you because I thought it was cool to help me and that is the workspace navigation and experience demo you can see it right up here behind me on the screen right here workspace navigation experience demo basically shows an example of a workspace with a home a list and record pages and it's given me an idea where I actually want to create a little playground for myself as I'm learning UI Builder to create and start using an understanding a lot of the components that come with UI Builder so look for more content on that but let's get into today's this video and show you what that looks like so once you've installed that application from the servicenow store and I'll just note this is available in your instance and all developer portal or PDI instances you will have a new workspace in UI Builder Called Agent workspace nav and experience demo you can get to it going to demo slash base aw but let's pop it open and see what's on the inside of this application now one of the reasons I like to show this is because you can see exactly what goes into creating a workspace all the pages all the variants if we get into some of these you'll see the data sources and kind of how they've done it statically or dynamically to load things and so I'm basically going to show you this let's just get into it I'm going to show you what the demo actually looks like and then we'll come back into the application in UI Builder to see under the hood so that you can actually start learning from this alright so I've got the workspace up we got a welcome message we'll go ahead and dismiss that now these first three Tabs are basically links to to external content so if you want to learn more about UI Builder check out those links they're going to take you to the developer site in the documentation site helpful yes some key metrics number of workspaces shared pages and components all will make sense when you start to learn UI Builder basically workspaces are those experiences shared pages are pages that we're using between experiences I believe and components are 258 components things that you can add to your user interface in a workspace oh my gosh mind blown right there right did you know you could add 258 different kinds of Widgets or components to an experience it's pretty cool so let's get into it let's show first of all they've got a list view where you can see what that list experience is like it's just going to load up on the left hand side some out of the box list like incidents problems requests catalog tasks you can see there but all of these have a form associated with them too so if you're open a CND task it's not going to open just a generic form it's going to open a special form so when I was back in UI Builder and we're looking at the workspaces they've already defined all these forms they've looked nice and you can do things with them this cmdb task there's no extra UI actions or anything like that but that's what's going on there there's the analytics Center which is opening performance analytics workspace if you've been watching my videos for some time I'm a big fan and proponent of this data visualizations component because it allows people to create dashboards that kind of can sit either on a landing page in a workspace or elsewhere in a workspace doesn't have to be a landing page this is what servicenow's been doing with some of theirs now the last part of this that I thought was like the the eye candy right is the component demo so what they've done is they've given us some actionable buttons here at the top for timeline contact card calendar appointment calendar and node Bap and when you click on these it gives you an example of how the component works so there's the timeline here's a contact card you've probably seen these in CSM agent workspace here's the calendar view and as you can see I've got a full calendar with uh times and all that stuff in the middle and over on the right hand side I got some dummy data now we'll show you what this looks like on the other end just in a second here's an appointment calendar so I'm going to go in and request an appointment and book an appointment so if I click on this hit schedule it's going to bring up the scheduling window and let me interact with that and then there's this node map which actually came out with cmdb workspace and it got withdrawn from the store by the time I got around to installing it so I missed it and it hasn't come back out yet as of this recording date which is June 12th um but maybe it'll come out in the meantime but essentially it shows you a demo of actually having a node map so you can see they've hard-coded in some Json there for the different nodes but I can come in here and I can open the outer group actually I think I've got to double click on that to open that properly maybe let's try this yeah I'm still figuring some of this out there we go like expand the node and that'll change the view so I'm looking at the outer group so what I like about this is you can sit down with the customer a potential customer a business unit a department and kind of walk through what the different things might look like in a workspace maybe a design effort you know you're just trying to show them how things work but for you an admin you can come in and see how some of this is configured so let's take a look at the component demo page that's this page I was just on that had these buttons what I like about this is you can get in there and you can actually see how they configured us so I have up above here the component demo the buttons I was clicking on well I can see they used a carousel component and then they've got links in here to do different things if I go down and look I see I've got a component container down here one shows the timeline the calendar the appointment calendar and then that node map obviously open a new page I can get in I can look at the data resources if I want to learn more about that the client State parameters if I want to learn what's going on there any client script so in this one we can see there's a script that it actually determines when you click on one of these then it becomes that component becomes visible or not visible so there's a learning aspect here too of looking in UI Builder seeing how things are configured so that you know how to configure your own workspace my question for you is and for myself where's your playground where's the place where you're playing around with how to configure UI Builder I think this is a really neat idea I encourage you all to go create your own workspace in your PDI in your Dev or your test environment where it's not going to disrupt anybody and start playing with components and I promise you as I start learning these I'm going to start sharing them here on the channel and hopefully can add to what's available here with agents workspace nav and experience demo from the servicenow store and servicenow and that's it that's it for this one I hope you found this video helpful if you did please like Please Subscribe or share with somebody who you think might be interested in learning more about UI Builder and workspaces in the service now and until next time don't forget to always be learning [Music] thank you

View original source

https://www.youtube.com/watch?v=o0c93RgYm10