Create a Desktop Calendar/Wallpaper using a Pattern

1. Hello!: Hello, welcome to my class. As some of you know, I love patterns and I love finding new ways to use them. About a year ago, I started creating desktop calendars and putting them on my website, free for people to download. Now, I get over thousand downloads each month, and that number is growing every month. It's a wonderful way to get your work out there and increase your audience. I've even had enough director contact me to work up to say my calendar. This class is for surface pattern designers we all already know the basics of creating a pattern. I'm going to teach you about screen resolutions for desktop computers and devices like tablets and iPhones. I'll also show you how to set up templates and Illustrator for your calendars, and how to apply your pattern into those templates and add your calendar. I'll also show you how to create a blog post on your website to allow visitors to download your calendar. Let's get to it. 2. Finding Inspiration: This is just a quick video on how I find inspiration for my desktop calendars each month. Sometimes, I have a specific theme in mind. For this one, I'm actually going to go with Christmas because it's December. Sometimes, I will use a pattern that I have just created for something else. Say Easter or some other holiday, I might go with that theme. It's really up to you. You can do whatever you like. If you do decide to do December, I've created a Christmas Pinterest Book, the link is in the project area. You can feel free to have a look through the list. I've been collecting these for a couple of years, I think. There's quite a lot of stuff in there. I've also put a link to some calendar wallpapers for some inspiration. You can have a look at the different layouts that people use to give you different ideas on how you can lay out your calendar. Then I quite often put together a mood board for Christmas. This is what I wanted. I wanted to put some animals. Really wanted a rabbit that was leaping and some Christmas trees. I really like these colors here. I've taken some of those colors and added a couple of more. I really wanted to have some red in there. From that, I will create my pattern. Let's get on to the next lesson. See you soon. 3. Display Resolutions: Before we get into designing our desktop calendars, I need to talk a little bit about display resolutions. The display resolution or displacements of a computer monitor or device is the number of distinct pixels in each dimension that can be displayed. It can usually be coded as width times height with the units in pixels. For example, here we've got 2690 by 1560 pixels. Then over here we've got 1920 by 1080 pixels and that is the width by the height. So each month I create about this many desktop and phone calendars. You can see down here in the bottom left is the teeny tiny iPhone is very small in comparison to say, the iPhone 6, this one, iPhone 6 plus, which is quite a quite a bit bigger. There's quite a few different sizes. If you want to work out what people are using, what's the most common. A very good site to go to is this one called screen sizes, I've put the link to this in the classroom. In here you can find every single screen size there is for phones, tablets, and monitors. You can sort them by popularity. See this one here, Apple cinema display 30 inches, not very popular. But if you go the other way around for Dell XPS 13, it's very popular. I know a lot of corporate businesses use the Dells. Then you can look at the smart phones. The most popular at the moment here is the Apple iPhone 7. So it's a good indication of which devices of a news to view your website or to display your wallpaper, your desktop calendars. So it's very useful. It also gives obviously the width and height as well. So you can pick out maybe the top five of each one phone, tablets, and monitors and just create them. You'll find some crossover, some other sizes. So if we sought the width here, can often find some that are same width and height. Here we go, Apple MacBook Pro 15 inch and the Retina display one are both the same width and height. You'll find, then if you look down here, but more the MacBook Pro 13 inch is the same size as the cinema display, 30-inch. So they do cross over quite a bit, this one's a very popular one. Sometimes it really depends. Just get back up here, trying to find the one I use. If you want to know what size screen you have, you can do this from your phone or your computer screen, just go to this website. What is my screen resolution? It will tell you mine as 1920 by 1080. In the next lesson, I'm going to show you how to create templates and illustrator for a number of sizes or whatever size you want that if you're going to create these calendars every month and we give them to people by your blog. It's a good idea to have a template for each size that you want to provide and it will make your process each month a lot quicker. I have about 10 or 11 setup and I have supplied them for you to download free. In the next lesson, I'll actually show you how to do it yourself. But if you own a later version of Illustrator, I'm going to go into Illustrator, I'm on Illustrator CC. They actually already have decided that the templates there, well, the size, it's not really template. So if you go into File, New, you can go to mobile and view all preset. These are all the presets. They're not templates they will create an upward size that you want for say the iPhone 6 or 6 Plus or whatever you want. So you can use that. The templates, however, go a step further and that they have layers that are already to just plop your design and save and you're ready to go. But if you wanted to, you can go in here. This is also a good way to find out the screen resolution of different devices and screens and stuff like that. If you download the templates that I've supplied to save them, you will need to go into your file finder, and this is on a Mac. It's pretty similar on a PC for memory. So you need to go to the "Applications folder" and open up Adobe Illustrator and then within there find the folder called Cool Extras. Within there, there's usually only one which is en_US, you go in there and then templates. In here is where you keep all your templates. I have photo here with all my wallpaper templates. You can save them all there. Is quite a few. I also have folders for other things that I do, I do a lot of business cards for clients. So I have one here for a printing company that I use all the time. I also have one here for my half dropped repeat that. I use when I'm creating a passion in Illustrator. So if you save your templates that you download from the classroom into this folder, they will appear when you go to File, New from template. You can see here it's brought out that Templates folder and you'll be able to create them. But in the next lesson, I'll show you how to create goes from scratch. I will see you then. 4. Adobe Illustrator Templates: To create a template that we can use every month for our desktop calendar, it's very easy. We just create one for each of the different sizes that you want to do it doesn't matter. You can just create two or one or 10 doesn't matter. I like to do it one template per calendar. You can combine boards into one template, but I do find that, that will really slow down your computer and you might struggle to actually get your designs on there. But if you've got a really, really fast computer, then go for it. But I'm going to show you how I do it which has one size per template. So to create the first one, I'm going to go file new in the Illustrator and I'm going to create a desktop size which is 1920 pixels by 1080. I'm going to keep it as RGB, as this is something that will be displayed on your screen. You would select CMYK if you're going to be printing it. You can also change the resolution. I'm going to keep it at 300, so it's nice and clear. Then I'm going to create that document. Now to set up your template, the first thing I do is I get rid of all the swatch colors because every different design is going to have a different color swatch panel, and you're also going to bring in your pattern and your calendar. So I like to keep that clear so it's easy to bring in. I create two layers, the first layer is my calendar, and then I create another one which is my pattern layer. Now the pattern layer needs to be at the back and the bottom. Another thing you don't have to do is I name my atboard. So this one is desktop 1920 times 1080. Now this is handy if you do have multiple boards on your template. The reason for that is when you export it, it will save each airport as its name, and so you'll be able to tell what the sizes when you export it. I found it very useful. But in this case it's probably, It doesn't really matter too much. The other thing I like to do is click on the pattern layer and create a rectangle the same size. So that will be 1920 by 1080. I don't want any strike. We can take the fill as is, this is where you're going to fill it with your pattern later on, and we want to align that to the artboard, so I click on align, make sure it says align to artboard, turn it here. And then select Horizontal Align Left and Vertical Align Top, and that will put it nicely in the right spot. So that's pretty much it for creating or setting up that template. To save it as a template, go to file, save as template. As you can see, I have all mine in Wallpaper Templates folder. So all I would do is save as, the name, which is Desktop, and then the size, 1920 by 1080. Now, I've already got one there. We can probably save over it. Maybe I saved a slightly different name. So now if I close that and then I go to File New from template and then go into my wallpaper, there is the desktop 1920 times 1080, you click new, and there it is ready to go. So now all I need to do is bring in my pattern and my calendar. So you can go and create as many templates as you like as you saw, I go into File New from template. You can see I have multiple desktop sizes and multiple iPad and iPhone sizes. A lot of these work across other devices, Samsung, the quiet default sizes. But if you look at the the shape, the resource sheet that I gave you, you'll say, a multitude of different sizes. It's really up to you to decide what you want to create. If you're going to be putting this on your blog and sharing it with the world. I do keep a track of them every month and try and see what people are downloading the most and make sure that I have them available, and I do check resource. If you have a look in the resource in my resource links, there is a link to a search that will show you what desktop resolutions on the most popular at any given time, and it does change over time. So in our next video, I will show you how to create your pattern and your calendar, and then we'll apply them to the templates. See you then. 5. Pattern Creation: This is the fun part. We're going to create a person that we will then apply to our desktop calendars. Now I'm going to go through this really fast. I'm going to speed it up because this is something I teach in previous class, my class code for creative repeating pattern and illustrated using texture. If you want to know how to do this in detail, then please go back and have a look at that class. I'm just going to use the Christmas icons that I've created and I'm going to turn them into a pattern. Sit back and enjoy, and I'll see you in a minute. The last thing I need to do is add my pattern tile to my swatch so that I can use it on my calendar templates. I'm going to drag that, I got everything selected. I'm going to drag it. I'm not sure if this is going to work. Sometimes, I have to re-create my black square in the background to create. It could be mask, and that's what I have to do. Let's get rid of that one and create an up one. The background. It's going to create a square that's 10 by 10 inches, the same size as my outboard. Takeoff the fill and stroke and send it to the back, measures aligned. If I select everything and put it onto my swatchboard, it should create a repeating person. Okay. Let's try that again. It's going to drag that onto my sludge pedal, and there it is. Let's just test that. I'm just going to create a rectangle and let's have a look at beautifully repeating pattern. In the next lesson I'm going to teach you or show you how to create the calendar that is going to be applied to your calendar templates. I'll see you soon. 6. Design your Calendar: Okay, now we've got a beautiful repeating pattern. The last thing to do is to create the calendar. I'm going to create a calendar similar to my November calendar. I'm going to open that up and grab it and that way I can just copy it and update it. All right, I'm going to paste it on top of my archest here so that I can say what it's going to look like in the end. Just resize that a little bit and go to ungroup it and then I'm going to update it to December. We need to change the background color too, all right, so December. Now, there's a million different ways you can create your calendar. You can do pretty much whatever you like. Sometimes I put it in a circle, sometimes I do it across the page as one row. This is probably my favorite method. It really is up to you, so the hardest bit is actually just getting all the numbers in the right place. To do that I just find the calendar for December and I look on my file normally and find out when the first is. For December 2017, the first is going to be on a Friday. So I'm going to go in here and just hit at this and I get rid of that and that. I'm going to change that to one, that to two and then we're just going to go back down a bit. I'm going to go and change all of this to the right number. Now we have to add a few here let me zoom in a bit it going to drag that across. I'd do that again like that, 29, then 30 and there are 31 days in December, so we need to modify this a bit. I might let's go back out to the other layer, make this slightly smaller and then edit that right. Then normally play around so I have each row grouped so let's get rid of that 31, I put it in a different group. Excuse me I've got a bit of a funny throat. Each row is on a different group, it makes it easier to distribute them out evenly using the align tool. If I align to selection and then use this distribute objects vertically, it will space them out really nicely. You can do the same the other way, but I've already done that, so I won't repeat it. I'm quite liking that, let me just make that a little bit bigger and change to a different color. I just realized I put that on my pattern layer and I didn't want it on my pattern layer, I wanted it my calendar layer. I'm going to grab it all, it shouldn't be too hard because it's everything there, group it. Okay let's grab something else, let's have a look at what we've grabbed, that's it. Texture, let's try that again, group it and move it onto the calendar layer just to keep it all neat and tidy. All right, now what I do with this is I also, put it in the swatch panel along with the repeating pattern. The reason for doing this is, later on when you create your calendar on your template, you just need to load in the swatch panel and you've got both your pattern and your calendar, and you can just apply it and it is very quick and easy. The last thing we need to do is to save our swatch panel. To do that, just click on the icon in the bottom left-hand corner of the swatches panel and click on Save Swatches. I'm going to call this Skillshare-Christmas then save. I'm just going to replace it because obviously I've done it before. I'll see you in the next lesson where we will apply our design to our templates. See you. 7. Apply your design to templates: I know we're going to apply these patterns and calendars to templates. To do that, I'm going to go to File, New from template, then go to my wall paper template folder. I'm actually going to grab a few at the same time, and I a grab for desktop calendars, templates and go to select new. Go, for up, because I've named my art-board I can easily tell, what sizes they are. For each one, I'm now going to bring in my pattern, and calendar for my swatches. I'm going to click on the bottom of ten icon and find skillshare christmas, and all I need to do is click on the pattern, and it will appear in my swatch pattern, and I'm mostly going to click on the calendar. That has a page in my swatch pattern, I can remove that now. Now, if I go to my pattern layer and select that, there's already a rectangle there that I can fill. I made sure I'm on fill not stroke, and click on my pattern, and there it is. I'm going to make it a larger scale. To do that, I'm going to right-click, transform, and then scale. Make sure the transform objects is not selected and increase it by 200, and I like that, I'm going to keep that as is. Now with our calendar, we want to drag it onto here. Before we do that, we need to click on the calendar layer, and if you drag it into that space. It's going to put itself in that rectangle and draw or paint to, and we don't want that, we just want one off, so the way to do that is just to drag it and drop it outside of that area. If I drop it just slightly up here, even though you can hardly see it there. If I then go to align center, might help if I've got it align to art board, let's try that again. center and center, perfect. We'll just save that and have a look, and then you go easy as, and now we just save it. This is why setting up a template is going to make sure that each month, if you're going to do these things monthly, it's going to be super fast and easy to do. The longest thing will be actually creating the patent design itself and the calendar. But actually creating all of the different sizes, that's the route you want to take, it's really simple because you've already got this templates there. I'm going to go and do another one quickly. Let's click on the pattern. We need to bring that in, Skill-share-Christmas. We want the pattern and the calendar, and must depend the selected and this looks the calendar, it looks kind of funky, and let's just change that back to the pattern, and drag the calendar to just off to the side here, and align it to the middle and I might make that smaller as well. There needs some tool again and there we go, let's do that more. Click on the pattern, that's going to put the other one in again. Let's put it back on to the calendar, and then drag the calendar in. Let's make that a little bit smaller. Basically, you just keep going until you've done with all of them. I might actually let's do one for the devices, I can see what they look like. I found new file from template, let's try on iPhone six. Let's bring in the pattern. Apply a pattern to that and quite like that terms scale and let's drag in the calendar. It needs to be a bit smaller. Left to the center, I would only put these one's a bit further up the page rather than in the middle, and then you've got your iPhone six. To say this, I would do an Export, File Export as, I'm going to save it in here. I'm going to save it as a jpg, and I'm going to select squares up a bit. I'm going to select Use Artboard, just in case you've got something outside here that you don't want. Also, we can write in here in the name, I save it as December 2017, and what it will do is, if you've got your apple named, it will append that to the file name. If you don't have your artboard name, then I would suggest putting in the display resolution so that you know what it is. If I exploit that, I'm going to keep that all the same 150 PPIs, is probably good enough. We go to that folder, and that's it. You basically just have to do that for each one. Some File Export as and, give it a name, make sure you name it the device size, if you haven't already put the artboard name in there. Then you have a whole bunch of screen desktop calendars. In the next video, I am going to show you what I do then I create a mock-up and create a post on my blog, and that is where people go to download them. See you in the next video. 8. Share it with the world: Now that you've got your desktop calendar done. What do you do with it? Well, I share mine on my blog. And each month I get hundreds, if not thousands of people coming and downloading it and sharing it with the world which I love. I love sharing my work and I love providing things for people to enjoy. This is how I do it. I create a blog post every month with my desktop calendar available. If we go into my November one. I create a blog post, I create a little mockup. This mockup is actually available for you and I'm going to show you how to set it up. This is where I put some links to download the different device sizes. I used to zip them up into one file, but I couldn't then keep track of what sizes were being downloaded. And I really wanted to know which were the most popular. I've just started doing this. I also provided a link for visitors to go see what they screen sizes just in case they don't know. I also sell stuff on Society6. I often mockup or put my stuff up on Society6 and provide links to it there. With the download links, I use WordPress. And there is a plugin called simple word press download monitor, which I use. It allows you to keep track of how many downloads you are having for your digital files. I've been using this forever, I think. Will show you what it looks like in the back end. You can say this is all my November one's here and hasn't been out that long. It's not even November yet as I'm filming this. There's already been quite a few downloads. Then if you go down in September here. There was over a thousand downloads on my September calendar that was pretty popular. My July went over a thousand. They seem to be growing each month which is great. What I'm going to do, I'm going to show you how to set up a little mockup like this. I created the screen cause this is an iMac and an iPhone. I actually drew these in illustrator and then created a mockup from them. If I go into Photoshop, this would look like with nothing on it. This is what you can download from the projects area. And if you look over here on the right, there's two folders one for the iMac and one for the iPhone. They use smart objects. When you double click on that, it's going to open up in Illustrator. And you can then just popular design in it. Let's do that quickly just so you can see, we don't need that layer there with text. That's got all the just to say what size it is, et cetera. I go down to the pattern right here. And I will fill that with my pattern. I'm going to make that bigger. I think it's a bit too small. So right click transform scale. Take off transform objects and you click on preview. And I'm going to change up to 200 percent so that looks like, happy with that. Then I've got my calendar here which I'm just going to drag in and align it to the middle. And just make the calendar slightly bigger. Realign that in the center. Then if I close up, it's going to prompt me to save it. Then if I go back to Photoshop, it should just update. At some point. Sometimes it's a bit slow. There it goes. There it is. Sometimes I don't know if you can see it on the screens, let's put a little lines through it. We don't know why illustrator does that, but it won't show when you save it for your blog. Let's just quickly do the phone, so in iPhone folder there's a smart object here. Double click on that. It will open up an illustrator. Get rid of that text and change the pattern to make that small that way. Transform scale to 50. And let's drag on calendar, which needs to be resized obviously, sure that's aligned to our board. Might pop it up a bit. We're going to save that by hitting command and this. Rather than closing it, that way I can just go back and check it and If I have to I just go back and update it. And there you go, usually, I will then add my logo and some icons from the design just to make that a little bit more creative. Over here, I've got my final one that I'm going to use. I've just pulled in some icons from illustrator. I literally just copied and pasted them into Photoshop from illustrator. I've added a title and my logo down the bottom here. Then we need to do is save for web, so I'll go to export, save for web. The best way to save it is as a JPEG. And not that big. I'm just going to go 900 save it as a JPEG and save it. I'm not going to do it right now because I've already saved it. Inside then I can put that into my blog post as I've done here for November to make it look a little bit nicer. There you go. Also, the more copies for personal use only. You cannot resell this. But feel free to use it to display your beautiful work and put it on your blog. I don't mind. Just don't sell the original mockup. And that is the end. I'll just wrap up in the final video next. See you soon. Bye. 9. Wrap up!: Thank you so much for doing my class. I really hope you had fun and I really look forward to seeing your designs, so please share in the projects areas so that we can all enjoy them. If you do have a website or a blog, please post them and share them with us so we can download them, too. Anyway, this is the end of this class. I hope to see you again next year. I'm going to have a little break over the Christmas period, but I have a few classes in the works and the planning for next year, so I look forward to seeing you again. See you later.