• Link us
  • Links
  • TOS
  • Site
  • Gallery
  • Forum
Subscribe

Using templates - Adobe Photoshop tutorial

Tutorials > Adobe Photoshop tutorials > Using templates
  • Added: Aug 9th, 2004
  • Level: Easy
  • Author: Melfina
  • Program version: 7.0
  • Reads: 22,835
  • Description: A little help on how to use the templates we offer on the site.
Bookmark Digg del.icio.us

E-mail to a friend

View printable version


Open your template psd on Photoshop ( File > Open or Ctrl+N) and open the layers window if you don't have it opened already ( Windows > Layers ). Let's look at it a little: we see three layers, one with the transparency color so that we can make that parts transparent, another one with the template itself and the last one that says "your image here", so obviously we'll paste our image there. Click on "your image here" layer.

Now go to File > Open and open the image you want to use as avatar with the template. I chose this one from Kamikaze Kaitô Jeanne I scanned from a manga cover, pretty eh?. Press Ctrl+A, Ctrl+C (or go to Select > All, Edit > Copy) to copy the entire image. Close it and go back to your template, press Ctrl+V (Edit > Paste) to paste the image.

Ugh, but it's too big and it doesn't look good X.x what do we do now?? Zoom the image out quite a lot and go to Edit > Transform. A square will appear representing the size of the image we pasted. Continue to the next step to see it.

Click on one of the corners and drag it to the middle until you have what you wanted on the avatar. Remember to press Shift while you drag it or it will deform. We can't see much seeing it so little, but we can just zoom it in and transform until we get something nice.

Okay, so we transformed it and we have the image centered in the template ^o^ it looks so good! let's save it and make the magenta color transparent. Go to File > Save for web and a window with strange things will appear.

On that window, select the settings below. Why do we do this? it has to be a gif file, otherwise it couldn't be transparent! The other settings are just for web optimizing.

Now it's when we'll make the magenta color transparent. See the color boxes in your window? (well, there'll be more and different colors on your image of course...) Click on the magenta and then click on that icon (hovering the icon you will read "maps selected colors to transparent") on the bottom that I marked on the image.

Ready! press save and put it wherever you want on your computer. This is my result! Got a nice one you too? If you want you can submit your avatar here.


If you like this tutorial why not digg it or add to del.icio.us?

Tutorial © Melfina. Do not reproduce in any way without previous permission from the author.

  • Members login
  • Register for free

Web layouts

  • Web layouts
  • Aardvark Topsites skins
  • SMF Themes
  • Wordpress Themes

Graphic resources

  • 100x100 Avatars
  • PS and PSP brushes
  • Brush shop
  • Background patterns
  • Web icons and smilies
  • Textures
  • Renders (PNG)

Tutorials

  • Newest tutorials
  • Adobe Photoshop
  • CSS
  • Designs / Layouts
  • HTML & XHTML
  • Miscellaneous
  • Paint Shop Pro
  • PHP & MySQL

Affiliates

  • Ego Box
  • The Jaded Network

Partners

Celestial Star © Melfina 2003-2010. By using this site you agree to our terms of service
Layout credits: Hybrid Genesis, Bittbox, swe3ty
Valid XHTML | Valid CSS | Top of the page