Ok, if you have ever browsed apple.com, you see they have great reflections to show off their hardware/software/etc. In this tutorial I will show you all how to make a great reflection.

Step one: Workspace

First you need to find what you are reflecting, and be sure that it is already cut out (no background). This works especially well with a screenshot of their program iTunes, so that is what I will demonstrate with.

Now, create a new file that is able to support double the height of the object.

Step 2: Fill and Copy Object

Fill the background with any colour you like, but a sleek black or white is always great. Then drag your object onto the canvas and position it towards the top of the canvas. Hint: if you are using a gif, you may need to use the rectangular marquee tool to select the entire image, then move it.



Step 3: Copying the Object

Now right click on the layer the image is on and select Duplicate Layer. Go to Edit>Transform>Flip Vertical. With the move tool selected (dark mouse) hold shift and move the image so that it is exactly under the top image.



Step 4: Creating the Effect

First, go to the gradient tool and make sure it is set for Foreground to Background, and press D to reset the FG and BG colors to default (black and white).

Now, for the effect you need to go to the bottom of the layers panel with the copied layer selected and click Add Vector Mask (it looks like a box with a circle in it. This tool is somewhat complicated and somewhat simple: it makes the white visible, the gray less visible, and the black invisible. Draw the gradient now by dragging from the top of the copied portion to the bottom of the copied portion. Next, to make it more realistic, bring the opacity of that layer down to 50% (in either blending options or on the top of the layers panel). And, since this is a true fade out, you can have the background be anything you wish and it will still blend in and look great.



Also, you can select both layers (click one and shift click the other) and go to Edit>Transform>Perspective. Grab a corner and play around with it! (press enter when finished or escape to re-do) Here is what I did with that.

 

 

 

Reply

Great effects- I use them myself quite a lot when I am doing things for customers.
Good tutorial, easy to follow with good pictures, keep up the good work!
Edit: yeah the new look of the forum really messes up my opera when loading posts l;( a lot of the time I end up typing blind cos the text window does not load correctly untill I am on a new line ;(

 

 

 

Reply

Nice tutorial and a great effect, I was playing around with something similar the other day! Its simple to do and looks great!
Congratulations
-jimmy

Reply

I think I have seen tis before, but still some nice effects there....

Although creating the effects exactly like apple does it, doesn't seem the most innovative, so maybe if you change them a little bit from that, it'll seem a little more innovative, and look slightly more professional....instead of just like a copy. (just a suggestion to people who are going to use these effects places)

Reply

Cool, this is something I'm going to use more often , thx

Reply

Very nice I can't wait to use this to help make me a good reflection with some images of mine

Reply

Pardon the necropost.

You may want to consider making the reflects a little smaller.
You can do this by adding in a central black colour to your gradient or shifting the central point. Or, you can feather out the bottom part of the reflection.

From what I've seen, Apple doesn't use this effect to mirror more than 1/4 of the size of the object. It makes it look a sliver more interesting.


Moving away from the Apple style, you may want to add in a solid colour break (e.g., top black, bottom grey) where the image and reflection meet and add a gradiant overlay to it. This would appear to be a sort of ground.

Reply