FOR BETTER DESIGNS

Photo of the day: Harmony

Ali Chorov — Thu, 22 Jul 2010 09:01:02 +0000

I’ve really put a big effort for taking a good photograph of this beautiful place. I only hope you’ll like it Good day everyone!

Art is a harmony parallel with nature.

Photo of the day: Green alley

Ali Chorov — Mon, 05 Jul 2010 19:45:23 +0000

I’m sure most of my readers noticed that I have been away. I’m sorry but everyone need rest I also was having a lot of work and was unable to upload anything here. But now I’m back and today I will present you my newest shot. It’s from a very beautiful and fresh place. I’m sure you will like it.

Alone with myself. The trees bend to caress me. The shade hugs my heart.

Photo of the day: Happy summer

Ali Chorov — Thu, 27 May 2010 10:14:35 +0000

The hot sunny days are now here and looks like the summer has already come. With today’s photo I wish you all readers of my blog a happy summer. Hope you’ll like this shot.

Few words about the flower:

Chamomile or camomile is a common name for several daisy-like plants. These plants are best known for their ability to be made into a tea which is commonly used to help with sleep and is often served with either honey or lemon. You can read more about it in Wiki

Anyway hope you like the photography

Tutorial: Greeny navigation for your websites

Ali Chorov — Thu, 27 May 2010 10:01:29 +0000

Another green web navigation tutorial from me. This one is the last from this kind, hoep you will find it useful.

(You can click on the images to view them in bigger size)

1.Start this tutorial with opening a new Photoshop document. My dimensions as you see are 800 width x 308 height but that’s not so important.

2.Take the rounded rectangle tool and set the radius to 30px. Choose a green color: 78aa12. And then draw a shape like in the image below.

3.Next open the blending options of this shape and follow the settings from next few images. Drop shadow:

4.Inner shadow:

5.Inner glow:

6.Gradient overlay. The gradient is default black to white here with lower opacity: 10%

7.Stroke:

8.Take the rounded rectangle tool again with radius of 30px and just change the color to grey c9c9c9 now. Draw a shape same or similar to the picture below.

9.Duplicate this shape 4 or more times, depending of what you want to do.

10.Take the text tool and type some texts Home About etc…

11.Next let’s make the over button. Duplicate some of this button shapes we already have and clear it’s layer style. Right click with the mouse on the layer and choose clear layer style.

12.Now click twice on this layer shape and change it’s color to green. Or if you use other color, the color should be the same as this of the center of our bar.Remember we have used some layer styles like inner shadow so choose the color from the center.

13.Take the text tool again and type the same text for this button but this time the color will be white.

14.Now make a selection of this button. Hold CTRL and Click with the mouse over the layer icon then take the rectangle marque tool and while holding ALT remove the half of this selection.

15. Fill this new selection with white color, change it’s layer style to: soft light then lower the opacity to 50%.

16 We have this nice gloss here but I want it to be more soft. So make the selection from our button again. Like described in step 14.

17. And now use a filter: Gaussian blur. I am using a radius of 6.1

18.Next take the text tool and type some texts on our bar. Link1 link2.

19.We need a logo don’t we I have found one here: http://www.iconfinder.net

20.Again let’s type some text below our logo. And as you see we’re ready.

This is our design and I hope you like it. Feel free to ask any questions if you have, I am always happy If I can help you.

Tutorial: Nice glossy menu

Ali Chorov — Sat, 22 May 2010 08:40:39 +0000

In this tutorial I’ll show you how to make nice looking web menu for your websites. It’s look is almost glossy and metallic, hope you’ll find it useful.

1. First make a new document with this dimensions: 800px x 180px

2.So here I have made a background and something like a logo. This is where our logo maybe should be. And the background color here is: 92adbe

3.Now select a Rectangle tool and use fixed size for example I use: 800px 30px but you can experimetn offcourse! And the color of the shape we’ll draw is: 186f90. Which is not so importand now because I thing to use a special gradient with no change to opacity. And also everyone can change this color to whatever he wish or like But for the same result use the settings in the image…

