**Please note the video file is large and may take a few seconds to load**
Lunch & Learn Important Links:
- DEAL OF THE WEEK: Mike Capuzzi’s SMART Ideas newsletter
- Download Gimp for Free!
- Click here to download the transcript from today’s Lunch & Learn
Lunch & Learn Transcript:
Lauren: Hi, everyone. Welcome to today’s CopyDoodles Lunch and Learn. I know it’s been quite a while since we’ve had a Lunch and Learn. I think this is actually the first one in March, if I’m correct, since I was away last week.
A few side notes, if you didn’t leave a question or if you want to ask any question during today’s tutorial on GIMP make sure to type them in the questions box on the GoToWebinar screen, and I’ll answer them probably during the webinar and any questions afterwards.
Hopefully this recording will work since last time it didn’t work at all.
A few side notes, our next topic in two weeks will be Simple and Strategic Off-line Marketing Tips, and though I have a brick and mortar business as the picture here this will apply to everyone, so make sure to tune in, it will be our first and April. And happy first day of spring, because that was yesterday, sorry, a little off topic. I’m trying to go fast and get everything covered.
So in today’s webinar we’re going to be talking about creating better than ever CopyDoodled pieces in GIMP. If you joined me last time, thanks for joining me again. We’ll be doing a few things that are similar, but I’ll also be showing you a few other techniques too, just so that you’re not bored out of your mind.
Let’s get started. I have GIMP open. If you do not have GIMP, then head over to www.copydoodles.com because I believe on the post that I did last month I put the link to GIMP, it’s www.GIMP.org. You can download that for free. I’m not sure if they have a Mac version for the newest version of Mac, but I know that they do have it for PC if you’re using a PC.
First I’m going to begin by showing you all of the tools in the toolbox, because this is probably the most important part of GIMP. You’re going to want to get familiar with this area over here on the left hand side. That’s where you’re going to be doing basically everything that you need in GIMP. Today I’m going to be showing you how to create an ‘add to cart’ belcher button. I’m going to be showing you how to create a banner ad. I’m also going to be showing you some cool things that you can do to CopyDoodles bubbles in order to change the color, because I recently had a question about this and I thought it was a really great thing to cover here, because you can really tweak and change anything that you like when it comes to color when it comes to CopyDoodles. You can really do anything in GIMP.
So most important is probably to start in the toolbox. This is the rectangle select tool, this is the ellipse tool, those are tools that you will use if you ever want to create shapes or fill certain areas with color, and I’ll show you how to do that when we get to the belcher button that we’re going to be creating. But the things that I like to use the most are the color picker tool, this is this little eye-dropper here, so if you ever want — let me pull this in. So this is just a belcher button, if you ever want to copy a color, so say you know you want this yellow color to be in the text that you’re writing or you want to make sure that you have the same blue, all you do is use the color picker tool and click on that color and it will show up in this box here, so then you can use that color for text, you can use it to fill any boxes, you can use it basically for anything. So, that is a really important tool.
Also the zoom tool is very important and we’ll be using that a lot just to zoom in and zoom out. It’s really, really simple to use and I’m sure you’re familiar with it from using it in other programs. The move tool is what you’re going to use and you’re going to have to click on before you ever move anything in your piece. So you could be using the lasso and you’re on this layer over here, but you’re going to need to use the move tool in order to move it around in your document, and we’ll be using that a lot. Once you get familiar with GIMP you’ll be using it a lot too and it won’t be so hard. The crop tool is another really important tool, it is this little knife here, so if you ever wanted to crop out something, you just wanted this ‘add to cart button,’ you just click the crop tool, create a box over the item that you want to crop and then press ‘Enter’ and it will automatically crop.
The rotate tool is also very important, it’s right next to the crop tool, as you can see with the little arrows that show something is rotating. What you would do is you’d click on the rotate tool, click on the item that you want to rotate and then just rotate it however you’d like and press ‘Rotate’ to confirm. Press ‘Cancel’ to change your mind. The resize tool works basically the same way as any other resize tool as you would use in Word or Publisher, or any programs that you’re using. You click on the item you want to resize and then you resize it any way that you like. One note to add that when you are resizing in GIMP if you want to make sure that you’re resizing so that your item is always equal, so that you don’t stretch out your image like this, or you don’t stretch out your image in this way. Make sure you hold down the control button when you’re resizing, because that will ensure that everything is equal.
The text button is really important. We’ll be using that a lot today too. It’s very similar to really any other text button that you’d use in any other program. You click on it. You create a box. The only difference is that you don’t actually see your font typing in the box. You type in this little box right here, the GIMP text editor, you put all of your text in there and then once it comes up — so, if I wanted to write, “Hi, my name is Lauren,” or something like that, your text will come up, it’s a little hard to see because I’m typing on top of this background there. Your text will come up, you change the color from this dropdown box that comes down, you change the font by clicking on the font item here, and it will automatically change. You can also change the size really easily just by clicking these down and up arrows. I really like that feature in GIMP because if you’re not exactly sure how big an area is or how big your font needs to be, all you have to do is click the little arrows until your font is the size that you need it to be. You don’t need to figure out what font size you need, or think about it too much.
You change the color here. So if I wanted to change the color I would just click on the color button down at the bottom of this toolbox and I would choose either a color that I had recently used, say I wanted to use orange, or I could even use these little arrows here, and adjust the hue, I could adjust to really any color that I like. On the left hand side here you will see the current color. So whenever you move these sliders the current color will change. I’m just going to press ‘OK’ and as you can see my text automatically changed.
The bucket tool you will probably use a lot too. If you are ever creating a rectangle
item — let me just create one really quickly, just to show you. If I created a box right here and I wanted to fill it out with this blue color, that is exactly what the bucket tool does. It just fills an area with color, with whatever color you choose. If you want to change that color you click on the color at the top of the toolbar, change the color like I just showed you. Press ‘OK’, and then you refill that item.
Some other quick shortcuts that you’ll want to know and you’ll probably want to write down if you don’t use these, ‘Ctrl Z’ is to undo something. So, say, I painted this box pink, but I changed my mind. I’d like it blue ‘Ctrl Z’ and it will automatically go back. You don’t have to find the undo button. ‘Ctrl C’ is to copy. So if I want to copy this layer, as you can see it’s already highlighted, but if I want to copy it I’d press ‘Ctrl C’. If I want to paste it I’d press ‘Ctrl V’ and it would create another layer. In order to cut it from my document I’d press ‘Ctrl X’. So ‘Ctrl Z’ is to undo something you did; ‘Ctrl C’ is to copy something; ‘Ctrl X’ is to cut; and ‘Ctrl V’ is to paste. So that should cover all of the really step-by-step basic start-ups.
The first thing that I’m going to show you how to do is how to create a belcher button very similar to this belcher button right here. The only thing that I’m not exactly sure how to do in GIMP, and if somebody knows how to do this, or if you guys are familiar with it and can tell me, I might even do some research to find it out myself, is to figure out how to add this strikethrough right through the text. I’m not exactly sure how to do that, so today I’m just going to put: “Regular price: $2.97, Today: $1.97,” and I’m not going to put that line through it.
The first thing that you’re going to want to begin with when you’re in GIMP is knowing the size of the item that you want to create. What I do normally, if I have a blog, is I find out the width of my blog from either my webmaster or I know. Most blogs will actually be around 500 pixels wide. You’re always going to talk in pixels when you’re using your computer. You’re never going to talk in inches.
So most are about 500 pixels wide. The belcher button is actually 460 pixels wide and 220 pixels high. That’s just your typical belcher button, it’s always been that size. You can resize it to whatever size you want, but that’s just typically how big it is.
So if I want to create a new document I go ‘File’ — ‘New’ and I’m going to type in my width. So I want my width to be, and notice it’s always in pixels here. If you want it to be in inches you can do that too, if you’re creating an 8.5” x 11” or something like that. But, I’m working in pixels. So I’m going to choose 460, because that’s the width of a belcher button the long way, and then 220 is the height of a belcher button. I’m going to press ‘OK’. And as you can see I have my background and I’m ready to create anything that I want here.
The first thing that I’m going to do is I’m going to put in my text. So I’m going to click on the text button. I want my text color to be a nice blue color, very similar to the button that I showed you. So, I’ve recently used this dark blue. That will work. And I’m just going to create a box along the top. It’s going to say, “Regular price: $2.97, Today’s price: $1.97” As you can see the font is way too big. So I’m just going to make that a little bit smaller by using the arrows. I’m going to change my font too, just because I don’t think that this font — it’s a little heavy for a belcher button, so I’m just going to go probably over to Arial, which is a thinner font, and just use that. I’d like to center this and there is a justify area down here on the text bar, so I’m just going to press the center, so that it’s centered, and I’m going to close that.
Now in GIMP, the way that it works is everything works on layers. On the right hand side you can see we have another toolbox. This is the layer toolbox. As you can see one layer is the background, so that’s white. If I wanted to change that to this dark blue, or I wanted to change it to pink, I would choose the color. I would make sure I was highlighted on the background, and I’d use my bucket fill and fill it. But, I don’t want to do that, but if you ever wanted to do that that’s really simple to do.
Next is my text, which created a new layer. So this layer lays on top of the background layer, and I can do anything with it. I can move it, if I wanted, if I thought it was too high up I would use the move button here and I would click on the font and move it. The one thing with GIMP when you do move any fonts or anything like that is you have to click on a letter. As you can see if I click on the background, there’s a lot of background there, it will actually move the background instead of the text. So just make sure you’re paying attention to what layer you’re on and what you’re doing.
OK, the next thing that I’m going to want to do is I’m going to create the big yellow button that says ‘add to cart’. So I’m just going to click my color and I’m just going to choose yellow as my color. What I’m going to do is use the rectangle tool and I’m just going to create that ‘add to cart’ button that is on your typical belcher button.
This ‘add to cart’ button, this yellow button, I’m going to create that now. So, I’m just going to create a regular rectangle, but something I didn’t do, and I did this just to show you guys, is I actually didn’t put my rectangle on a new layer. So, when I go to fill it I’m going to have some problems, as you can see it’s not filling. That’s because I tried to create a rectangle on the same layer as the text, and that doesn’t work. So when you want to create a new shape or anything like that, you need to create a new layer and you do that by clicking on this little piece of paper right here and pressing ‘OK.’ So now I have a new layer.
I’m ready, now I create my rectangle, and I fill it with yellow. And I’m going to put the ‘add to cart’ text right on top of it. As you can see my text is actually in yellow right now, that’s why it’s not showing up. So I’m just going to click the text color box and choose black. It’s already centered, so I don’t have to worry about that. I’m going to increase the size, and as you guys know if you wanted to change the font you would do that by clicking on the font button, just since we don’t have a lot of time I’m not going to play around with the fonts, but just if you wanted to do that.
Now if you did want to have that red line around the yellow box and you realize that you want to create a really quick rectangle or something like that to layer behind the yellow box, just so it looks better, you would just create another layer and make sure that the layer is underneath the yellow layer. So now we have another blank layer. I’m going to choose red. And I’m just going to draw another rectangle, it’s a little bit bigger than the ‘add to cart’ button. And I’m going to fill that with red. As you can now I have a little bit of an outline. You can play around with the sizing and things like that.
Then of course the only other things you would add on the button is you would add the ‘add to cart’ text right here that’s underlined, and you can easily do that by just creating another text box, and with text boxes you don’t need to create another layer, you just need to start drawing and it will create its own new layer, which is really simple.
So you’re going to add another ‘add to cart,’ you would underline it and there is an underline, which you can use here. There is a way you can underline it, it usually shows up in your little text box, for some reason mine’s not showing up. But it’s normally over here and it probably should show up for yours. I probably accidentally took it away when I was playing around with stuff. But, if you have any problems with it let me know.
Then the last thing you would use is you would probably add in your Visa, MasterCard, American Express, and Discover logos. You could easily pull those off line and then just pull them into your document and resize them and place them underneath all of this button. But your belcher button will be done.
The last thing that I always use a CopyDoodle border around my belcher button. So I already downloaded this CopyDoodles border, as you can see here. If you want to download this, it’s in the CopyDoodles Access Club, just search on the search term
‘box 3’ and you’ll find it. All I do is I pull this image in. As you can see the CopyDoodles border is really, really big, so you can’t see it and it doesn’t show up on my screen and that’s really hard to deal with, but all you have to do is zoom out.
So, I’m going to use my zoom tool. I’ll make sure that I’m zooming out, and I click until I can see the rectangle here. The next thing I do is I choose the resize scale tool. I hold my Ctrl button and I just resize this until I think it’s the size that I need. And then I move it all the way over to my document. So as you can see I need to resize this a little bit more. So, I’m just going to scale it again, and as you can see if you do hold Ctrl for some of this, sometimes it won’t be the exact size, so once it gets down to it sometimes you do need to stretch a border or something like that a little more than you normally would and you won’t keep the exact same constraints, but that’s OK. I’m going to scale one last time, this keeps getting in my way. And press ‘Scale.’
As you can see I now have this really great CopyDoodles border around my coupon. I have my add to cart buttons, the only things that I need to add are my credit card buttons and of course I would need to shift this around a little bit in order to add them on, but I could do that with my move tool. You basically just play around with it and you’ll get a really great button.
The next thing I’m going to show you is how to change one of our BubbleDoodles. So I recently had somebody ask me about this. And they wanted to change the color of the outside of the BubbleDoodles, because right now it’s red and you can’t change it through the CopyDoodles Access Club, but you can very easily change it in GIMP to any color that you like at all. So the first thing that you’re going to want to do before you do this is you’re going to want to delete the center here. And you really simply do that with the fussy select tool. The fussy select tool will select all of one color. So if you have a solid color in something that doesn’t have any gradients, that doesn’t have any shading or anything like that, it will select all of that one solid color. So if I click there and I click in the middle of this BubbleDoodle and press ‘delete,’ as you notice it deletes all of the white.
The reason why I didn’t just click on the red is that our CopyDoodles look so much like an actual marker that they actually do have some shading and some color variations when it comes to the red borders and the red outlines that we have, just so that it looks more realistic, which is why you cannot select all of that item.
So the next thing that I’m going to do is go to ‘Select’ and choose ‘None,’ so that I’m not selecting anything in my document. Finally I go to ‘Colors’ and I choose ‘Colorize’. Colorize allows me to change the color of the only area left in my document, which is the red area. So now you can just play around with this. The saturation, I like to beef it up because it just makes it brighter, it makes it more noticeable.
Then you can really go and move the hue bar to any hue that you like, as you see. So you can do yellow, you have green here, there’s some blues, purple, pink, red. So as you move it the color will change. You can also change the lightness and darkness, if you wanted a black border you would just make it so that there was not lightness, there was a lot of saturation, and you would just kind of play around with it from there. And press ‘OK’.
Now I have the purple bubble that I want, but there’s no white area in there. So, the next thing you’re going to do is click the color tool and just choose ‘white,’ and press ‘OK.’ You’re going to fill your bubble back up, fill up the background so that it’s white and now you can see, and you’ll be able to add in any text that you like, and of course you can add in a CopyDoodles text, you can add in an Arial text, anything that you like and it will have the bubble around it, just make sure that you choose the right size that you want, the correct font, CopyDoodles will show up in GIMP and you choose whatever color you want, because a lot of times you could be typing, like I am right now, and it’s not showing up, that’s because the color is white, and I make this mistake all the time. I’m like, “Where is my color and why can’t I see anything that I’m typing?” That’s because I’m typing in the same color as my background.
It’s really, really simple and easy to change that. And then finally I’m just going to show you how to create a banner ad or an image for your websites. So a lot of you might be putting images in your blog posts, or you might be putting banner ads in there, or you might be putting them on the side of your website, or even this is useful when you’re creating the header of your website, or a footer on your website, because you’re going to want to use GIMP in order to create that.
So last tutorial I showed you how to create this banner, basically I just created some rectangular text boxes, filled them with color, pulled in an image that I liked and then put a bubble on top of that. And then I put a button at the bottom and added in some text. It was really simple to do and from what I showed you on how to create the belcher button you should be able to easily do that.
So today I’m just going to show you how to create this Post-it note banner ad that Mike and I created. And the reason I want to do this is because I want to show you something really cool that you can do with these. So, say you pull in a CopyNote into your area. Now this is really, really large. This is 953 pixels x 942 pixels, and I know that because GIMP gives you your image size right at the top bar here. So I’m going to want to scale my image and instead of me actually scaling my image using the scale image tool, which I was using before, I’m actually just going to type in the width that I want. So, say I know my sidebar is 250 pixels wide. So, I choose 250 and click down and it will automatically resize the height of this item so that it’s very proportionate. Press ‘scale’ and now it rescales and it’s smaller.
I’m going to use my zoom tool and one thing that you might want to note down is that if you want something to fit your whole page and you’re using the zoom tool, all you have to do is click and drag the zoom tool around the location that you want to view and it will automatically put it on your whole page, instead of having to click ‘zoom in,’ ‘zoom in,’ and then it’s too big and then you’re playing around with it, things like that.
Something very cool that you can do with this that I recently found out is you can actually put a filter on this item. Under ‘Distort,’ if you click ‘Filter’ — ‘Distort’ you can actually create a page curl. OK, so this screen will come up and it will ask me where I want my page curl to be. And, I want it to be in the lower right down here, and the curl orientation is vertical. So that’s fine. I press ‘OK,’ and it will automatically curl my page.
Now it looks very dramatic because this is a Post-it note and it doesn’t look correct, but if you do have a large piece of paper, or something like, this will look a lot more realistic than it does on this Post-it note.
And if you want it to look more realistic you actually would need to change your background so that the background, instead of being transparent like this, if it was yellow when it curled up the back of your Post-it note would have been yellow too. So, let me just exit out of that again, pull this in.
I’m just going to really quickly show you how to lay out your banner ad. Say I wanted to it to say ‘Click here,’ like I have right now. I know that this was a red color. I also know that my font was Impact, I’m going to increase the size.
The next thing that I want to add in are my arrows, and I’m just going to drag those in. As you can see these aren’t too big, so I don’t have to resize them very much, but I will have to rotate them. So I’m going to scale them first to be a little bit smaller — ‘Scale.’ And when I rotate, I’m just going to rotate a little bit so that the size fits perfectly. If I wanted to copy this CopyDoodle so that I didn’t have to resize it and everything, all I would do is press the ‘create a duplicate layer’ and it will automatically create another arrow CopyDoodle for me. And I can easily flip it using the flip tool, and clicking on it like that, so every time you click on it, it flips the image. And I’m done.
So now I have two arrows. I would add in my other text for the banner ad underneath this, but I know we don’t have a lot of time. So, I’m just going to show you then how I added in my stamp. I just pulled my stamp in. I just resized my stamp. It will be pretty small, and then I really easily rotated it and placed it on top of all my text that I had typed in.
And like I said you can use CopyDoodles text. So, if I wanted to have this, any CopyDoodles font, I’d choose the color and then I would just choose a CopyDoodles font that I have on my computer. I’d increase the size and I’d play around with it.
So, it’s really simple. Creating all of your items in GIMP basically work the exact way. You’re just going to need to learn how to play around with it. Make sure that you pay attention to your layers. Obviously if I want this stamp to be on top of my text, because right now it’s actually not, I want this to be on top of my text, all I have to do is click on the layer on this side and use the up arrow and it will be on top. It’s basically just a little different than using Word or using Publisher. Instead of bringing to front you have all of your layers viewed right here and it’s a lot easier to play around with it and move them around because you’ll be able to move them to the exact area that you want to be in. Sometimes it can be a little confusing when it comes to using Word.
So at this time if anybody has any questions at all for me about using GIMP or using CopyDoodles in GIMP, feel free to type them in. If not this webinar will hopefully work and the recording will save and you’ll be able to watch the replay, send it over to people.
Thank you, Beverly. I’m glad you enjoyed the webinar.
If you guys have any questions at all I’m always on live chat too. I would be more than happy to walk you through GIMP or any questions, or if you even log-on to live chat at www.copydoodles.com and you really need help and you need me to do a webinar with you, just a personal one really quickly, like ten minutes or something like that, I would be more than happy to help you with it, because I know that this can be very confusing and I want you guys to get the most out of your CopyDoodles Access Club membership and be able to create the coolest stuff without having to hire a graphic designer.
So thank you. Join me in two weeks; Simple and Strategic Off-line Marketing Tips. And today’s webinar replay will be posted at www.copydoodles.com I will post on Facebook when it is up there. So make sure to stay tuned, and thank you for joining me. Happy Spring again to everybody. I hope you’re enjoying this great weather and enjoy the rest of your day!