Hi there. This video is all about mood boards. People never know what I'm saying. It's M. O. D. Your mood like happy, sad. We want to mood for our designs. We're going to build it in X. D. We're going to look at inspiration places, get an idea of the field, the look the mood before we move on and actually start building our high fidelity mock ups. Alright, let's jump in. Alright, so it is time to start with the high fidelity version of our instructor, HQ XD project. And high fidelity just means it's got all the images and all that. It looks exactly how it's going to look when it's finished. So fonts, colors, images, that type of thing. But before you get started in terms of doing the design, I find it's really useful to create a mood board first. So whether you use this mood board to go to your client and say this is the kind of look and feel that I'm going for. You know, this is the kind of zone I feel you've communicated to me or whether you just use it personally. It will depend on ...
the relationship with the client. Sometimes it is pretty casual and you can go back and say, hey, here's the mood board and do it pretty casually just in an email to see where you are on track. Sometimes though in a larger kind of job, you might have to go back and present concept ideas. Okay, so mood boards will only be used for you personally. So you might have to go back and pick kind of like maybe three visual themes for them to pick from. That will depend on a couple things, budget, client expectation, those sorts of things. So either way it's really handy to start with a mood board just to get your ideas and you know, get inspiration now, where do you get it from? Everyone's probably got their go to place for inspiration. Could be Pinterest instagram, I use these places, so I use batons, dribble and nice with two eyes Dribble with three beefs. Okay, Behind his adobes one, it's a really good one. So the cool thing about it is once you've been using it a little while it starts recommending stuff for you that's kind of in your zone. Um once you're in here, so go to Bahamas dot net and you can do a search, you can say, I want to find all the kind of Ui uX things, so I might go in here, it's weird, you gotta search on this top chunk of PS if I go, you y take with 10, you can see it's just kind of cool uI stuff. Okay, and you end up just kind of loading, you're like, oh man, I really like, this may be just the color ways or the kind of squiggly thing is you find the bits you want and I just do screenshots. Okay, so my Mac, it's command shift four and it just does a big old screenshot around it and that will save it to my desktop, if you're on a pc, we talked about this earlier, I can't quite remember off the top of my head for a pc or you can right click these guys and start saving the images and places up to you. So once you've, so this is one place, right, we've got Bahamas dribble with three Bs is another really useful place. Um the same sort of thing in here. Just go through, Open up loads lots of screenshots and so nice. You can do a search. I did a search here for you. I the cool thing about Nice is that once you like it, you can say I want to add it to one of my board so you can hit plus and you can say I want to add them to my board, you create boards and you can add to them. It's just like a little collection, little group of stuff you say actually I want to add that to it. Okay, so you it's free for the first couple of boards. Okay. And you say I want to add that, I want to add that to this passive HQ board. Just some random bored I had and then you can open up that board. This is uh there's all of my boards, there's the passive HQ one. Okay. And I click on it and it will load them up in a cool, nice little collection. It's really pretty much alright here's my passive HQ board. You can see it's got very kind of like, even though I thought I was picking random stuff to go in it all has a very similar kind of color way and very kind of look to it. And what's really nice about this is you can export this as a pdf and it's just a very good, you can link this to people consented decline and say this is what I'm thinking. And also like there might be bits where you're like actually that there is very large and you're like actually I just wanted to be smaller. Actually even smaller, hold all to reduce there you go. So holding option on my Mac and I can just keep making it smaller until its like not such a significant part. And then you can say that I'd like to be a really big part of the feel of this kind of mood board. So this is some cool ways of getting ideas. Nice is a nice way of getting them all together. But what you might do is just do what I do here in XD is and we're going to just dump them all on the page that we can always see them rather than being on this like separate website. So before we move on and we're not going to upgrade our wireframe, I don't often do this like the wireframe was good and it's been, you know clients approved it and they love it and we need to move on to the high fidelity version. You could just start switching out these colors for images and stuff. I don't want to do that. I want to start with a new document. I like starting fresh again. So we're gonna start with a new document. We're going to make it this web 1920 again, we're gonna need this outboard. We're gonna call this one homepage, we're going to save this, we're going to save it to our desktop. We're going to put it in the same folder but this one here is going to be our I H Q. This one is going to be our high high fidelity high five. This one is going to be version 1. I click save. And what I end up doing is I've got all my screenshots right already done a bunch of them. Okay, They are in your exercise files and and images and I just put them all in here in this mood board and open that up. So there's a bunch of screenshots. Okay, what I like to do is just grab all of them. Actually grabbing all of them runs into a small little problem. I'll show you in a sec. So I grab them all and I dumped them all into XD. They kind of zoom off into the edge there. Can you see they've kind of zoomed off all that side so you can stick them all. So I've just gone edit, I'm just going to drag them all across and I actually got to shrink them down. Member hold shift to scale them down proportionately. That's why I kind of draggin maybe 10 at a time or five at a time and now what I'm going to do, Zoom way out. I'm making myself like a caveman move board, It's not as pretty as the Nice one, but it's going to work and I'm gonna have it small enough so I can see it kind of just up here. So when I'm designing, I'm kind of like taking notes, pulling colors from and looking at font compositions and the hierarchy of type all from these kind of style guides that I've got that both me and the client have gone, yep, that's kind of where we want to go with this. So I find that mood board just up here, it's just as handy. Now, one or two other places you can look for for ideas, especially if you're new to UI design is in the adobe market. So under your creative cloud app, remember up the top here on a Mac, down the bottom on the pc, go to assets market where it says featured, drop that down. If you've got a search already going in here, you might have to kick cross there, go to the featured and go to this one that says user interfaces so there's a lot in here free to use. And the cool thing about this is not only is it like visually quite cool, but they're actually usable. Things like Ui kits in here that you can actually start using the buttons for their allowed allowed to use them commercially. I'm scrolling. You can see it's just loads of them in here, which is a cool way to go order to hit up google and type in Ui kits, K I T s and there's ones you can pay for ones you can buy. You might use that kind of inspiration to get started because it's really specifically Ui and not only is it just like they kind of homepages, it'll have all the nitty gritty like ticks and checkboxes and edits and form fields and it has a little bit more going for it. All right, so we've got our visual kind of idea, our mood board going, Let's move on to the next video