Tree of Souls - An Avatar Community Forum

Tree of Souls - An Avatar Community Forum (https://tree-of-souls.net/index.php)
-   Fan Art (https://tree-of-souls.net/forumdisplay.php?f=9)
-   -   Banner/Signature Tutorial Request. (https://tree-of-souls.net/showthread.php?t=1624)

Alyara 06-03-2010 01:45 PM

Banner/Signature Tutorial Request.
 
I was looking at the Sigs that Eltu had posted in the sticky thread and got inspired to try my hand at it. I have a bunch of ideas in my head that I would love to have a go at.

So this is a request for any helpful tips, suggestions, etc to help me start out and get my feet wet. I'd really appreciate it and would love to make stuff for everyone to use on here.

So plz help if u can! ^^


(PS I wasnt exactly sure where to put this, so I thought this would be the most obvious place to throw it on)

Eltu 06-06-2010 07:16 PM

Sure thing, I'd gladly help. :)

What software do you currently have?
Photoshop?
Photoshop Elements?
MS Paint?
Gimp?

;)

Alyara 06-06-2010 07:58 PM

hmmm photoshop and gimp, but i dont think ive used gimp before

Eltu 06-06-2010 08:03 PM

Well, I would gladly help with anything Photoshop related (have been using PS for about 10 years) - although it is hard to help over the internet...

I could make a tutorial if that would help ;) I can have it up by tomorrow :)

Alyara 06-06-2010 08:06 PM

ty ty, tho like ive stated before im in no rush, just anyone helping in general is awesome ^^

Eltu 06-06-2010 08:08 PM

Ok. I'll make a tutorial tomorrow, then. :)

Eltu 06-07-2010 09:58 PM

Here is a small signature-making tutorial I just made, I hope it will be of help.

It was made using Photoshop CS4, it might look a bit different on your computer depending on which PS version you have.



http://img6.uploadhouse.com/fileuplo...662f5ec652.png

Start out by opening Photoshop, and select File -> New...
In the box that opens, enter the Width as 400 and the Height as 100, then press Ok. You now have an empty file to make a signature in.
-------------------------------------------------------------------


http://img8.uploadhouse.com/fileuplo...12662d3575.png

Now, go to the File -> Open menu, and open the image you want to use as a background for your signature. I have choosen to use this image:
-------------------------------------------------------------------


http://img4.uploadhouse.com/fileuplo...30092e7ffe.png

Now press Ctrl-A to select the image, then Ctrl-C to copy it. Switch over to the empty signature (by pressing the tab saying "Untitled-1" at the upper part of the screen), and then press Ctrl-V to paste the picture into the signature.
-------------------------------------------------------------------


http://img6.uploadhouse.com/fileuplo...65a72db3f9.png

This image is way too large to fit into the signature. To make is smaller, press Ctrl-T. Now you can drag the corners of the image to resize it. Hold shift when dragging to avoid stretching it. You can also move the picture around by dragging in the middle. When you are happy with the placement of the image, press Enter.

Now, let's make a nice border. First we need a new layer to make the border in. Go to the layer window in the lower left part of the screen. Press the New Layer button, that looks like an empty page.
-------------------------------------------------------------------


http://img4.uploadhouse.com/fileuplo...e1f3fe2eae.png

http://img5.uploadhouse.com/fileuplo...a2e1678020.png

http://img6.uploadhouse.com/fileuplo...2ba571b03f.png

http://img9.uploadhouse.com/fileuplo...d1129d3e4e.png

Select the Selection tool. Now drag a rectangle that covers the upper part of the image (as shown in the image above). Then, hold shift, and drag another rectangle that covers the right side of the image. Repeat this with all four sides, and you will have a selection surrounding the image.
-------------------------------------------------------------------


http://img8.uploadhouse.com/fileuplo...5b763f006a.png

Now select the Paint Bucket tool. Select black as the color, and press somewhere within the selection. This will make this part of the image black.

Eltu 06-07-2010 09:59 PM

http://img5.uploadhouse.com/fileuplo...14733f2f22.png

http://img9.uploadhouse.com/fileuplo...95d37fb64c.png

Now, do the same selection thing as you just did, however, select less space on the sides (about half) - in other words, make a selection that is thinner, surrounding the image. Use the paint bucket tool again, select white as the color, and press inside this smaller selection.
-------------------------------------------------------------------


http://img1.uploadhouse.com/fileuplo...7d9efbe9f4.png

http://img5.uploadhouse.com/fileuplo...4f4315527c.png

After doing this, go to the layer window again. In the upper part of the window there is a drop-down menu that says "Normal". Press the arrow to the right of it, and choose "Overlay" in the menu. This makes the border merge with the image.
-------------------------------------------------------------------


http://img1.uploadhouse.com/fileuplo...46d57b3869.png

Now let's add some text. Select the text tool. In the upper part of the screen you can change the text options. In the font menu, I have choosen Brush Script Std - if you don't have that font, choose another one that looks nice. Choose a size, and make sure the color of the text is black.
-------------------------------------------------------------------


http://img8.uploadhouse.com/fileuplo...14b465f2a5.png

http://img3.uploadhouse.com/fileuplo...ebc990fd5e.png

Now, press somewhere on the image, and write the text. I wrote "Neytiri lives".
After doing this, go to the layer window again. Press the small button saying "fx", and click on "Stroke".
-------------------------------------------------------------------


http://img3.uploadhouse.com/fileuplo...984b702f94.png

http://img7.uploadhouse.com/fileuplo...7fe4d9a86e.png

In the window that comes up, change "Size" to 1 px, "Blend Mode" to Overlay, and "Color" to white. Press Ok. At the top of the layer window is a menu saying "Fill: 100%". Change this to 50%.
-------------------------------------------------------------------


http://img8.uploadhouse.com/fileuplo...f5bfc7c538.png

Almost done - let's make the image a bit brighter too. Go to Image -> Adjustements -> Brightness/Contrast. Set both values to 50 and press Ok.


We are done! You can now save the image.

Eltu 06-07-2010 09:59 PM

The end result:

http://img9.uploadhouse.com/fileuplo...85d3220daa.jpg

Alyara 06-07-2010 10:17 PM

Hmm the tutorial is working but when I do the CTRL-Q it exits the whole program, maybe the fact that its CS2 is why its doing that?

Eltu 06-07-2010 10:18 PM

Dear Eywa, sorry!

I made a typo - it is supposed to be Ctrl-T! :D

Sorry :P

Alyara 06-07-2010 10:19 PM

good thing i pointed that out then.

TY Eltu! ^^

Alyara 06-08-2010 04:14 AM

1st Neytiri and 3rd attempt at siggy banners....I like it ^^

http://sphotos.ak.fbcdn.net/hphotos-..._4952570_n.jpg

Eltu 06-08-2010 08:11 AM

Looking great so far!

You can also experiment with:
-changing colors of the borders
-change shape of the borders (only use one selection of white or black for example, instead of two)
-experimenting with layer effects of the text

And anything else you can think of! Experimenting is the best way of learning :)

Alyara 06-08-2010 08:12 AM

Thanks Eltu! U opened up a new creative outlet for me, and I hope to improve and move on to other work.

Ur awesome!!!

Txum_kali'weya 06-08-2010 08:23 AM

you're gonna have fun with this :)

Alyara 06-08-2010 08:23 AM

ikr? its gonna be fun! ^^


All times are GMT +1. The time now is 05:08 AM.

Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2022, vBulletin Solutions, Inc.
All images and clips of Avatar are the exclusive property of 20th Century Fox.