safiyu and 24 unknown users

 Word :   Username :  
 
 Page :  1  2  3  4  5  6
Previous 
Author
 Thread :

[Photoshop tutorial] Make a B&B icon with Photoshop !

 
n°125
k_millio
Profil: Penguin Pro
Avatar
profil
Posted on 10-23-2005 at 02:28:56 PM  
 

Hi, in this tutorial, we'll learn how to create B&B icons :mdr:

 

You can find the pack IN THIS TOPIC, and download it HERE :wink:

 


So let's start :mdr:

 


1. First of all, open photoshop and create a new 256x256 pixel document with a transparent background and with RGB as the color mode.

 

2. Now use the elliptical marquee tool to draw a selection like on the image :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/1.jpg

 

:idea: TIP: holding shift while you're drawing your selection will give you a perfect circle as your selection :wink:

 

And fill it with the color of your choice, you should obtain this (unless you've chosen another color) :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/2.jpg

 

3.  Create a new layer by pressing Ctrl+Shift+N.

 

Then, contract the selection by 2 pixels :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/3.jpg

 

Now, select the brush tool with these settings :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/4.jpg

 

4. Choose a darker color than the one you used before and fill your selection with a few hits.

 

Repeat this step with lighter colors, but don't create a new layer for each, you'll need only one for step 5 :wink:

 

5. Now, deselect by pressing Ctrl+D, and use a Gaussian blur, with a 17 pixel radius (but this value can vary if you want another effect) :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/5.jpg

 

Click on "Layer 1"s thumbnail while you're holding Ctrl to have its shape as your selection, and contract it by 2 pixels. Now press Ctrl+Shift+I (to invert the selection), press delete and Ctrl+Shift+I again. You should obtain something like this :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/6.jpg

 

6. Create a new layer. Now, use a white to transparent gradient (in the linear mode) from the top of the selection to its bottom. You should obtain this :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/7.jpg

 

7. Then, create a new layer and make it slide under "Layer 3". Set its blending mode on Overlay :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/8.jpg

 

Use a black to transparent gradient, in a linear mode, from the bottom of the selection to its top, and deselect. You should now obtain this :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/9.jpg

 

8. Go on "Layer 3", then select the Pen tool to draw a shape like this one (only the shape on the icon is important, the shape out of the canvas is only here to close the loop :wink: ) :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/10.jpg

 

Now, press on the "Paths" tab next to the "Layers" and "Channels" tabs, and then click on the "Workpath" path and on the little button shown bellow.

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/11.jpg

 

And finally, hit Delete to delete a part of the white gradient. Deselect, and you should obtain this :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/12.jpg

 

8. Now import the logo or shape you want to put in the middle in a new layer, and make this new layer slide under "Layer 3". As an example, I'll use a musical note :wink:

 

Now fill it with grayish white, as shown below :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/13.jpg

 

9. Ctrl+Click on the layer's thumbnail, then use a light gray to transparent gradient from the bottom of the selection to its top. Now use a white to transparent gradient from the top of the selection to its bottom.

 

You should see that :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/14.jpg

 

10. Double click on "Layer 5"s thumbnail to open the Blending Options window. Enter these settings :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/15.jpg

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/16.jpg

 

11. Open the Blending Options window of "Layer 1", and enter these settings.

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/17.jpg

 

You should obtain this :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/18.jpg

 

12. Now, create a new layer, and make it slide under "Layer 1".

 

Ctrl+click on "Layer 1", then expand the selection by two pixels (Select > modify > expand), and fill it with white.

 

13. Then, open the Blending Options window of this new layer, and anter these settings :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/19.jpg

 


This tutorial is now finished, if you've followed all the instructions correctly, you should obtain something like this (I've just used another radius for the Gaussian blur on layer 2) :

 

http://kmillio.crystalxp.net/Tutorials/Photoshop/BnB-icon/20.png

 

Doesn't it look great ? :mdr:

answer
mood
GoogleAds
profil
Posted on 10-23-2005 at 02:28:56 PM  
 

answer
n°126
dlb
q|p
Profil: Admin
Avatar
profil
Posted on 10-23-2005 at 03:55:59 PM  
 

A big thanks to k-millio for this great translation  :love:  :great:

answer
n°127
k_millio
Profil: Penguin Pro
Avatar
profil
Posted on 10-23-2005 at 03:57:49 PM  
 

You're welcome dlb :jap:

answer
n°128
batux
:)
Profil: Penguin Pro
Avatar
profil
Posted on 10-23-2005 at 04:21:17 PM  
 

Cool k-milio :great:
Thanks :jap:

answer
n°130
Hiroshi
Profil: Penguin
Avatar
profil
Posted on 10-23-2005 at 10:51:21 PM  
 

great translation :wink: thanks for b&b :mdr;

answer
n°131
Didas
le soleil se lève avant moi, je me couche après lu
Profil: God of Penguins
Avatar
profil
Posted on 10-24-2005 at 02:44:01 AM  
 

that's great, thanks for your help :jap:

