One of the best ways that online advertising is advertising banners. I'll show you how to animated banner ads using Adobe Photoshop CS3. It is an exercise aimed at a part of the Short Course I teach at the University of Bolton. I have a banner in advertising for the strengthening of Photoshop Short Course. http://data.bolton.ac.uk/dan/banner this flag display uses animation to the embassy. At the beginning we provide a static display, and later we will be a degree of animation.
We create a banner ad advertising for the Open Day at the university, or if you have specific topic that you want, then please do. http://data.bolton.ac.uk/dan/banneradvert.zip Download this file, he has the associated files.
First, open Photoshop and create a new document "File / New" or [CTRL + N]
468 pixels wide and 60 pixels high.
These dimensions are the size of traditional banners. I would 1st January pixel line to the top of the display, so that a new level "Layer / New" or [Ctrl + Shift + N] and select the Rectangular Marquee [M]. Now drag the entire document, so that all the advertising banner is selected. Choose a nice foreground color [I used black] to use and "Edit"> "AVC. Use a width of 1 pixel and place select" Inside. "Rename the layer" draft "and make sure about all the other layers, you are creating.
The beginnings of banner advertising.
Next we want to make sure that people know whom the message. Therefore, we will have a logo. At this time you can use a logo on the Internet or the logo of the university planned. Go to File / Open "and choose" logo.jpg ". You will notice that the logo away from large to your flag. So, if you click the "photo / image and to give it a height of 40 pixels. Is it small enough to be perfect.
Now, by using the Move tool, you can drag, drop on the logo of the Adverteerders' your banner. This is the logo on a new level on your situation.
Now we need this in the background. In addition, we use a gradation. Is a gradient with the tool, with the seat paint.
To do this;
We need first a new layer to the filling to go "Layer / New / Layer". There is also a small icon in the bottom layers palette to a new level.
Select the Gradient tool (seat with the paint).
Now you have a new series of options on options bar, as das.
From there you can switch between different preset gradients, or create your own. Please click on the drop-down box propensity to save your options.
Please experiment with different pitches, you can use the symbols bit color at the colored bar at the bottom. Try the nature of the gradient, offering the possibility of randomized style.
Once your selection, click OK and your new level, you need;
Click and hold the left mouse button down on the left side of your Web.
Drag and release the mouse button at the point where you want the course to the end.
They are probably not the way you want to simply click CNTRL Z to undo and try again.
Now you find that everything disappeared. This is because your new level is at the top. Just click and slide your new level under the 'plan' layer. Even renaming the level of "history".
Now you will notice that the logo has a white stripe, in its upper part, to eliminate the white band, we use the magic wand.
If you are using the wand, it automatically selects all similar, you can find their tolerance to the bar at the top,'0 ', tolerance, but only the same color as you clicked. '10 'Here you can exceptions, the same thing. Zoom on the logo first and then the wall to the white area,'0 'tolerance is probably the best to begin.
Click Remove, and you see something like the above. Then you can use the magic wand to the thin white line, which is still there and delete it.
It is the title of white left after. To these we need to turn off, simply click on the outside of the window frame of your screen to do this. Then you have to zoom in a lot more, and use the eraser tool to the last bit. Their removal tool should be limited to 1 pixel in size, with 0% hardness.
If the rubber, you will find that gradually raises he knows he really brings in various shades of blue, so you can zoom some of these customs again (Ctrl -), to see how it looks. May you zoom back to finish just a bit until you're happy.
Well, for a text. At the beginning we have to say, "Open Days". Then simply select the Text tool, click on the left side of the Internet and the Open Days. " It is up to you to change the color and size that you want to use. Make sure you have the space for other small text.
With my text, which I also used additional options that appear when you click the last icon in the Taskbar Options are in the top.
That gives you more control, and you can monitor, the first and style. I change or AV follow-up letters to the closer.
Now you can get the rest of the text itself, something like this action;
Now we can show pictures of this, and I registered artworks in a folder Advert banner. You may go or over the Internet and downloading something.
For this tutorial, I PavedCircle.jpg open, then go to File / Open and select the file, or one of your own choice. At this time you have two windows in Photoshop. By working in Photoshop, you can almost as many windows you want to open. This is helpful when creating designs or images. And now with the tool "Move by dragging and dropping them onto the photo, your ad banner. If your image PavedCircle looks as follows;
Now is your image is too big for the room, May also do not want to use it, that we have 2 things that will help you with other images. First the size.
With the move tool selected, go to Edit / Free Transform ", then hoolding shift, and keep a corner of the image and drag it inwards to the people too small.
Double-click in the middle to the changes and choose the eraser tool.
Let the size of the eraser big enough, that is about 150px, and make sure that the hardness is very low.
Now single mouse click in the vicinity of the population in the picture, but not close, because you then delete it.
Keep the single click until you satisfied with the effect.
You will notice that in the picture above, I dragged the "Everyone is welcome, text on the picture layer, and I just shade for them. The last thing to do here is to sharpen the people something works. We do this with a "filter". Layer with the image selected, go to "filter / sharpness / Unsharp Mask."
It is now finished Advert static banners, quite clearly, there's much more you can do, other filters, effects on the text, etc. And, please experience. And we are saved.
Suffice it to go "File / Save" to rescue the original with all levels intact. Then a flat JPEG ready for use in a Web page, go to File / Save for the Web and devices.
The default settings are generally very good, especially if he is JPG, and the quality is around 70%. When you click "4 to the top of the window, then you should use a variety of options.
Finally beaten, and in a Web page in Dreamweaver to test.
Article Tags: |
