Jumat, 19 September 2008

Creation of Unique and Funny Digg Icon in a Bottle for Bloggers

This tutorial explains what to do if you wish to make a unique icon for a social network on your resource. I will describe in details the process of creation of unique and funny Digg icon in a bottle for your website.

Step 1

Create a New Document 150×150px with grey background. Begin with drawing a squared shape bottle in the perspective. Use Pen tool (shape layers selected) to draw the front side of the bottle. Set blue Foreground colour (#01f6ff). Sizes for the front side are 39×49.


Step 2
Let’s work up the top side. Choose dimmer blue colour (#81d4d7) than the one you used for the front side. Create a New Layer. Draw the top side of a bottle using the same Pen tool so that the front side would be adjoined to the top. After that, lower the top side of the bottle 2px down, thus creating the effect of rounding off. Set opacity 50 % to make it translucent.



Step 3

Let’s work up the bottom side. Choose darker blue colour (#038493) than the one you used for the front side. Create a New Layer. In the bottom part of the front side draw the bottom side of a bottle so that the front side of the bottle would be adjoined to the bottom. Then, lift 2px up the bottom side, thus creating the effect of rounding off. Set opacity 60 % to make it translucent.



Step 4
Let’s work up the back side. Choose lighter blue colour (#038493) than the one you used for the bottom side. Create a New Layer. Draw the back side so that it would be adjoined to the top and the bottom sides. Set opacity 60 % to make it translucent.



Step 5
Now, let’s work up the front lateral side. Choose darker and deeper blue colour (#02a4c7) than the one you used for the front side and. Create a New Layer. Draw a lateral side so that it would be adjoined to the top, bottom, front and back sides.



Step 6
Now let’s make the dimming for the bottle edges. Use Pen tool to make shapes, covering all invisible edges of a cube in 2px width. Set Opacity 32%. Add Gradient Overlay.



Step 7
Use Pen tool to draw an icon of the dude with a shovel - our Digg icon. Use black foreground colour.



Step 8
Free Transform the icon: make it 41% width and height, then rotate 9.1 deg. Move an icon so that it has appeared in the small bottle centre.



Step 9
Duplicate our Digg-man. Move 1px down and to the left, and paint it over with grey (#727373).
Picture 9 Step 10 Duplicate layer with grey Digg-man and send it backwards. Use Delete anchor tool to remove all the internal shapes of our Digg-man badge. Thus, there should be only a general contour. Set the colour of pouring (#ffffff) and Opacity 77%.


Step 11 Let’s draw a neck for our bottle. Create a New Layer. Use Pen tool to draw a neck for the bottle. Use Gradient overlay so that the colour we got was as the one of a lateral back side.


Step 12
Create a New Layer. Use Pen tool to draw the handle for a bottle. Use lighter blue colour, than the one you used for the bottle-neck (#2fecfb).



Step 13
Create a New Layer. Use Pen tool to draw an oval opening in bottle-neck. Use Gradient overlay so that the colour we got was darker than that of a neck



Step 14
The foundation for our bottle is ready. Now let’s make the highlights and the shades. Start with a shade thrown by our bottle. Choose a background layer and create a New Layer. Use Lasso tool to select an area under the bottle which sticks up for 2px from below and on the right. Paint it over with black colour, set Opacity 48% and Deselect. Apply Gaussian Blur 0.5px to wash it away slightly. Then by means of Marquee tool choose the part of the shade that is on the right, and apply Gaussian Blur filter once again.


Step 15
Now, create the dimming for the front side. Choose a layer with a front side. Create a New Layer. Then Ctrl+click on a layer with a front side, Contract selection 1px. By means of Linear Gradient (Foreground to Transparent) draw a gradient from the top part of this side to its middle. Use foreground colour (#2aa4ba).


Step 16
Put some light onto the right edge of a bottle a little bit. Create a New Layer. Ctrl+lick on a layer with a forward lateral side. By means of Linear Gradient (Foreground to Transparent) draw a gradient from the right part of a lateral side to its middle. Use white foreground colour.



Step 17
Now, create the dimming for the top side. Choose a layer with the top side, create a New Layer. Ctrl+Click on a layer with the top side. By means of Linear Gradient (Foreground to Transparent) draw a gradient from the right part of the side to its middle. Use foreground colour (#037494).



Step 18
Create the dimming for the bottom side. Choose a layer with the bottom side, create a New Layer. Then Ctrl+Click on a layer with the bottom side. By means of Linear Gradient (Foreground to Transparent) draw a gradient from the left part of a side to its middle. Use foreground colour (#0f2f00). This has to be the most prominent dimming, since this side of the bottom is the most poorly shined one.



Step 19
Now we will make the lighting for all the bottle, excluding our Digg icon. Choose a layer with a forward lateral side and create a New Layer. Ctrl+Click on a layer with the front side. By means of Linear Gradient (Foreground to Transparent) draw a gradient from the bottom left part of the side a little further than its middle (use white foreground colour). Set Opacity 60%.



Step 20
Repeat the procedure executed in
Step 19, but draw the gradient from the right top part to the middle.



Step 21
Create a New Layer. Ctrl+Click on a layer with the top side. Use Linear Gradient (Foreground to Transparent) to draw a gradient from the left part of the side to the opposite edge (use white foreground colour). Set Opacity 60%.


Step 22
Let’s add some details of lighting for our bottle including Digg icon. Choose the uppermost layer with our Digg-man. Create a New Layer. Ctrl+Click on a layer with the front side. By means of Linear Gradient (Foreground to Transparent) draw a gradient from the top right part of a side to the opposite edge (use white foreground colour). Set Opacity 40%. Use big 90px Eraser brush to erase the bottom left half.



Step 23
Add some more lighting. Create a New Layer. Ctrl+Click on a layer with a back side. Use Linear Gradient (Foreground to Transparent) to draw a gradient from the top right part of a side to the opposite edge (use white foreground colour). Set Opacity 50%. Move 8 px down and to the left.



Step 24
Create a New Layer. Use Pen tool to draw a corner in the right upper part of the side. Use (#006f79) colour. Set Opacity 20%.


Step 25
Now, make some highlights for the top side. Create a New Layer. Ctrl+Click on a layer with the top side. By means of Linear Gradient (Foreground to Transparent) draw a gradient from the right part of a side to the opposite edge (use white foreground colour).



Step 26
Make some extra-lighting for the edges. Create a New Layer and use Pen tool make 2px encircling of all visible edges, excluding the bottom. Use (#77f5fa) colour. Set Opacity 27%.



Step 27
As in a
Step 26 create 2px encircling for the bottom edges, that will grasp lateral edges as well. Use darker blue colour (#018fad). Set Opacity 28%.



Step 28
Let’s finish the details for front sides. Start with a corner highlight. Create a New Layer. Ctrl+Click on a layer with a front side. By means of Linear Gradient (Foreground to Transparent) draw a gradient from the upper left part of a side to the opposite edge (use white foreground colour). Then choose Marquee tool, move selection some pixels down and to the right, press Del, Deselect.


Step 29
Repeat procedure of a
Step 28 for the bottom right corner, and then once again for the bottom left corner.



Step 30
Repeat the procedure described in Step 19. Only start to draw the gradient from outside of the bottle (lower and on the left). Draw it closely to the middle. Leave Opacity 100%.


Step 31
As in Step 30 add one highlight in bottom right and in the bottom left corners.


Step 32
Add some glowing to the left edge. Create a New Layer. Ctrl+Click on a layer with the front side. By means of Linear Gradient (Foreground to Transparent) draw a gradient from the right part of the side to the middle (use white foreground colour). Then choose Marquee tool, move selection 2px to the right, press Del, Deselect. Set Opacity 71%.




Step 33
Add the last details for the front lateral side as we did for the front side. Add a highlight in the bottom part, the main shade on the top, and a small glare on the top.




Step 34
And at last, create bright glowing in the top corners of a front side. Make some strokes along the edges using 7px soft brush and apply Gaussian Blur 0.5px.




Step 35
We are done with details for our bottle. Now add details for a neck in the same way. Start with a shade on a neck. Create a New Layer. Use Pen tool to draw oval shape under a neck and the handle. Use (#013137) colour. Set Opacity 23%.




Step 36
Now add the effect of narrowing and expansion of a neck. Choose a layer with the basic part of a neck that has been drawn in
Step 11. Create a New Layer. Use Pen tool to draw an oval shape in the bottom part of the neck foundation. Use (#037494) colou. Set Opacity 31%.



Step 37
Let’s make the dimming in the right part of the neck. Create a New Layer. Ctrl+Click on a layer with the neck foundation. Use Linear Gradient (Foreground to Transparent) to draw a gradient from the right part of our bottle-neck to the middle (use ( #037394) foreground colour).



Step 38
Use techniques described earlier to add the highlight of various degrees of intensity in the bottom part of the bottle-neck foundation.



Step 39
Now create some shades for the handle: on the bottle and on the neck.



Step 40

Put some highlights on the handle


Step 41
At last, work up the top part of the bottle-neck. Adding shades and highlight you will achieve the result shown on the final screenshot. All techniques used are the same as those used to make some details for other parts of the bottle.


Download Source : dig_icon.psd.zip