4.Now when you make the shape, open the blending options of this layer and change the settings like on the next few images, drop shadow:

5.Inner Glow:

6.Gradient Overlay is special here. Well the colors are 1: #d6eaf7 2:#c2d4e0 3:#b5c6d0 4:#d8e1e7 5:#eff4f7
and the 3 and 4 are very very close to each other. Almost over each other.

7.Here the next thing you can do is to draw a shape under this menu like in the image. The color is blue and I use a Gradiend Overlay from the Layer style window:

8.Next select the Rounded Rectangle Tool and use fixed size: 100px 30px.

9.Click on the menu and this will be our button! Place it somwhow like in the image below:

10.Type some text over it:

11.Now open the blending options of the button shape and use settings from next few images.

Inner Shadow:

12.Inner Glow:

13.Stroke:

14.Take the Line tool and draw a line next to the button home. I use a blue color for it.

15.Now select the 3 layers: the button shape, text and the new line and group them.
To do this after select hit shortcut CTRL+G

16.This group I called 1 and then duplicate this group for or more times.
Easies way to duplicate just take the group and drag it to the new layer icon in the bottom of
the window.

17.After all this you should have something like in the image below:

18.So change the names of other buttons to whatever you like and your nice
web menu is ready. Hope you like it.

Photo of the day: Dreamy wood

Ali Chorov — Thu, 20 May 2010 14:42:19 +0000

Between the mountains and the roads, between the heaven and the earth, there is a dreamy wood!

Hope you like it.

Tutorial: Design glossy grey navigation menu

Ali Chorov — Thu, 20 May 2010 14:15:46 +0000

In this tutorial I will shot you how to make a very nice looking glossy grey navigation menu for your web site.

(You can click on the images to view them in bigger size)

1.Start with a new document: 800px 150px. I’ll draw a shape with rectangle tool which I’ll use as a background. Color: 738594

2. Adding a place for the logo and description…

3.Take rounded rectangle tool with color: e3e3e3 and radius of 35px.

4.Now open the blending options of this shape and follow settings from next few images…
Drop shadow:

5. Inner glow:

6. Satin:

7.Gradient Overlay:

8.Now add some text with a nice font and lines between the buttons:

9.I’ll add 2 shapes for the roll over state!

10.Let’s continue with the search box… Draw 2 shapes like the example on the next image…

11.Copy and paste the same layer style like the navigation bar…

12. And add stroke to this layer style with color: 858585

13.Now take the Ellipse tool.

14. And draw a shape with it. This will be our GO button. Color: white.

15.Paste the same layer style like before…

16.Here we’ll change the stroke a little bit: Size:2 and Opacity: 19%

17.Add 2 texts Search and GO like in the next image…

18. Now let’s add a little bit of a glossiness… Draw a white shape over our first shape.

19.Take the rectangle tool and use subtract from shape area and cut the half of our new shape…

20.Lower the opacity: 25% and change the layer mode to Soft Light

21.You can move this new layer down… But at all we’re done

Hope you like it and it has been useful for you…

Tutorial: Design awesome 3d Graph in Photoshop

Ali Chorov — Sat, 15 May 2010 20:02:28 +0000

In this tutorial I’ll show you how I design an awesome 3D color graph in Photoshop.

(You can click on the images to view them in bigger size)

Step 1.
First open a new image. The bigger dimensions are better for this tutorial.

Step 2
Take the rectangle tool and draw a shape like the mine in the image: This is where our 3d graph will stay.

Step 3
Next take the custom shape tool and and choose the grid shape I am showing you here:

Step 4.

Draw a shape with this custom shape and then duplicate it as much as it needs to get the look of this image:
(It’s good to group all this shape layers you’ll duplicate as I did. )

Step 5.

Next with the text transform tool CTRL+T use perspective and distort and try to make it look something like in my image:

