Watercolor Branding: Create Your Own Custom Watercolor Logo | Teela Cunningham | Skillshare

Watercolor Branding: Create Your Own Custom Watercolor Logo

Teela Cunningham, Hand Lettering + Graphic Design

Play Speed
  • 0.5x
  • 1x (Normal)
  • 1.25x
  • 1.5x
  • 2x
14 Lessons (1h 14m)
    • 1. Introduction to Watercolor Branding

      1:12
    • 2. Brainstorming Your Brand

      1:26
    • 3. Establishing Brand Attributes

      4:55
    • 4. Choosing Typography

      3:15
    • 5. Putting it All Together

      2:17
    • 6. Mini Watercolor Kit Overview

      3:31
    • 7. Masking in Illustrator

      10:48
    • 8. Masking in Photoshop

      7:04
    • 9. Laying out Your Logo

      12:54
    • 10. Create Your Own Vector Assets

      6:08
    • 11. Create Your Own Digital Watercolor Textures

      10:26
    • 12. Preparing for Web

      5:57
    • 13. Preparing for Print

      3:28
    • 14. Final Thoughts

      0:49
28 students are watching this class

About This Class

Stand out from the crowd with a creative, colorful and custom watercolor logo! In this class, we’ll create our own custom watercolor logos by establishing thoughtful logo font choices and learn how to incorporate and mask textures into vector elements and typography. At the end of this class, you’ll be able to create your own watercolor logo using Illustrator or Photoshop. Use your newly created logos for your social media pages, blogs, online shop, stationery and so much more. As a bonus, every student who enrolls will receive a free mini watercolor kit which includes vector elements and watercolor textures so you can get started right away!

Transcripts

