Wednesday, 9 February 2011

Banner Designing for Dummies

Hi guys!

A special hello to all the shop owners listed on the right hand side of the blog, where they will stay for about a month before we list some new ones. Take a peek at their shops, I think there's a nice variety of them so you're sure to find something you like.

So this post is going to be about shop banners. I say it's for dummies, but it might be more accurate to say this has just been written by a dummy, since I'm no graphics design pro. However, even with my limited skills, I feel I've managed to make a half-decent banner over at Po&Mo's. And if I can do it, so can you! I've included some videos that show exactly what you need to do.

What Programme Do I Use?
Most computers come with a basic paint programme, called (oh so originally) Paint. It's a very basic programme, but has its limitations. I personally do not use it. There are also options out there if you want to go and spend a lot of money. Paintshop Pro and Adobe Illustrator are good examples of these, and although you can find free trials of both, they expire after 30 days.

Luckily, there is an option between the expensive and the basic. I use Paint.Net, a free piece of software that has the more advanced features you need to create a spiffy looking banner. After downloading, start up the programme. This is where the fun begins...

What does this button do?
It's easy to be overwhelmed when you first open Paint.Net. So many shiny buttons to press! But don't go crazy and press them all at once...your computer will explode!!! Heh, not really. No, when you start it's important to see what sort of size you're working with. For a folksy banner, this is 100 pixels high by 900 pixels wide. So how do you change the image size? Watch and learn my friends, click play!

Ahh, I see what I'm working with now!
So now you're aware of how much space you have to work with. Now how about we add a background to make your banner more eye catching? This is where we learn a very important lesson about using Paint.Net. Layers are important. What are layers, I hear you cry? They are like the components of your banner, and each one makes up the whole. So every time you add something new to your banner, it's recommended that you put it on a new layer. This way, if you don't like something you've done, it's easy to get rid of. So, let's add a background, and then add a new layer on top of it for the text.

You need to select the fill tool, and pick what colour you would like. There are also several fill options, such as confetti, diamonds or checker board effects. Pick whichever one you like, or simply go with a regular fill. We're going to fill this banner with a pink and purple with a diagonal brick effect. Click play to see this in action.

Well this is just so simple!
I know, right? It is literally a few clicks and you're already halfway there with your banner. Now, we can work on layer 2 and add some text. This means working with the text tool. Now I don't wish to alarm you, but the text tool that comes with is very unforgiving. It just doesn't like people, I'm convinced of it. However, this is where the magic of layers comes in - if you make a mistake, it won't effect your pretty background. You can just either delete the layer (using the red X button next to the add layer button when layer 2 is selected) or press "undo". There is also a keyboard short cut for undo, the same as you'd use in Microsoft word - just hit CTRL+Z.

So, onto the text. Some important things to note; clicking outside the text means you're done with it. So be very careful where you're clicking, because this can be very frustrating. Now for this banner we're going to put "Banner making for Dummies." The text will be in black, and the font we're going to use is Segoe Print. Go on, click play!

Sheesh, why did I even need this guide?
That is a very good question, since you're nearly done! The only thing to do now is save your banner. Now folksy wants your banner saved as a gif or jpeg file. Now, will save your image as a pdn type by default. However, this is easily changed. When you save your image as one of these file types however, it will squash all the layers. This means you will not be able to edit it as you have been. Because of this, I recommend you save it as a pdn before you save it as a gif or jpeg. Does this all sound like goobledegook to you? No worries, just click play for the last time and all will become clear!

All done?
Yep, you really are! The only thing you need to do now is upload it to folksy by editing your shop appearance. I hope this guide has shown just how easy it is to make a basic banner. Once you're confident with the basics, you should try out some of the other features Paint.Net has, particularly under the "Effects" and "Adjustment" tabs. Feel free to comment with any questions you may have, and I'll try to help where I can.

Happy banner making!


1 comment:

  1. Thank you so much for this, have been searching for a decent tutorial for banner making for ages and some advice on what free software to get. Found two for the price of one here! :)