answer
n°134
vaksa
Profil: Top Penguin
Avatar
profil
Posted on 10-27-2005 at 06:10:59 AM  
 

Good job k_millio! :great: Thanks for this :jap:

answer
n°135
Pinocchio
Profil: New Penguin
Avatar
profil
Posted on 10-27-2005 at 10:31:33 AM  
 

Thank you so very much.  :love:

answer
n°136
k_millio
Profil: Penguin Pro
Avatar
profil
Posted on 10-27-2005 at 10:38:36 AM  
 

You're all welcome :jap:

 

Pinocchio > your sig is too large, the maximum size is 250x50 pixels :wink:

answer
n°188
dinou10
Profil: New Penguin
Avatar
profil
Posted on 12-29-2005 at 06:47:50 PM  
 

BOn je vais définitivement etre élu  :boulay:

 

J'ai essayer de rechercher la version française du tutorial amis je ne l'ai pas trouver car j ai un petit soucis avec l'outils plume...

 

Est ce que quelqu'un saurait me diriger vers le bon topic please ???

 

Merci d'avance

answer
n°189
Valdrin
Profil: Big Penguin
Avatar
profil
Posted on 12-29-2005 at 07:03:23 PM  
 
answer
n°190
dinou10
Profil: New Penguin
Avatar
profil
Posted on 12-29-2005 at 07:16:14 PM  
 

:loveit: Merci Valdrin

answer
n°215
Funny Monkey
Profil: New Penguin
Avatar
profil
Posted on 01-23-2006 at 06:30:48 PM  
 

Пишите по русски  :oui: а то больше половины слов не понял =(
 :meuh: Hello from Russia!!!

answer
n°217
dlb
q|p
Profil: Admin
Avatar
profil
Posted on 01-23-2006 at 06:37:12 PM  
 

Good work  :cool:

answer
n°220
vaksa
Profil: Top Penguin
Avatar
profil
Posted on 01-23-2006 at 09:01:56 PM  
 

Funny Monkey wrote :

Пишите по русски  :oui: а то больше половины слов не понял =(
 :meuh: Hello from Russia!!!


В следующий раз сохраняй в .PNG формате :wink: Может скоро переведу этот урок на русский :oui:

 

Next time save in .PNG :wink: Maybe soon i'll translare this tutorial to russian :oui:
 :meuh:

answer
n°221
Hiroshi
Profil: Penguin
Avatar
profil
Posted on 01-23-2006 at 09:18:29 PM  
 

Quote :

Next time save in .PNG wink.gif Maybe soon i'll translare this tutorial to russian yes.gif

 

Thanks Vaksa, it would be a pleasure for me to see my tutorial in russian. Really. :oui:

answer
n°222
vaksa
Profil: Top Penguin
Avatar
profil
Posted on 01-23-2006 at 09:29:43 PM  
 

Hiroshi wrote :

Thanks Vaksa, it would be a pleasure for me to see my tutorial in russian. Really. :oui:


No, it's pleasure for me, because it's supercool tutorial! :loveit:

answer
n°256
zohair
Profil: New Penguin
Avatar
profil
Posted on 02-22-2006 at 04:59:10 PM  
 

This looks Awesome!!! Hey vaska i love the world in your Avy can i know where will i get these?

 

Got this result!

answer
n°258
vaksa
Profil: Top Penguin
Avatar
profil
Posted on 02-22-2006 at 08:22:53 PM  
 

Quote :

This looks Awesome!!! Hey vaska i love the world in your Avy can i know where will i get these?

 

Got this result!


You can find similar globes here - http://crystalxp.net/galerie/en.id.279.htm :smile:

answer
n°259
vIcO
Profil: Penguin Pro
Avatar
profil
Posted on 02-22-2006 at 08:33:35 PM  
 


I prefer your one  :oui:

answer
n°260
vaksa
Profil: Top Penguin
Avatar
profil
Posted on 02-22-2006 at 09:27:03 PM  
 

vIcO wrote :

I prefer your one  :oui:


Your globes pretty nice too! :wink:

answer
n°295
Ivan_xXx
Profil: Penguin
Avatar
profil
Posted on 05-04-2006 at 07:00:47 PM  
 

:great: Awesome tut my result:

answer
n°296
Neil
Chances are not had but gained.......
Profil: Penguin Pro
Avatar
profil
Posted on 05-06-2006 at 08:12:55 AM  
 

:great: Great tutorial and great work! :great:

 

Here is what I've done so far. (But in a bit of rush)

 

Crystal.png

answer
n°297
LuciferX
Le vin est la caverne de l'âme
Profil: Penguin Pro
Avatar
profil
Posted on 05-10-2006 at 09:22:10 AM  
 

Here my button:
http://www.mezimages.com/image/lucifer/boutonbleu.png
It is rather sympa   :angel:

answer
n°298
Tatice
Borsalino Gang
Profil: Penguin Pro
Avatar
profil
Posted on 05-10-2006 at 09:33:07 AM  
 

It's here for the french people : :wink:
Réaliser une icône B&B.

answer
 Page :  1  2  3  4  5  6
Previous 
Top 

Go to:
Add a reply