1. Introduction to Watercolor Branding: Hello and welcome to watercolor branding, how to create your own custom watercolor logo. My name's Teela Cunningham and I'm an Atlanta based graphic designer and blogger, you may know me from my blog; every-tuesday.com where I share new tutorials every single Tuesday. In this class, we'll create a logo that best represents a brand's essence and personality, we'll choose proper topography for our brand, we'll lay out our logo and finally incorporate a hand-drawn vector element and watercolor texture to really bring it to life. This entire class can be completed using just Adobe Illustrator, although I'll show you how to achieve the same results using Adobe Photoshop. If you don't have Photoshop or Illustrator, no problem, you can head over to Adobe.com and pick up a 30 day free trial. As a bonus for enrolling in the class, you'll receive a free mini watercolor texture kit that's packed with hand-drawn vector elements and watercolor textures, so you can begin experimenting right away. If you prefer to create your own elements and textures, I share my exact process for digitizing both using Adobe Illustrator and Photoshop. At the end of this class, you'll have a logo that really stands out on your social media accounts, your blog, or even your online store, the possibilities are really endless. If that sounds good to you, then hit "Enroll" and let's get started. 2. Brainstorming Your Brand: So as we get started, the very first thing we need to decide is what brand we're going to represent in our logo and a nice way to do that is to look at maybe you have a blog, maybe you have an Etsy shop. You could use your family name, you could use your name, or you can make up a fictitious brand like I've done for my example. I actually brainstormed a florist, just pulled it out of the air. So definitely feel free to do that too if you want. So the name of my floral shop is going to be called Bloom and the descriptor is going to be called floral artists. So it's really important to have a descriptor in your logo just to communicate to everyone what your brand is. It communicates it immediately to everyone so they know exactly what type of business you offer and if it's something they're interested in, then they know that you're someone that they could go to. So for your descriptor, you're going to need the name of your brand and your descriptor. It could be anything like maybe it just says designs, maybe it says jewelry, maybe it says greeting cards. Something that says what the brand provides. So for mine it's floral artists and I would keep your descriptor to less than five words if you can. Just so it doesn't confuse anyone. Let's keep things nice and simple and direct. So once you have the name of your brand and your descriptor, now it's time to establish your brand attributes and your personality. 3. Establishing Brand Attributes: So what are brand attributes? Brand attributes are characteristics that define the brand at its core. No matter where the brand goes in the future, no matter what happens to it, these are the things that will always stay true about the brand. They're very similar to how you would characterize a person, someone's personality. Some examples could be humble, aspirational, determined, relaxed, tech conscious. Very clearly, characteristics that could apply to any person. Everything must stem from your brand attributes when creating a logo, always start there. The brand attributes that I've decided to use for my Bloom Floral Artist Shop are creative, modern, organic. Now organic can mean a bunch of things. For my flourish shop, it can literally mean floral, leaves. It could also mean flowing lines, maybe hand-drawn lines, just a human quality to it, and professional because it is a business that I wanted to come across as being very professional. When you're creating your brand attributes or when you're brainstorming them, I would keep it between 3-5 attributes. You don't want to have too many because it really narrows things for you and you don't want to stick yourself into a corner and feel like you can't come up with a nice design because it's trying to fit too many of these buckets. If you have too few, then you might not feel like you have a very clear direction with where you want to go. I found that 3-5 is the sweet spot for brand attributes.So once you have your attributes, now it's time to look at other logos in the same niche as you, and also create a mood board for how your brand should feel. So up here, if you look at the different floral logos, you can see this first one, it's got some nice little flourishes, organic lines, and it's got some very expressive typography. This one over here fits more of my modern attribute, very clean typeface, and very expressive illustration. I don't think I would go as detailed as the flowers here, just my personal aesthetic, but I really like how the whole thing feels. I really like how clean the type is, and I like the contrast that it has with the organic forms of the flowers. Over here, you can see this one's extremely modern, it doesn't have a vector element at all. For our projects, if you look at the project description, we're going to use a vector element, we're going to use typography and then we're going to also include the water color texture. The water color texture can be used as a background, it can be placed within your vector elements or placed within your typography. There's a bunch of things that you can do with the texture, but we want to make sure that we have a vector element. It just adds a nice little touch to everything and makes it feel more whole in the end. This is really nice. This is more pulling for the typeface than anything else and these were just looking at pairing with icons. This one's very iconic, but a little too simple for my taste and these ones are definitely more expressive. This type face is a little too traditional for me and obviously one of my brand attributes is modern and so that wouldn't work. I like how expressive this one is and you've got some really nice organic line. Just pulling all of these different, I guess, you could call them competition together. When you look at other brands in your niche, you want to make sure you stay true to your attributes, but you also want to stand out. If people are shopping for floral shop, I want to be the one that draws them in and really calls their attention because of my attributes if those line up with attributes that people are looking for in a brand. Down here, you can see I've put together a mood board. The mood board, If someone were to walk into this floral shop, I want them to feel how this makes you feel when you look at this mood board. I've got some nice texture, that brings in the organic quality and very modern, some nice clean lines, feels professional, like all of these are very organized and clean and put together. That's just a really nice place to start because you want whatever logo you create, you want to feel like you can add it to this mood board and it'll fit right in, like it totally makes sense. This is really important. So you have a visual idea in mind before you start designing your logo and you also have all of these attributes. You put them all together and your brain is very focused on your mood board, these images that you pulled, and those attributes. So as long as you stay true that, you can't really go wrong, like you're going to fit what the brand is looking for as long as you follow that path. 4. Choosing Typography: Once we have the visual, we have our descriptors, our attributes, now we need to look at topography, because topography is a major part of any logo. The important thing to know about typography is type has personality. Not only does it communicate a message, but you can always feel something. No matter what type piece it is, you can feel something when you look at it. I've got a few examples here just to hit that point home a little bit. If I said, "There's nothing like a great adventure". When it set in this typeface, it makes me want to pack my bags, I'm in, let's go on this adventure. It looks like a fun already. But if this exact same sentence was typeset in a font like this, "There's nothing like a great adventure", that's how it sounds in your head when you read it. I'm not sure I'd want to go on that adventure. So here's another one, "You're so pretty", very expressive, immediately communicates what's being said here by the way it looks. But if I set it in this typeface, "You're so pretty", I'm not very flattered by that. Here's another one, last one, "I make handmade things". It feels like you make handmade things. Like you're communicating that you make handmade things, and I already believe it. However, if it's typeset in a font that clearly does not look handmade at all, "I make hand made things", I don't believe you. Type has personality. It allows us not only to convey a message, but it resonates a feeling, and feelings are memorable. When you're designing a logo and that logo goes out into the world, do you want people to remember you? Keeping all of these things in mind. You can see I've listed my attributes up at the top. I started looking for typography. You'll notice I've listed all the font names below each example. I put a resource PDF together so you don't have to pause and write down the ones that you like if there's a few fonts here that you're interested in. I have put together this PDF, it's got every single resource mentioned in this entire class so you don't have to take any notes. It's all there for you and you can reference it later. Just make sure you download that if you're interested in picking any of these up. You can get to that right under the video, the link for the class project. Just click on that and scroll all the way at the bottom, and you'll see the link that you can download. I put together a lot of these very modern looking and very clean typefaces, because I decided ahead of time that I want my type to be very clean, and I want my vector element to be very expressive. It's very important for me that I've got that contrast between the two. Because if I've got a very expressive typeface and I've got a very expressive vector element, your eye gets confused because you're getting expression from the type and from the element. There are similar feeling but they're not exactly the same, so it confuses your eye a little bit. You want to make sure that you have a healthy amount of contrast. You wouldn't have any contrast if both of them were too expressive. I've decided to go with a more simplified typeface and a more expressive element. So the ones that I've gone with, I've decided that I like this one the best, and I'm pairing it with this vector element right down here. 5. Putting it All Together: So when I put it all together, this is what I get. This is my base logo, this is where everything begins. If this isn't right, adding texture to it isn't going to make it right. If you feel comfortable and you feel like it's harmonious and going in a good direction, then everything's just going get that much better from the stage. Definitely take the time to really experiment and put a bunch of different layouts together until you're really happy with a base logo. This is the base logo that I arrived at, and now I can begin adding some texture to it. This is just an example of what I've done. We're going to walk through all the technical steps in both Illustrator and Photoshop after this. This is just to get you a little bit excited about making your own logo and to really see what's possible with making a watercolor logo. Here it is, this one is very simple, I just put the texture behind it, and then I knocked out the vector element and the typography to being just white. Very, very simple. This next one, I'm putting the texture only in the vector element. You can see there's a nice little gradient happening right here, but it also has that nice watercolor texture as well. I've just typeset the font in two different colors that are very similar to the watercolor texture, so it all works together, and your focus is where I want it to be, and that's right on the name of the logo. Everything else is supporting. This last one has the watercolor texture integrated right into the typography. This sounds a little more complicated, but it's really easy. I'll explain exactly how to do everything, so you'll be able to do everything that you see here. Piece of cake. This last one you can see it's just in the typography and then the vector element I've just brought in that really soft purple just to support everything. Then once you have all of these, you can look at them as a family, so it's nice to have a bunch of options to choose from, and you can really look at what's working and what's not working, and immediately know which one's your strongest because you've explored all these possibilities, so you can feel really comfortable and confident moving forward with wherever you place this, whether it's on your own blog or social media accounts, advertising any place you want to put it, you're going to feel really confident in your decision. 6. Mini Watercolor Kit Overview: Let's get to some of the fun here. Maybe you don't have time to make a watercolor texture and it is a daunting task to cut them out because I've cut all of them out for you. I want you to know that I totally get it, I know time is of the essence a lot when you're creating things, and sometimes you just want to put stuff together and see what it looks like and you really have fun with it. Keeping that in mind, I've put together a mini watercolor kit, so everyone that's enrolled in this class, which means you, has access to this mini watercolor kit. Inside the kit you're going to get a bunch of vector elements, you can do whatever you want with this, you can rotate them, scale them, recolor them, add texture to them, they're yours to do whatever you want. All the vector elements that you see right in front of you are included in the kit, also included are these watercolor textures and there's different shapes and colors, and there's even a little bit of variation in the texture in all of these too, they'll give you some nice flexibility to experiment with. You'll get these vector elements as an AI and EPS file that you can open with Illustrator, CS3 or newer, and these watercolor textures come as a high res JPEG, it's 300 PPI and the longest side is at least 2,000 pixels. You can make some pretty big logos using these and that was on purpose, so you don't have to worry about resolution breaking down on you if you wanted to use these for larger applications. They also come as transparent PNGs, so if you want to set these on another color, you don't have to worry about it, I took the time and very meticulously cut all of these out. I'm actually going to show you in a later video how to create your own watercolor textures and digitize them and the exact steps that I took to cut them out, if you do want to create your own watercolor textures or your own vector elements. Where can you pick up this mini kit? You can pick it up if you look right below the video that you're watching right now, you'll see a link for a class project, all you have to do is click on that link, scroll all the way to the bottom and you'll see an RTF file that's labeled many watercolor kit. If you click on that, it will open up a little text file and Skillshare has a limit with how much I can upload and I definitely exceeded the upload limit with this kit because it's about 30 megs. If you open up that text file, you'll see a link in there and you can download it right from there and then you'll have the kit. That mini kit is great to get started with your logos, but what happens when you want to take your logos up a notch? I've created two massive watercolor texture kits just for that reason. In preparation for this class, I've created a bunch of watercolor textures and in over 100 piece leaves and flourishes vector element pack. Everything that you've seen in all the lessons in this class, I've been using textures from both kits and that 100 piece vector element packs. If you want to use the same textures that I've been using, the same elements that you've seen throughout here, all of this is right here and I am giving all of them away for 10 percent discount too. If you enter the code SKILLSHARE10 at every-tuesday.com/assets, you can pick up those kits there and we're going to move on to actually creating the logos in Illustrator and Photoshop next. 7. Masking in Illustrator: In this video, I'm going to walk you through exactly how to add texture to your different elements in Illustrator. As you can see here, I've got all the different variations that I showed in our previous lesson. We're going to create all of these right now using just Adobe Illustrator and we've got a texture right here that's in one of my watercolor kits and then we've also got this nice vector element in our topography. Once again, the font that I'm using is called Eveleth, and I've set it in clean thin. I'm just going to grab my base right here. I'm going to slide it over here so we can keep everything separate and I'm also going to grab this texture so you can see everything as it comes together. We've got our texture. We've got our vector element, we've got our type, and we're ready to go. We've got our lockup too. The first thing we're going to do is just drop this texture right behind there. I'm just going to make a copy. I'm selecting everything I'm holding Alt and then I'm just dragging and that makes a copy. That's the keyboard shortcut for that, and now I've got my texture and I'm just going to drag my texture right behind my logo. Get it to a place that feels really good. You can rotate it if you want. I like having this darker color up at the top. I could also put that dark color down below, but that feels a little off-kilter to me, so I'm going to keep it up at the top, and then all I did right here is I selected each one of these. You can select an item hold Shift, and select your other items to select everything at once. Come over to your color palette. If you don't see your color palette over here, you can get to it by going window color and it'll show up, and then I'm just going to click on this white square right there, and that makes everything white. That is literally how easy it is to put this logo together, this watercolor logo. Now we're going to step into one step further. We're going to start with our base logo again, I'm holding Alt and dragging, and now we want to bring this texture and place it inside of the spectral element. Whenever you do that, it's called masking, and you achieve masking by applying what's called a clipping mask. You're clipping the texture within a shape, which that's the shape of the mask. That sounds confusing, but it's not, I promise. I'm just going to drag with texture over here, and I held Alt when I did that, and I'm just going to drag it to a place that feels good because I want this nice gradient and color happening, and I also want to make sure that my texture is turning out well too. It's really important that your texture is always behind your element. Whatever you want to fill your element in with has to be behind the element, and if it's not behind it, you can just right-click, arrange, send it back, and there's the keyboard shortcut for that too. Once I'm happy, I'm just looking at where the texture is lining up behind the selector element because that's the only thing that is going to be placed inside of. I'm just going to drag it a little bit. Maybe you can rotate it if you want. Then when you're happy with your texture selected, I'm going to hold Shift on my keyboard and I'm just going to click my element. Now both these are selected, and since they're both selected, I'm going to right-click and choose ''Make Clipping Mask'', and when I do that, the texture shows up right inside of my element just like I wanted excepts, when I zoom out, this black is really, really heavy compared to this nice subtle detail of the vector element. Now I got to bring in a little bit of color. I'm just going to make another copy of this texture so I can eyedropper some color from it. I'm just going to select, I want a more dominant color for the main name of the flourish shop. Bloom should be much stronger. There's a little bit of hierarchy going on here, so I want to make sure bloom is standing out more than any of my other elements. Bloom is going to stand out right here. Then I want my little textured element because it immediately gives you a feeling to resonate with the name, and then my descriptor is the third one that I want you to see. I need a really dark color for our blooms. I'm just going to end up with this selected. I'm going to hit ''I'' on my keyboard to activate my eyedropper, and then I'm just going to come over to one of the darker places on this texture, I'm just going to click once, and that looks like a good color, and if you're not happy, you can click around and find another one. Once you're happy with that, then you can click on your descriptor, hit ''I'' on your keyboard, and then I need something more subtle than this magenta color. I'm going to go with a softer purple. But I still want it to go well with this magenta, so I don't want to go too purple. I want to still stay in the magenta family, but transitioning into a purple. Somewhere over here looks good to me. That seems a little too light. Maybe I'll come over here. That's way too dark. Just sample, and it's nice because when you do this, you're pulling. Let's see. That's a little better. Yes. You're pulling similar colors, so everything stays in harmony a lot more because you're within the same color family. This feels really good for this one. Now we can move on to our final logo. Most pretty quickly, once you have your logo established, creating the layout, every logo, figuring out your type choices, and the vector element that you want to use is probably the longest part of this process, and then everything gets really fun after that. But it's still an extremely important process because if that's not figured out right, then whatever you do here isn't going to be as great as it could be. The last example that we want to do is we're going to bring that texture right inside of all of the texts, but not the vector elements. The opposite of what we just did. I'm going to grab my base again, hold Alt, make a copy, bring it over here. This one's got a few steps to it, but we can definitely do it. The first thing we need to do is, as you can see, this is editable text right now. If I were to click and add a letter or whatever, I can do that. We need to make this uneditable because we need to put this texture inside of a shape, and right now this is live text and it's not a shape. The way that you convert text to shape, I'm going to select my descriptor too, so I can do both of these at the same time. The way you create a shape from live editable text is with both of them. Actually you can come up here to type and choose ''Create Outlines'', and once you create outlines now you can see these have turned into shapes, they've got anchor points on them. The next thing we need to do is create a compound path with this, and that sounds complicated, but it simply means that when your texture is being put into a shape, right now I've got multiple shapes that are not connected. If I were to try and mask this, this texture would not know which shape to go inside of because I've got so many of them. When you apply compound path, it says, even though all of these are separate elements, consider all of them as being one element and mask inside of the entire thing at once. The way that you make compound path is on a Mac, the keyboard shortcut is Command 8. If you're on a PC, it's Control 8. I'm just going to do that right now, and nothing looks different, but now it's a compound path, and it will always be a compound path unless you release the compound path. If you ever need to do that, you can just right-click and see how it says release compound path, that means one is active right now. That was really important. Now we can bring in our texture, and once again, we want to make sure our texture is behind our text and just find a really nice place to line everything up, and then if I just rubberband, select everything, I can right-click and choose ''Make Clipping Mask'', and now it's masked inside of all of that, and now we can also, let me grab that texture again. We can grab another color for our element and we want this one. Actually see how this is subtle. Like maybe it's a little too light if I want to move where it's been masked, if I zoom in here, I'm just holding Command and then the plus sign or you can do Control plus if you're on a PC. Just to getting close, if I hit ''A'' on my keyboard, this is my direct select tool, and I'm just going to click inside of here and you can see I get these big lines showing that I'm actually selecting the texture. If I'm over here, you can see the blue lines are showing M on the shapes. I want to make sure I got this big intersecting lines telling me that that's a bounding box for the texture. If I click inside of here. Now I've got my texture selected, even though it's masked inside of here, and then I'm going to hit ''V'' on my keyboard. Now this enables me to rotate it. I can scale it. If I hold Shift and grab a node and scale it down, I can scale it down and move it around. It's got to be careful because if I grabbed somewhere else by accident, I might lose, see I just lost my ability to grab it. Then I have to go and I have to hit ''A'', come in here click and then hit ''V'', and then I can begin rotating again or scaling. Let me get back to where I was finding a nice mask for this in my M to fill in, and maybe come on B. It looks good. Now all we have to do is find a really nice color for my vector element, and right now I want it to be a little bit lower in hierarchy than the name of my flourish shop. I need a softer color. I'm just going to hit ''I'' on my keyboard and eyedropper a softer color. These are looking really pretty. Let's see, where was I. Let me go back to a couple. That's really nice. That is how to mask texture into vector elements and typography. In the next lesson, we're going to do the same exact thing in Photoshop, although this entire class can be achieved in Illustrator. If you like Photoshop or if you dabble in both, I want to make sure I just cover how to do the exact same thing if you like working in Photoshop. That's what's next. 8. Masking in Photoshop: We just went through how to integrate your watercolor textures and do your logos in Illustrator, so now I'm going to show you exactly how to do that in Photoshop. The same thing that we just did in Illustrator we're going to do on Photoshop, and the methods are slightly different, so if you're Photoshop user, this might come in handy. You can see on my screen I've got the logo and I've got a watercolor texture loaded up which is all we need to create everything that we did before. As you can see over here in my logo base folder, I've got the element, the name of the Photoshop, and then descriptor on different layers, and the two text layers, I got those as well. Now we're just going to get started. I'm going to grab a copy of my base, so I'm just going to hold all and drag and that makes a copy and I need to put my texture behind it, and now I can just rotate scale, do whatever I need to with my texture to get it lined up that way that I want it to. Now with both of these together, I'm just going to move him over here and keep them out of the way, we zoom in and we just need to change everything to white. I'm just going to group these two together, if I come over here and into my logo base, I just need to change everything to white. The first thing I'm going to do is just double-click on my element layer, come over here to color overlay, click on this color, and then I'm just going to type in ffffff to turn it all white and hit Okay and then hit Okay. That just makes the Ahmet white. Then I'm going to select both of my text layers, I'm going to hold Shift and select my other text layer, and come over here into my character palette and if you don't see that you can get to it by going window character, and I'm just going to click on this color and change that also to white. All right. There's logo number 1 done. I'm just going to label this logo 1. Actually let me grab a copy of this texture so we've got apply the other ones. This next one I need a copy of my base once again, so I've got my layer, my logo base layer selected, I'm going to hold alt on my keyboard, click and drag, and now I've got a copy of my base, and I'm going to make a copy of my texture as well, so I'm going to hold alt and drag here in the layers palette. You can do it that way too and I can just grab that over here. Now I need to mask this inside of just my elementary here, my vector elements. I'm going to scale it down, just like we did in Illustrator, rotate it around, find a good shifting color, nice gradient with your texture. I'm going to rotate this slightly, bring it right over because it's just going into this element, so I only care about the texture that will be behind just this element I don't care what's happening down here. When I'm happy with where it's positioned, I'm just going to hit Enter or Return to commit those changes and now I need to come over here into my layers palette, and this texture, unlike Illustrator if you remember we always made sure that the texture was behind the element. In Photoshop you need to make sure the texture is on top of the element. When I grab this texture here and I'm going to drag it so it's above my element, once it's above my element, I'm going to right-click on it and choose Create Clipping Mask and that masks it right inside of there. When I'm happy with that, now I just need to change the color of my text, and very similar to Illustrator, I'm just going to come over to here to my character palette and I've just got the title of my Photoshop right here selected. I'm going to click on the black and then I'm just going to Eyedropper a dark color that's way too dark. That's better. Then when I hit Okay, do the same thing with the descriptor. Let's see, getting a little bit darker, that looks good hit Okay. Now everything's grouped together. If I turn it on and off you can see, I'm going to label this a logo 2. I'm going to make another copy of my base for the final one. So I'm going to grab my logo base, hold alt, click and drag we'll put this one down here. I'm going to zoom in so we can see what we're doing, and I'm going to grab this texture copy right here, make sure yeah. This one is going to go just on the text and not the vector element. I'm just going to position this behind the text so it feels really good. I want to scale it, I want to rotate it, rotate it a little bit, looks good. So I can have a nice little transition from this really magenta all the way to the purple. When you're happy hit Return or Enter, and once again, I'm going to open up this base, were did it go? Right here, this base. I'm going to open up that folder and I need to bring my texture just above the text layers. I'm just going to click and drag over here in the layers palette right above just the text layers. The next thing I need to do is group the text layers together because when I add a clipping mask here, it's going to go into whatever layer is directly beneath it. Only one layer beneath it. In order for it to apply to both of these, they need to be grouped together into one layer. I'm going to click on both of these texts layers and then I'm going to hit Command G on a Mac or Control G on a PC and that will group them. Next I can just click on my texture layer, right click and choose Create Clipping Mask and now it's mast right inside of all of the text. The last thing I need to do is double-click on My Element, Color Overlay, click on this little square, and then I can Eyedropper whatever color that I want. To set it in hit Okay. When you're happy, close up your folder and make sure you label everything so everything stays straight, and then if I zoom out, I can even remove my base logo if I don't need it just so it's not confusing at all. That's how you can apply clipping mask in Photoshop with a texture set up behind it, masking into one element, mask into multiple elements. Super quick and super easy. That's how you do it in Photoshop. 9. Laying out Your Logo: In this video, we're going to go over some ways to lay out your logo. Now, all the logos that you see on the screen right now, I'm giving to you on a logo inspiration cheat sheet that you can download. If you go to the class project and then scroll to the bottom, you can pick that up as a PDF. I want to show you how I created some of these to maybe inspire your own logos. I'm going to walk through, because you can see there's a bunch of variety here. We've got it, the watercolor masked inside of just a ribbon right here, we've got it masked into our actual vector element, we've got it used as a background, we've got it locked up into typography. Then pulling those colors out in our own vector element, we do the same thing here, using it just as a circle in the background like we went over with the Bloom Florist. Once again, right here, we've actually taken the vector element and made it even larger vertically than our watercolor texture. I want to show you how I did a few of these, so maybe it'll be a little easier going from here. This is how it all starts. Obviously, when we went over concepting your logo, arranging everything correctly. So once we get to the watercolor in the coloring part of this, everything just improves that much more instead of falls apart, it doesn't feel all right. Make sure you have your base established before you move on to this part. This is really important. You can see I've got all these laid out here and we're going to do this one, so I can show you how I put this together. Then we'll also take, let's see, I pulled some textures over here so we can do it fairly quickly. I'll show you this Lonely Owl Studio one and then finally, what was the last one? This Bell Pepper Organic Jewelry. Let me just grab these logos or these base logos, and I'll show you how I took them from here. I'll give you all the fonts too that I used here. Don't forget to download the resources PDF. You'll have links to all of these fonts if you want to use any for your own logo. Let's do the Lonely Owl one first. This one's pretty easy. As you can see over here, let me zoom in so you can see what we're going to make. We've got the watercolor texture in the background really pretty. This would look really beautiful on an Etsy header. We've got our vector element right here and we've got our type locked up. You know exactly what it is when you see it. It's the title of an art studio. Let me come back over here. This one's pretty easy. These watercolor textures are both from full packs that I've released, that's also on the resources list if you want to check those out. I'm just going to grab this watercolor texture right here, and I'm going to set it behind everything. If it was in font, all you have to do is right-click, Arrange, Send to Back, and that puts it back there. Now, since the black is a little bit harsh on here and we want everything to feel in harmony with each other, so we want to keep the same color family, but we want to make sure everything stands out at the same time. The most important thing is for people to recognize the name of the brand, which is Lonely Owl Studio here. This I'm going to knock out and just change to white. I held Shift and selected studio after I had already selected the Lonely Owl. I came over here to my color palette. Right here, you can see there are different colors. Not sure why they both look black to me. Right here, this is the fill of that, so I'm just going to click on the white and now they're both white. You can see that really well. Now I just want to make sure that this vector element is pushed behind so you read it secondary to the name of the logo. I'm going to click on my vector element and then I'm just going to hit ''I'' on my keyboard and that just activates my eyedropper tool. I'm going to look for a dark purple. I can grab one right here, maybe over here, maybe down here. This one looks the darkest to me, so I'm just going to click once. That looks pretty good. If I zoom out, you definitely read the name of the studio first, and then you see the vector element and then this nice texture pulls it all together. So that's how I put that one together. Actually, it looks like it's sloping downwards slightly, so definitely feel free. If you hover over one of the nodes, you can see you get the little rotate and you can just click and rotate slightly. I just want to keep this a little straighter. If the bounding box bothers you being at an angle as much as it does for me sometimes, you can get rid of it by just right-clicking and then Transform, Reset Bounding Box. Then all of a sudden, it's a straight bounding box around it even though this is still rotated. Moving on, we're going to do this Bell Pepper Organic Jewelry. I just wanted to show this one because even though this is a circular texture, it doesn't mean that it always just has to sit behind a logo as a circle. You can still mask this into a shape and no one needs to even know that you are using a circular texture. That's what I've done here because I really, really like the mix of colors here, that signify bell pepper, but not too literally. I'm just going to scale this up slightly. Just like we did before with masking in Illustrator, I'm going to rotate this around, just so I can get a little bit of every color. I've got the bright red here, I've got the dark red, and I've got purple altogether, making sure that this is all the way in the back. If it's in front of anything, just make sure you right-click, Arrange, Send to Back. Now with that selected, I'm going to hold Shift, and select my little element, and then right-click, Make Clipping Mask. All these were grouped together, let me ungroup them. Select my vector elements, select the texture, right-click Make Clipping Mask. There we go. Now I want to borrow similar colors, but I want to make sure bell pepper really stands out. I want that to be the fire engine red. I'm just going to hit ''I'' on my keyboard. If I hover over, you can see that the bounding box for the image appearing. I want to make sure that does appear because that means I'm pulling a color from the texture. I'm just going to click in there and that's a really nice vibrant red. Then I want the organic jewelry to still be noticed, but I want it to fall into the background slightly. So I'm going to hit ''I'' on my keyboard again, and maybe I need to zoom in here a little closer. I want to pick up one of these darker purple-ish reddish colors, and that looks really good. If I zoom out, there's my Bell Pepper logo, just like that. We'll come over here to this one, which is a little more complex but totally doable. We're going to use this texture with it. So I'm just going to bring a copy of this down here so we can see it. This one, we're going to mask this texture inside of the typography, and then we're going to pull colors from the texture to fill in this vector element. We also have to get rid of the dot on the I for this too, because this swirls making up for it. The first thing we need to do is grab the typography right here, and we need to create a shape out of it, because right now it's editable text. In order to create a shape out of it, all you have to do is come up here, and go Type, Create Outlines. Once you do that, you can see everything's become a shape, but you have all these shapes running into each other. We need to clean this up a little bit. With everything's still selected, we need to go to our Pathfinder palette over here. If you don't see it, you can get to it by going Window, Pathfinder. All you're going to do is click this icon right here for unite. Once you do that, you can see all those little ticks go away within the different letters. Now we need to get rid of the top of this I right here. I'm just going to zoom in, and I'm going to hit the ''Hyphen'' key on my keyboard. When I do that, it activates my Delete Anchor Point Tool. You can also get to that by coming over here under your toolbox, clicking, and then scrolling down and selecting Delete Anchor Point Tool. I'm just going to click on one of these nodes. Once I do that, this just selects the shape and then I can just hit ''Delete'' or ''Backspace'', and that will delete the rest of it. Now, we have our type right here just as one solid shape, which is exactly what we want, so now we can bring the texture inside of it. I'm going to make a copy of this so we can grab the colors easier later. I'm just holding all and dragging it over, and now I'm going to scale it up. I'm holding Shift, grabbing a node, and scaling it up, just keeps it proportional as you scale. Then I'm finding a good place where I'll have a bunch of different variation in color throughout the typography. As you can see, I'm getting some nice dark purples down here and then it fades to pink, and then I get a slight medium purple up here too. So let's bring it down a little bit. Now I'm bringing in a little bit of magenta at the bottom. Once you're happy with the placement, all you have to do is hold Shift and select the type. Actually, I just noticed that we've got the S. It's separate from the rest of the word and we need to make sure that all of this is considered one word or one shape. So we need to make a compound path here because the S is separate. I'm going to select the whole thing, and then I'm going to hit ''Command A'' or ''Control A'' on a PC, and that creates a compound path. Once I do that, then I can hold Shift and select my texture, right-click and select Make Clipping Mask. Now that texture is mastery inside of my word. Let me just adjust this slightly, and I curve it a little, more centered over the I. Now we're going to pull some color to bring into our vector element. The vector element doesn't always just have to be one color. You can color it however you'd like. I like coloring it with different shades from my texture, so everything feels like it goes together. I'm going to make this one my darkest one and maybe coordinate it. Let's see how I did my example 1, so we do the same thing and bring this over. Over here, I've colored this little flourish here and this one here the same, and then I've colored this one and this one the same, and this top one and this bottom one the same. I'm going to do the same thing over here. All I'm going to do is hit ''A'' on my keyboard, and this activates my Direct Select tool so I can select individual anchor points or shapes within a group. Even though these are all grouped, I can select them individually if I have my Direct Select tool. I'm just going to click on this on, then I'm going to hold Shift and just click on this one, and now both of these are selected. Then I'm just going to hit ''I'' on my keyboard to grab my Eyedropper tool. Then I'm going to find a nice light pink within this texture. That looks pretty good. Obviously, I've got a lot of places I can choose from. If you're not happy with the first color you pick, you can click around and keep picking until you're happy with the color you got. Once you're happy, just hit ''V'' on your keyboard, and that'll release the selection. Now we're going to grab a little bit more magenta. So we're working our way up in darkness. I'm going to grab these two flourishes from this logo. I'm going to hit ''A'' on my keyboard again. For my Direct Select tool, I'm going to click on this flourish, and I'm going to hold Shift and click on this flourish. Then I'm going to hit ''I'' on my keyboard for my Eyedropper tool, and then I'm just going to grab a pink that's just slightly darker than the one I chose before. That looks pretty good. Hit ''V'' to deselect everything, and then I'm going to hit ''A'' once again, select this one, hold Shift, select this one, and then I hit ''I'' on your keyboard for your Eyedropper. Now we're going to find one that's got a little more purple in it, just so we can show a little differentiation between the colors. That looks good. Then finally, for this bottom, our descriptor, I'm going to select the descriptor and then I'm going to choose a dark purple, so it does stand out. It's not as much in the magenta family here, so it looks like it is separate from our vector element that it belongs with the main name of our brand. I'm going to hit ''I'' on my keyboard. I'm going to find a really dark purple here, and just color that. I want to make sure it doesn't look black, but I want to make sure that I am seeing a little bit of color in it. That looks good. Once you're happy with everything, I'm just going to select it all and then Command G or Control G on a PC. That groups it together, and that gives us our logo that we can just move around, and always moves around together. That's three ways to layout your logo. Obviously, you can set your descriptor in different places, you can mask textures within your typography or your vector element. I would not mask your texture in more than one element. It's okay to have your typography set in a watercolor texture. But I wouldn't set your vector element, and your typography, and watercolor, because then it's overboard and you want to create some visual interests, you want to tell people's eyes where to go. When you have different elements set different ways, you're creating a hierarchy already. You want to make sure that people read it as having hierarchy instead of just one mess of watercolor texture because this is still a brand at the end of the day. Hopefully that has inspired you for your own layouts. Moving on, the next video, we'll go over how to digitize your own watercolor textures and vector elements if you choose to make your own. 10. Create Your Own Vector Assets: In this video, I'm going to show you how to create your own vector elements. If you don't want to use the ones included in the mini watercolor kit or if you just have something in mind that you want that's not quite there that you'd like to draw out and create for yourself, I'm going to show you exactly how I made the assets in the watercolor mini kit. Right here you can see a scan that I've done. I scanned the synod 600 PPI with my little 8.5 by 11 printer scanner combo, super basic scanner but it enabled me to scan at 600, so that's what I did just to have the best resolution possible. Just scan it in and then I opened it up in Photoshop. Here in Photoshop, I'm going to do a couple of things before we bring it into Illustrator and vectorize it. If you don't have Photoshop, you can still vectorize it in Illustrator. This step is just extra so you can retain a few more of the details. This is what I usually do. Now that I have it in here, I'm going to come over here and I'm going to add a levels adjustment, and if you don't see this panel over here, you can get to it by going window, adjustments. I'm just going to click on this little icon, this is called non-destructive editing. A lot of people like to come over here and go image adjustments and then apply it, but when you do that, it creates a permanent adjustment, so if you end up wishing you didn't go quite as dark as you went, you can't go back and change it as easily as you can if you use the adjustments panel. Please get in the habit of using the adjustments panel. You can always see how it creates a mask and you've got this little icon. If I change this and I hate it, all I have to do is click on here and I'm right back where I started and I can easily change it, I'm not committed to anything I did before. What I usually do is, so this is how it starts, I just drag this black node in a little bit and this makes my darks darker. Then I apply a brightness contrast adjustment. You can see I've got a few folds here in the paper, and I want to get rid of those so I'll increase the contrast all the way and then sometimes I'll bring the darkness back a little bit to make my darks darker and you can see the folds in the paper disappear as well. Say I only want this one element right here to bring into Illustrator, I could bring the whole thing in if I wanted to but for the sake of time, I'm just going to show this one. First, I need to bring these all together, so I'm going to double-click on the background layer just to make it a regular layer. I'm going to group these together. I hold Shift and selected everything and Command G or Control G in a PC to group them. I'm going to make a copy because we're going to merge this whole thing, but if I ever want to go back and change things, it would be nice for me to have a backup copy. This is another habit that I think is a really good one to have. I'm clicking and then I just drag and now I've got a copy, I can turn that off. That's just my spare if I need it. Now with this group that's visible, I'm just going to right-click and merge group, and then once I do that, all of those settings that I had applied previously have become permanent. I'm on my keyboard to grab my rectangle tool, and I'm just going to select this little element right here. I'm going to hit Command C or Control C on a PC to copy, then I'm going to hop over into Illustrator. Now that I'm in Illustrator, I'm just going to hit Command V or Control V on a PC to paste, and I've got my little leafy element right here. I'm going to image trace up, but don't freak out because I know a lot of people hate live tracing, but we're going to fix it up. It's still going to retain the hand-drawn quality, but we're going to do a minor editing to keep it a lot cleaner than what live trace does by default. I'm just going to click ''Image Trace'' up here. If you don't like the settings, how they show up like if I zoom in here, you can see it's a little bit rough, but we're going to go in, we're going to fix all of that. You can bring in the slider and you can change, like if you increase your threshold, that increases the amount of points you have, so it's not quite as smooth. But I like keeping it around the default because I do do all that extra editing. Once you're happy with whatever live trace did you can hit ''Expand''. Whoops, I didn't get rid out my white, but that's okay. I'm going to hit Command Shift G to ungroup because everything is grouped by default, and then I'm just going to select my white and, whoops, Command Shift G, select the white and then delete. Now I'm going to come in here, and there is two ways that you can clean this up. The first way, if you have awaken tablet or if you're just really amazing with your mouse, you can hit ''N'' on your keyboard and you can just grab. You have to start along the path, but with your pencil tool, you can strain out some of the rough areas just by free handing, I'm doing this with a mouse right now, but I would typically do this with the tablet. That's one way to just do some really quick editing on the problem areas. The other way you can do it is going in with your pen tool. Since this one is a little rough looking, I can hit ''Hyphen'' on my keyboard and that activates my delete anchor point tool. I can delete some of these anchors or most of them if I want this to be way cleaner than how it first came out, and then I can hit my A key and then I can adjust these handles and make it a lot cleaner. It just depends on how clean you really want it to look. If you want to keep it a little more bumpy and hand-drawn or if you just want to clean it up a little bit more. Those are two options with cleaning up your vector elements, so that's how to create your own vector elements from a hand-drawn sketch. In the next video, I'll show you how to create your own watercolor textures and clean them up and digitize them. If you want to use your own watercolor textures, I'll show you how I created the ones in the mini watercolor kit. 11. Create Your Own Digital Watercolor Textures: In this video, I'm going to show you how I digitized the watercolor textures, so if you want to create your own and use them on your logos, you'll be able to use them now. This is the process that I went through. As you can see, they're cut out from the watercolor paper because the watercolor paper was bigger than my scanner bed. But this is one of the scans. I scanned them in at 600 ppi, just like the vector elements, just so I could have as much detail as possible, especially with these watercolor textures. I'm going to show you how I take them, how I increase their brightness and their vibrancy, and then how I take all the white away so you can place it on any color background as a transparent PNG. We're just going to grab this blue one down here and edit that one. I'm working in Photoshop for this whole thing. I'm going to hit, "M" on my keyboard just so I can make a rough selection of the blue, and then I'm going to hit, "Commands C" or "Control C" on a PC to copy it, and then I'm just going to go, "File", "New". This is already grabbing the settings for that size that I just selected. I'm keeping it RGB, and then you can reduce the resolution to 300. I wouldn't go lower than that just to keep that quality and 300 is the print standard resolution. As long as you have 300, then anything you print, as long as you don't go to much bigger than the size, it's still going to look great. We can bring this down to 300 for ours and it'll make your file sizes smaller too. I'm going to hit, "OK" and then just hit, "Command Z" or "Control V" on a PC to paste it in. There's our watercolor. The first thing you want to do is double-click on this background layer and hit, "OK, so now we have a white background layer, and then we also want to add a black background layer so we can test what it looks like once we start cutting it out, how it looks on different colored backgrounds. I'm just going to create a new layer right here, and then over here I've got my black and my white. If you don't have black and white showing over here, all you'll have to do is click this little icon and you'll get it. If you hit, "X" on your keyboard, this switches them back and forth, which is a really handy shortcut when you start masking things. I'm just going to hit, "X" once so that pushes the black to the background. I'm going to hit, "Command Delete" or, "Control Backspace" if you're on a PC and that's just going to set that as the background color. That's another little shortcut to add a background color or color fill. Now that we have all that in place, we can get started. The first thing I'm going to do is add a Levels adjustment. Just like we did in the vector elements, come over to your Adjustments panel. If you don't see it, you can get to it by going, "Window", "Adjustments" and click on this icon for levels. I'm just going to bump up my vibrancy, so this is going to take all the darks in the color and really make them vibrant. As I drag it, you can see they're getting really vibrant. I can bring even a little bit of white to brighten it up a little bit, if I'm feeling like it's getting too dark and just play with that until you're happy with that saturation. Once you're happy with that, this is one point in time when you can either create copies so you have backups if you want to come back to this. If not, we're going to merge these together. Just heads up, we can't change this now once we merge them. I'm going to hold, "Shift", select my color layer and then right-click "Merge Layers" and definitely make a copy if you're on the fence with your adjustments. Now that these are merged, this is where I'm going to start deleting the white off the background. I'm going to come over here and select, "Color Range". I need to sample the white, so I need to make sure I click where the white is. This is already doing it by default since I had done this earlier. But you want to make sure when you get your Eye Dropper showing up that you click on the background and then that selects the white, so that's what we're working with. Where you see fuzziness, this is controlling the level of white that's going to appear, and to get the same settings I'm using, make sure that you check this little box for Invert. I don't think this makes a difference with whether or not you have selection or image. This just gives you a little preview of what's going on. But the selection preview, make sure you have black matte checked, and that way we'll be looking at the same thing. Right here, you can see the lower it is, the more white that's showing up, and then the higher it is, the more white is taken away. I need to find a middle ground in here and don't worry about this black showing through here because we can easily fill that back in if we don't want any transparency in the center of our watercolor texture. Right here, I would say around 95 is good for this texture. It'll be different for any texture that you have, so you just have to play with it a little bit. One of the main things that I look for when I'm deciding what number to rest on is, I look at the edge and you can see there's just a very small sliver of white right there, which is easy to get rid of. That's why I think this number is really good for this particular texture. Once you're happy with that, just hit, "OK". The next thing we need to do, if I zoom in here, you can see I'm right on the cusp of this edge right here. If I just make a mask right now, I'm going to get little bits of white all around here. I just need to bring the selection in just a little bit further and you can do that. Let me zoom out so you can see what's going to happen. I can do that by going up here and go, "Select", "Modify", "Contract". I'm just going to enter in two pixels right here and hit, "OK". Now, if I zoom in here, you can see it's much closer to the edge. Once I'm happy with how that looks, I'm just going to come over here, make sure you're on your color layer, and then click this little icon to add a mask. Now that deleted everything that was selected. This is my black background and there's a white background. I can even, if I wanted to put a color there so you could see it a little better. This is what it looks like on an actual color background. You can see it peeking through. It's a lot easier for me to work with black, so I'm just going to do that right now. We need to come over here because we still need to add more masking. The important thing to remember when you're masking is black conceals and white reveals. So anything that's painted white reveals what's underneath. Anything that's painted black, hides it. Over here, we're going to come over to our mask, and I'm going to zoom in, and whenever you are using a mask, you're using a brush tool. You're brushing in either black or white because you're going to reveal things or you're going to conceal things. I'm going to hit, "B" on my keyboard, and that activates my brush tool. I'm going to use this handy little brush number 36 over here. It's really cool because every time you click with it, let me make sure I've got the right color, so I want to get rid of all these little dots right here. I just want to fill that in. It's really cool because every time you click, it changes shape, it rotates. So it feels more organic with the edges that we have, so it's the perfect brush for this. Right now, this is concealing, so I need to reveal the color, so I need to use white. I'm going to hit "X" on my keyboard to bring the white to the forefront. That's the color I'll be painting with, and I'm going to increase the size of my brush by just hitting my close bracket key on my keyboard. I'm just going to paint this in. Now I don't have any holes in my texture. Just speeding through this because you get the idea. I'm just filling all of this in. Now we need to get to the edges. I need to switch over to black now, so I'm just going to hit, "X" on my keyboard. I use that shortcut all the time. I'm just going to paint away the stuff, I'm going to conceal it because I'm painting with black. Let's come into this kind of funky edge and we need to conceal pieces of this. I'm going to lower the size. Now, as you can see is, if I just click around pretty quickly, it feels a little more natural, like it was part of what was intended with the watercolor originally, and this just makes it more of a natural edge. I can just keep clicking and letting it rotate. Right here, since it's in the middle part over here, I definitely want to paint this part out. But when you get to the edges where it's a little bit faded, maybe I want to keep that more of the watercolor texture, so if I hit, "X" on my keyboard and just paint it in, then I can keep that instead of removing it. I'm going to hit "X" again to get rid of this extra bit over here. If I zoom out, now you can see it looks like a pretty natural edge. Believe it or not, I will go around every single texture and make those edits. Make sure it's clean and perfect, so you guys get the very best textures and the finished look. Just so you have an idea of before and after. This is the finished one, and to also show you how it looks when there's a color behind it. Here's what it looks like when black's behind it, so you can see there's some really nice transparency going on around some of these edges, and then on white obviously, it's really beautiful. That's how to create your own digital watercolor textures that you can use for your own logos or any type of future artwork that you want to include watercolor textures on. 12. Preparing for Web: Now that we have our logo, we need to prepare it, for whatever application that's going to be used on, whether it's print or whether it's web. We're going to start with web. This would be if you have an application that it needs to be used online, for example, if we want to put this logo on our website. What I'm going to do is select everything I am just rubber-band selecting and then hitting Command Z or Control C on a PC to copy it, and then we're going to come up here and go file new. Since this is going to be for web, we want to make sure that our units are set to pixels. Just toggle down right here and choose pixels. Hypothetically, we're going to say that our image needs to be 300 pixels wide. Right here where it says width, I'm going to input 300 pixels. The height doesn't really matter right here, right now. But we can fix it later once we get into the document. If you don't see this right here, you can get to it by toggling this little arrow down here advanced. We need to change our color mode to RGB. This is very important because RGB is what is read by your screens, so your colors are the most vibrant that they can be when looked at on screen. I'm just going to toggle this down to RGB. Raster effects is your resolution. You need to toggle this down to 72. This is the accepted screen resolution. It makes low times the best online and it optimizes your images, so everyone can view them really quickly and really easily. Just toggle this down select Screen 72 PPI. This little errors coming up, don't worry about it. It's just saying right now, the mode is CMYK right here, and this is a different color mode than what we're currently using. Just hit Okay. Now we're in our document and obviously this is much longer than we probably need it to be. But right now we're going to paste in our logo by hitting command V or control V on a PC. Once you're in here, I'm just going to zoom in up here, so we can see it a little bit better. Obviously it's not wide enough. It's not 300 pixels wide yet. If you want to see exactly the increments on your ruler, all you have to do is hit command R or control R on a PC. You'll see here's your little rule bar that's showing how many pixels. If you right-click, you can see it's set in pixels. Now we're just going to hold Shift, grab a corner node and we're just going to scale this up, so we fit as close as possible without going over our artboard. That looks pretty good. Now we need to bring this artboard up a little bit. Now, if we didn't have this watercolor texture masked inside, we could go object artboards fit to artwork bounds. But when I do this, it's grabbing where the watercolor textures and the large color texture bounds are actually here. They're just hidden right now because of our mask, so we don't want to do that. The way that you can use this, if you have the watercolor texture in here, which you should, you can come right up here to documents setup and just click here and then click Edit artboards. You can also get to that by coming over here in your toolbox and selecting this little icon right here. This is your artboard tool. There's two ways to get to it. If I scroll down here and I just grab this node, once I have my little arrows, I can just click and drag it up. This is just automatically changing the size of my artboard. I'm just going to drag it up close to my logo. That looks really good. If you ever wonder what the size is, you can see it right here. Exactly 300 pixels wide, but my height is a weird number, so I'm just going to even it out and choose 215. Then you can just hit V on your keyboard and you'll return to your normal view. You can save for web in Illustrator by going File, save for web. Over here you can dictate whether you want a transparent Kanji or if you want JPEG. Right here you can see if you toggle it down, you can even choose a GIF with you up. But I usually keep it at either a JPEG or a PNG. Right now we've got the settings for PNG and you could just hit save right here, show where you want it to be saved and then you're good to go, if you want it to be a JPEG, all you have to do is toggle this down, choose JPEG high, and by default, it ends up being 60 percent quality. But as you can see, it's a little fuzzy around some of the edges and it's just my little habit. I always increase this up to 65 percent, just so I have a little bit of a crisper image just to play it safe. Once I do that, everything else looks great, 100 percent. You want to make sure image's size. All of these are correct and once you're ready to save, just hit save and you're good to go. That's header a save for Web in illustrator. Now if you want to use Photoshop to do the same thing, copy your logo that you created in Illustrator or in Photoshop. Come over here and go File new. Once your window shows up, just the same thing. We already know that we want our height to be 215 pixels. We can actually skip ahead and just put that in right here 215. We want our resolution to be 72. We want our color mode to be RGB. Background contents can be white or transparent, depending if you want a transparent PNG or if you want a JPEG. You can see right here, you can title it down, choose transparent. Then this is already titled up, but everything is good right here. I'm just going to hit Okay. I'm going to paste in our logo, paste it in as a smart object. Hit. Okay. We're just going to scale this up to fit our board. That looks good. Right here, to save this for web, we're just going to go File save for web. Then right here you can choose all of your settings, and you can see the preview right here. You can just hit save when you're ready for that. If you'd like to make a transparent PNG, I'm just going to turn off my background layer, go File, save for web. Then you can choose PNG 24 up here and you can get your transparent, nice-looking logo there. That's how to save for web. 13. Preparing for Print: We just went over how to save your logo for the web. Now if you ever need to hand off your logo for a print application, I'm going to show you how to do that. If you're in Illustrator, all you need to do is grab your logo, Command C Control C on a PC, File, New. We're creating a new document. We want to make sure this time it's a print document. We're going to change our units back to inches. Or if you're in Europe, millimeters or centimeters. Over here under the advanced little toggle down, make sure color mode is changed to CMYK, and that your raster effects, the print resolution standard is 300 PPI, so make sure you change it to that. That just optimizes the quality of your logo for any print application. Depending on what size you need your logo to be when you're handing it off. Usually I would say you'd hand off a vector file, but on a rare occasion you might need to hand over a JPEG that's setup in CMYK. We're going to use the ladder option as if you would need to hand this off as a JPEG because you already have your logo file setup an Illustrator. I'm just going to change the width here, let's say five inches is pretty solid for us handing off a logo. I'm going to hit Okay. I'm just going to paste it in, once again Command V or Control V the on a PC. I'm going to zoom in here so we can scale it up. Once again you can hit Command R or Control R on a PC and bring up your ruler so you can see exactly the length of your art board here. I'm going to hold Shift, grab a node and scale it up, get as close to the art board as possible. Once again you can see we're working in CMYK since this for print. Just like we did before, we're going to reduce the size of the art board so it surrounds the logo. I'm just going to hit this icon this time in my toolbox. I can just grab this bottom node and bring it up. Once again you can see our width is five inches and our height is 3.61. We'll just even it out slightly. I'm going to do 3.75, three and three quarters. Then hit V on your keyboard and that'll return to your normal view. There we go. If you want to save this you can save it as your Illustrator file from here just like you normally would, or you can save it as an EPS file. You can also export it. All you have to do is come over here and hit Export and that can also save it as a JPEG. That's how to save your logo for a print file in Illustrator. If we jump over to Photoshop, I'll show you how to set up this file. You just go File, New. Once again we'll just input the same value. It's inches and we want 5 by 3.75 inches. Our resolution set to 300 CMYK. Background contents can be white. I'm just going to hit Okay. I'm going to paste in the logo is a smart object. I hit Command V or Control V on a PC. Zoom out a little. I'm holding Shift, grabbing a corner node and then scaling it up so it stays proportional. Scaling once again and fitting it right in there. Then from here you can File, Save As, and just save it as a JPEG, and then you can hand that off. That's how to save for print in Photoshop. 14. Final Thoughts: So that's our class. Thanks so much for enrolling and I really hope you enjoyed it. Don't forget to pick up your frame, any watercolor texture kit, if you haven't already. There's also a resources PDF that list out every single resource and as I've mentioned in the class, as well as the full watercolor texture kit, along with the discount code. There's also a free watercolor logo cheat sheet to really get your gears moving for your own logos. I'd highly encourage you to complete the project for this class. It's the best way to really remember and use the techniques used for future projects. You don't just have to use this for logos, you can use it on your own future illustrations and typography. For more ideas on how to use watercolor textures in your work, check out my blog every-tuesday.com. If you enjoyed this class, please give it a thumbs up. I can't wait to see what you all make and I will see you next time.