Hi there, in this video we're going to look at Symbols in XD. Why are they good? It's because when I've got a symbol, you can see here, I've got the Navigation used on more than one page, and when I update it, they both update and change, which is super helpful for things that are reused across lots of documents, like Footers and Headers. Let's go and look at how to create those now. 

To create a symbol, we're going to reuse both this Header and the Footer. So I'm going to create a new page. There's lots of ways, I keep showing you different ways. I'm going to go back to the Page tool and click on this, which is my default that I used at the beginning. I'll drag it by dragging the name underneath. And I'll give it a name, I'll call this one 'Instructor Dashboard'. And I want to extend it out just a little bit. So, remember, the benefit for using a symbol is I can connect them all together and whenever it updates to the navigation, say on this Home Page here, it will update for all instances of it. I'm going to zoom in here. 

What I want is, I want all of this. So I'm starting up here in the gray area with my Black arrow, I'm just clicking, holding, and dragging just a little across, like this top little wee bit. And what I want to do is, you can see, I've selected lots, but I've also selected this blue thing that I'm using to kind of give me my width. So I'm going to hold 'Shift', and just click on him to get rid of him. So I've got everything along the top here. How do I know? I kind of drag it off to check. They all came along for the ride. 

So what I'm going to do is you might be on your Layers panel, you want to go to this top one here, the Assets panel. Within here, it's something called Symbols, click '+', and that's it. That is now a symbol that I get to reuse. So let me click, hold, and drag it. And that's useful, I guess, I got a nice little thing that I get to reuse. But I could have copied and pasted, I guess. And what's really useful is, now if client comes back and says, "Actually you've spelt login like-- some people use login as one word, it should be two words, it's up to you. Let's say we've been convinced, and it should be log 'space' in. So we've done that but by default it actually becomes a unique symbol. So this one here, has not changed yet. So what we need to do is right click this fellow, and say 'Update all Symbols'. It updates symbol of the library. I'm going to have to zoom out. 

This one here, 'Command 3' to zoom in on it, maybe a little bit more. And you can see, it's 'Log In'. So that is the perk of symbols. You get to link them to this thing, so they easily drag out, and reusable. But what's really super useful is, you'd update one, and it updates them all. So obviously good for navigation. Anything up here is on all the pages, so I'm going to do the same down here. I'm going to grab you, my friend. I'm going to 'Shift' click this guy, so I've only got this selected. I'll just check that I've got it all. And I'm going to go to 'Symbol', I can't name them yet. Our icons are a little bit small for this one, that's okay. Is this the right page? It is. Drag him on, in here, and there you go. So if I update one now, they'll both update. 

Couple of things I want to do to finish this off. I want to put that big blue stripe in the background so I know where the edges are. So you, copy, and over here, paste. Wrong one. So I want you, and go to unlock it. Copy it, lock it again. Then come over here, click on this dashboard, and if you hit 'Paste' the cool thing about it is it goes perfectly where it should. The only trouble is, it's probably on top of everything else. So I'm just going to right click it, and say 'Send to Back', and then, I can either use 'Command L' or 'Control L', I can right click, and go 'Lock'. So this gives me my boundaries, what I need now is a left hand menu. So I'm looking at my hand drawn Wireframe here. So I want that Left Nav, and I'm going to jump out to this thing here, and I'm going to find a left hand there. Where can I see one? There's a Navigation over here that looks good. It's going to be my starting anyway. So I'm going to grab you. Awesome. Copy it, drag it across, paste it. That will be my starting for this one. I'm going to ungroup it all, because of a few things I need to do. 

For you at the bottom, I'll have to tighten it up a little bit. And I don't need the word 'XD' there. I do want the word 'Dashboard'. So I am going to probably delete you, you… Moving at the top, I'm going to make this with dashboard but I'm going to use my 14. That's 75%, bad habit, you got to be at 100, so you could do font sizes. This one's going to be 'Dashboard'. And I will make this bold. Cool. Underneath here-- actually I'll make this '16'. Using 12 and 16, they kind of differentiate heights. Now what I'll do also is grab my Type tool. Click in here, I've got some text for-- this is the text we're going to use with my guy there. I'm mumbling now, because I'm just filling in forms. To be honest, if there's going to be any more genius in this class that you might want to hang around for I think I'm out of genius. So I'm just putting these in. What I might do is put the little dots in the front to make it look like something new. Remember, there I am putting in-- it's holding 'Alt', and hitting '8' or 'Option 8' on a PC. This doesn't have bullet points to start with. So Dashboard, you, for the different things we can choose. Awesome! 

One last thing that's on my little hand drawn Wireframe here is I've got that little ad from the Home Page. Now there's not a really easy way to jump between pages. You can use the Layers panel, go back to here, and go back to Home Page. It's not that great, I don't think. Hopefully, one of the upgrades will give us a feature like that. So here-- I'm not sure why I've come back for this bit of text, but I did. So we're going to use it. It's going here, just a little bit more. Paste. And this is going to go in this little area here. Now I think this needs to be bigger because I'm going to have longer names in there definitely. Download the app thing, maybe even smaller. Here is actually, zero genius coming. 

The last thing we're going to do is, because we're going to use this across all of the Instructor pages we're going to turn it into a symbol itself. So we're going to drag a box around all of this. Deselect the lighter blue color, and set as symbol. All right, that's going to be it for this video. If you've waited till the end, you are awesome. That got a bit painful there at the end, I know. But the next video is going to be awesome. We start doing Repeated Grids. Oh my goodness, it's awesome! Let's go and do that now in the next video.