Step 6.

Next go to the first shape you draw and add a layer style. Gradient color and choose the colors you wish.

Step 7.
Take the rectangle tool again, choose a color and draw a shape like mine.

Step 8.
Use free transform CTRL+T and perspective and make it look like the image below:

Step 9.
Duplicate this same shape and flip it horizontally. Also using free transform you must reduce the width of this shape. Make it smaller.

Step 10
Make the color of this shape a little bit darker.

Step 11.
Group this 2 shapes now and duplicate them. Move the new group below the first one.

Step 12.
Then resize it using free transform tool.

Step 13.
Click on this shape to change the color and make it lighter.

Step 14.
Repeat steps from 11 to 13 as much as you need.

Step 15
And change the colors also.

Step 16
After all this is what I have to the moment. It’s actually almost ready

Step 17
But the right side of this graphs must be a little bit darker. So click on it and in from the blending options let;s add an inner shadow.

Step 18
Copy and paste the layer style to all other right sides of this graph.

Step 19.
It’s done but let’s make a reflection to make it look more real and good. Just group all this and duplicate it once. After you duplicate use free transform tool CTRL+T and flip it vertical

Step 20.
Reduce the opacity of this layer.

Step 21
Let’s add a shadow. Again duplicate 1 time this group and place it beneath the first group. Use free transform again and distort to make it look like in my image:

Step 22
It’ should look something like in the image below:

Step 23
After this is done merge this group CTRL+E and change it’s color to black.

Final:

Reduce the opacity of our shadow and you’re done: Looks nice

Hope you like it. Feel free to post your replies with questions and suggestions.

Photo of the day: Road of freedom

Ali Chorov — Mon, 10 May 2010 17:51:30 +0000

There is a place out there I love to visit no matter what my mood is. It’s a place of beauty and I feel relaxed there. It’s a place where I feel free. I took this beautiful photo on the road of freedom. Hope you like it.

For full view, click on the image:

My images may not be reproduced in any form without my written permission.

Tutorial: Design Unique Web Button in photoshop

Ali Chorov — Mon, 10 May 2010 09:16:06 +0000

In this tutorial I’ll show you how to make a nice unique web button. I hope you will like this.

1. Take the rounded rectangle tool with radius 35px and draw a rectangle similar or same like in the picture:

2.Open the layer style window of this rectangle and follow the settings from the next few steps. Drop Shadow:

3.Inner Glow:

4.Bevel and Emboss and you can use contour here If you want the settings are default with the lower opacity:

5.Satin:

6.Stroke:

7.After this you must have something like in the picture here and now make a selection of the shape of this button (Hit CTRL+one mouse click on the vector mask thumbnail)

8.The next thing you should do is to take the rectangle marque tool and cut the bottom part of the selection. So now we’ll have a half selection. To cut with rectangle marque tool hold ALT keyboard key and drag with the mouse.

9. Make a new layer and feel it white color. Use CTRL+Backspace to do this much faster, but remember your foreground color must be white while doing this.

10.Make the layer mode to soft Light opacity: 25% like in the picture:

11. Take the type tool and with some nice font with a white color type the text you want (About us in my case):

—So now If you like the button as it is, you can leave it like that. If you want you can continue to see how to make the other part of it.—

12.Take the custom shape tool now and choose the shape I am shown in the image:

13.So on a new layer draw this shape in right side of the button.

14.Take the direct selection tool and while holding CTRL+ALT+SHIFT try to make the shape like in the next image:

15.Use the free transform tool to flip the shape horizontal.

16. While you have something like that, you can follow the settings in the next images:

17.Drop Shadow:

18.Inner Shadow:

19.Stroke:

20.Inner Glow:

21.Gradient Overlay:

22.Now here you can make a selection again and you do the same for this shape like in the step 7 and step8.

23.Make the layer mode to soft light again and maybe change the opacity. And this is it.

24.The final result of this button in different colors. Hope you like it.