[00:00] In this lesson we will examine the different elements that make up a Perspective Session. In this image, we see all of the elements that make up a perspective Session. We have the largest element at the top, and the smallest at the bottom. Starting with the smallest, we see the component. Components are the displays, input fields, tables, and other objects on the screen that your users will be interacting with. All components must be placed into a container. Containers determine where a component is positioned as well as how the component should behave when the browser is resized. Next up is the View. Views are flexible as they can act as a top level screen or a smaller component called an Embedded View. So you can place a View inside of another View. If you wanted to add a sidebar, a popup, or a bunch of smaller, yet complex objects, then you could do that as a single View. This takes us up to the Page, a Page is a collection of Views and a URL associated with that Page. Another way to think about a Page is a single tab in your browser and all of the content contained within it. So you could have that sidebar and that main View and both of those would be placed into a single Page. At the top, we have the Session. A Session is a collection of open Pages from a single browser. When your users launch your Perspective application they're really launching a Session. Now when it comes to working in the Designer, these bottom three elements are the ones we'll be spending most of our time with as they are the most granular and have the most settings. Speaking of the Designer, let's take a look right now. We can see that I have my Designer up and I am in the main Perspective workspace here. If we look down below, we see a couple of tabs. These tabs are showing us the Views that I'm currently editing in the Designer. Now in this one View called Main View, I have a gauge, this would be a component. Now as I click around, you're going to see on the right hand side, the Property Editor is going to show us properties for most of these elements. So I'm looking at the gauge right now, if I click on the background we can see that it selected this thing called root. This is the root container. Other lessons will describe the relationship between a View and its root container. But it's basically the initial container that you can place components into when trying to add them to a View. Now if I head up to the Project Browser, I can select the view which in this case I've named Main View, now as I'm clicking around and working in the Designer here, you'll notice that visually there's not much difference between selecting a View and selecting the root container of a View. Really just the selection in the Project Browser will change as well as the properties in the Property Editor. Again, we'll examine the relationship between the two in other videos. So we're looking at one View here. And if I head down to those tabs at the bottom, I can switch to a different View. This View is a bit more simplistic, I haven't placed any additional components, I've only changed the background color of the root container. So we've seen components, we've seen a container, we've seen some Views. Next up would be a Page. Now next to the tabs at the bottom of this workspace here, you'll notice the cog icon. This takes us back to the root or home of the Perspective workspace. In this section we can configure a Page. So for my entire project, I have a list of Page configurations. Here we see I have something called my Page, which has my main View as the primary View, and then it has that West Dock View, docked to the western edge. We can see that I have another Page here as well with a different View. So I can configure my Pages here. Now there's not really a Session to be defined inside of the Designer. But if you look on the right hand side here, you will see the properties for the Session. So all my components and Views can reference these properties and that can also add my own custom properties here to store whatever values I want. So that was a very brief overview of what all of these elements looked like in the Designer. Let's take a look at an actual Session. So I'm going to minimize my Designer here. And see I have my browser up. We see our gauge from earlier, so we recognize the component. The component is inside of this container which is taking up quite a bit of space in my browser. We know that the View and the container are basically the same size and position. So the entire gray background here would be considered a single View. On the western edge here we see that I have my west docked View. Because we're looking at both Views inside of a single tab here, we know that this is a Page, we can actually see in the URL it has my Page listed here. This also means I can have a separate tab which has a separate Page. Both of these Pages are tied to the same Session because they're in the same browser. So hopefully that gives you a good idea about these five elements of design and how they relate to each other. Understanding that relationship is fundamental to building amazing projects in Perspective.