Go Back   MacRumors Forums > Special Interests > Visual Media > Design and Graphics

Reply
 
Thread Tools Search this Thread Display Modes
Old Apr 20, 2006, 05:11 AM   #1
dalvin200
macrumors 68040
 
Join Date: Mar 2006
Location: Nottingham, UK
How do you create the mirror effect?

if you have seen the TUAW.com logo you can see what I mean about the "mirror" effect..

How is this done? As it's also done in iWeb too, but I want to do it freehand.

Is it just flipping a copy of the image and then using a linear gradient or something?

Or is there any easier way?

Thanks

PS: I'm not a whizz with photoshop or anything
__________________
Search before you post: MRoogle
dalvin200 is offline   0 Reply With Quote
Old Apr 20, 2006, 05:23 AM   #2
munkle
macrumors 68030
 
munkle's Avatar
 
Join Date: Aug 2004
Location: On a jet plane
This Photoshop action set will do the grunt work for you (assuming your using Photoshop)
munkle is offline   0 Reply With Quote
Old Apr 20, 2006, 05:37 AM   #3
dalvin200
Thread Starter
macrumors 68040
 
Join Date: Mar 2006
Location: Nottingham, UK
Quote:
Originally Posted by munkle
This Photoshop action set will do the grunt work for you (assuming your using Photoshop)
Thanks for that, although I don't have photoshop on my mac. Will this work on photoshop for pc?

Thanks
__________________
Search before you post: MRoogle
dalvin200 is offline   0 Reply With Quote
Old Apr 20, 2006, 07:17 AM   #4
munkle
macrumors 68030
 
munkle's Avatar
 
Join Date: Aug 2004
Location: On a jet plane
Have no idea but I guess it should...
munkle is offline   0 Reply With Quote
Old Apr 20, 2006, 04:56 PM   #5
mark_wilkins
macrumors member
 
Join Date: Aug 2003
Yeah, for that effect, flip and use a gradient.

-- Mark
__________________
Mark R. Wilkins
Author, MEL Scripting for Maya Animators
mark_wilkins is offline   0 Reply With Quote
Old Apr 20, 2006, 07:47 PM   #6
ChicoWeb
macrumors 65816
 
ChicoWeb's Avatar
 
Join Date: Aug 2004
Location: California
Works great on the web, but if they ever want to take that to print, its a whole new logo.
__________________
ChicoWeb is offline   0 Reply With Quote
Old Apr 21, 2006, 11:20 AM   #7
mac.FINN
macrumors member
 
Join Date: Feb 2006
Location: Canada
A cast shadow AND a reflection! Now there's something.

Best use of ridiculously cliched and needless effects in a logo... EVER!

mac.FINN is offline   0 Reply With Quote
Old Apr 21, 2006, 12:37 PM   #8
dornoforpyros
macrumors 68040
 
dornoforpyros's Avatar
 
Join Date: Oct 2004
Location: Calgary, AB
Send a message via AIM to dornoforpyros Send a message via MSN to dornoforpyros
Quote:
Originally Posted by mac.FINN
A cast shadow AND a reflection! Now there's something.

Best use of ridiculously cliched and needless effects in a logo... EVER!


no no, they still forgot a few cliches'

the sad thing is I could probably sell this for a reasonable sum of money to certain companies...probably the same companies who have "industry leader" on their website
Attached Images
 
__________________
Pointy metal guitars.
dornoforpyros is offline   0 Reply With Quote
Old Apr 21, 2006, 01:32 PM   #9
mac.FINN
macrumors member
 
Join Date: Feb 2006
Location: Canada
lol - nicely done.
mac.FINN is offline   0 Reply With Quote
Old Apr 21, 2006, 01:47 PM   #10
ATD
macrumors 6502a
 
Join Date: Sep 2005
Quote:
Originally Posted by mac.FINN
A cast shadow AND a reflection! Now there's something.

Best use of ridiculously cliched and needless effects in a logo... EVER!



One or the other but not both. Highly reflective surfaces tend not to show shadows. Reflections and shadows tend to fade and BLUR over distance, here's a very quick example.



Attached Thumbnails
Click image for larger version

Name:	gblur2.jpg
Views:	133
Size:	155.5 KB
ID:	45527  
ATD is offline   0 Reply With Quote
Old Apr 21, 2006, 02:22 PM   #11
Le Big Mac
macrumors 68020
 
Join Date: Jan 2003
Location: Washington, DC
Quote:
Originally Posted by ATD
One or the other but not both. Highly reflective surfaces tend not to show shadows. Reflections and shadows tend to fade and BLUR over distance, here's a very quick example.


interesting observation, although isn't the blur simply an effect from photography, where depth of field is insufficient? Nothing in the mirror I look at at home seems blurry, if I focus on it.
Le Big Mac is offline   0 Reply With Quote
Old Apr 21, 2006, 02:49 PM   #12
ATD
macrumors 6502a
 
Join Date: Sep 2005
Quote:
Originally Posted by Le Big Mac
interesting observation, although isn't the blur simply an effect from photography, where depth of field is insufficient? Nothing in the mirror I look at at home seems blurry, if I focus on it.

A mirror is different but very few surfaces are prefect mirrors. Surfaces have 3 surface components, Diffuse, Glossy and Specular. Diffuse surfaces scatter light in all directions, because the light rays bounce in unfocussed direction there will be no reflection. A piece of chalk is a good example of this, the fine texture is rough. A Glossy surface will scatter light in a more focussed direction, giving it some reflective properties. These surfaces have a slight texture, like a painted surface. A Specular surface like a mirror is very smooth and will bounce light in one very focussed direction. Most surfaces that reflect are not 100% Specular.


Attached Thumbnails
Click image for larger version

Name:	Surfaces.jpg
Views:	56
Size:	50.7 KB
ID:	45539  

Last edited by ATD; Apr 21, 2006 at 03:08 PM.
ATD is offline   0 Reply With Quote
Old Apr 22, 2006, 02:36 AM   #13
dogbone
Banned
 
dogbone's Avatar
 
Join Date: Sep 2005
Location: S33.687308617200465 E150.31341791152954
It should also be pointed out that it is different photons that are reflected to the ones that went in. Not that this makes any difference.

EDIT:

Another peculiarity of reflections is that you can see a very diffuse reflection like that from the surface of a wacom tablet but if you view it at a very acute angle it appears to be a mirror finish.

Last edited by dogbone; Apr 22, 2006 at 05:46 AM.
dogbone is offline   0 Reply With Quote
Old Apr 24, 2006, 04:04 AM   #14
ATD
macrumors 6502a
 
Join Date: Sep 2005
Quote:
Originally Posted by dogbone
It should also be pointed out that it is different photons that are reflected to the ones that went in. Not that this makes any difference.
Should we start a discussion of QED here? My minor was Physics

Quote:
Originally Posted by dogbone
Another peculiarity of reflections is that you can see a very diffuse reflection like that from the surface of a wacom tablet but if you view it at a very acute angle it appears to be a mirror finish.
I think that can be explained. The surface you are looking at is a smooth surface with very fine pitted texture on it. If you turn it on end you will only see the top smooth surface and not the pitting. The reflection rays will have a focused bounce to them like a Specular surface and will give you a mirrored look.



ATD is offline   0 Reply With Quote
Old Apr 24, 2006, 04:22 AM   #15
dogbone
Banned
 
dogbone's Avatar
 
Join Date: Sep 2005
Location: S33.687308617200465 E150.31341791152954
Quote:
Originally Posted by ATD
Should we start a discussion of QED here? My minor was Physics
Sounds like a plan. While not QED this is fun.

EDIT: I forgot to mention I liked the idea of having the reflection on a bumpy surface. Was the surface rendered in a 3D app as well?

nothing to see here folks.

Last edited by dogbone; Apr 24, 2006 at 04:30 AM.
dogbone is offline   0 Reply With Quote
Old Apr 24, 2006, 05:58 AM   #16
dalvin200
Thread Starter
macrumors 68040
 
Join Date: Mar 2006
Location: Nottingham, UK
Quote:
Originally Posted by dornoforpyros
no no, they still forgot a few cliches'

the sad thing is I could probably sell this for a reasonable sum of money to certain companies...probably the same companies who have "industry leader" on their website
so how did you do this? that's EXACTLY what i'm looking to achieve..

i've not got GIMP installed, so any instructions would be greatly appreciated

thanks
__________________
Search before you post: MRoogle
dalvin200 is offline   0 Reply With Quote
Old Apr 24, 2006, 06:26 AM   #17
dogbone
Banned
 
dogbone's Avatar
 
Join Date: Sep 2005
Location: S33.687308617200465 E150.31341791152954
Dalvin, you got it right in your first post. It really is as simple as flipping it and fading.

Some things that can cause a problem though are letters that extend past the normal heigh of letters in order to counter the illusion caused by curves. So an 'S' will be lower at its lowest point than a letter with a flat bottom.

As you are trying to achieve a realistic effect of the letters sitting on a surface they obviously cannot extend *into* the surface. So there might be a bit of juggling involved (which I didn't do in my sample). Also chunky letters are better suited for this mirror effect.

You can just flip it and use a layer mask with a gradient to fade it. That is the basic effect but it's the little details that make it work better. You can also cmd click on the layer mask that you used to load it as a selection that you can use to apply a blur. In the sample I've posted I did that to apply a graduated blue. but then I made a copy of that layer and applied a motion blur at 90º as well. Then I reduced the opacity of the layers till they were right. Then I used another layer mask on the layer with the motion blur to remove the top part so it would be sharper at the beginning of the reflection. Finally I added a gradient background increase the effect of of a surface. Then I applied a bit of a lighting effect to the background and faded it.
Attached Thumbnails
Click image for larger version

Name:	rubbish.jpg
Views:	33
Size:	6.4 KB
ID:	45722  
dogbone is offline   0 Reply With Quote
Old Apr 24, 2006, 06:49 AM   #18
dalvin200
Thread Starter
macrumors 68040
 
Join Date: Mar 2006
Location: Nottingham, UK
hey dogbone - thanks for that..

i'll give it a try tonight using GIMP..

it's actually not for text, but for a photo image

PS: it's "Rubbish" :-)
__________________
Search before you post: MRoogle
dalvin200 is offline   0 Reply With Quote
Old Apr 24, 2006, 06:59 AM   #19
dogbone
Banned
 
dogbone's Avatar
 
Join Date: Sep 2005
Location: S33.687308617200465 E150.31341791152954
Quote:
Originally Posted by dalvin200

PS: it's "Rubbish" :-)


er I meant that.
dogbone is offline   0 Reply With Quote
Old Apr 24, 2006, 11:16 AM   #20
dornoforpyros
macrumors 68040
 
dornoforpyros's Avatar
 
Join Date: Oct 2004
Location: Calgary, AB
Send a message via AIM to dornoforpyros Send a message via MSN to dornoforpyros
Quote:
Originally Posted by dalvin200
so how did you do this? that's EXACTLY what i'm looking to achieve..

i've not got GIMP installed, so any instructions would be greatly appreciated

thanks
your kidding right? please tell me your kidding and your not missing the irony of that image...

In case your not Gimp Reflection


ps. google is great

EDIT:Oh I misread that, I thought you had gimp, I used photoshop, but the technique is the same.
__________________
Pointy metal guitars.
dornoforpyros is offline   0 Reply With Quote
Old Apr 24, 2006, 01:38 PM   #21
ATD
macrumors 6502a
 
Join Date: Sep 2005
Quote:
Originally Posted by dogbone
Sounds like a plan. While not QED this is fun.
LOL, cartoon Physics.

Quote:
Originally Posted by dogbone
EDIT: I forgot to mention I liked the idea of having the reflection on a bumpy surface. Was the surface rendered in a 3D app as well?
The Gs and the surfaces were rendered in Maya.


ATD is offline   0 Reply With Quote
Old Apr 24, 2006, 03:37 PM   #22
dalvin200
Thread Starter
macrumors 68040
 
Join Date: Mar 2006
Location: Nottingham, UK
OK,

I've finally managed to achieve this in GIMP.. took me a while to get used to the controls etc.. and learn how to work with the layers etc..

so it's not the best, but i managed to do it, and with more practice can get things quite nice!!

but here we go

thanks for all the help..
__________________
Search before you post: MRoogle

Last edited by dalvin200; Dec 4, 2006 at 11:43 AM.
dalvin200 is offline   0 Reply With Quote
Old Apr 17, 2009, 07:35 AM   #23
cekim
macrumors newbie
 
Join Date: May 2008
Quote:
Originally Posted by dalvin200 View Post
if you have seen the TUAW.com logo you can see what I mean about the "mirror" effect..

How is this done? As it's also done in iWeb too, but I want to do it freehand.

Is it just flipping a copy of the image and then using a linear gradient or something?

Or is there any easier way?
That's pretty much spot-on. I used to do this manually in Gimp and if I recall correctly you duplicate the layer of the object you want to mirror, then reduce the opacity of that layer and apply a transparent linear gradient to the layer mask.

I say "used to" because it became quite tedious when trying to apply this effect to a large number of images for websites, so I switched to ResizeMe to batch reflect images and have been satisfied.
cekim is offline   0 Reply With Quote
Old Apr 17, 2009, 07:56 AM   #24
opeter
macrumors 6502a
 
opeter's Avatar
 
Join Date: Aug 2007
Location: Slovenia (EU)
Quote:
Originally Posted by dalvin200 View Post
OK,

I've finally managed to achieve this in GIMP.. took me a while to get used to the controls etc.. and learn how to work with the layers etc..

so it's not the best, but i managed to do it, and with more practice can get things quite nice!!

but here we go

thanks for all the help..
Could you please post it?
__________________
My cartoon hero: www.dangermouse.org
opeter is offline   0 Reply With Quote
Old Apr 17, 2009, 08:41 AM   #25
dalvin200
Thread Starter
macrumors 68040
 
Join Date: Mar 2006
Location: Nottingham, UK
Quote:
Originally Posted by opeter View Post
Could you please post it?
wow.. that post was almost 3 years back!!

anyway, i can't for the life of me remember, but there is a link with the steps in post 20 (above)

hope it helps
__________________
Search before you post: MRoogle
dalvin200 is offline   0 Reply With Quote

Reply
MacRumors Forums > Special Interests > Visual Media > Design and Graphics

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Similar Threads
thread Thread Starter Forum Replies Last Post
WallFx - Crop,scale or rotate & create gradient,blur effect and plain color wallpaper charstacky iPhone and iPod touch Apps 0 Apr 3, 2014 06:19 AM
PS6 Help: How do I create this effect? JasonBourne1 Design and Graphics 2 Apr 23, 2013 07:24 PM
Pages: can't create character style whose only effect is to turn text red e271 Mac Applications and Mac App Store 0 Mar 25, 2013 02:58 AM
2 Easiest ways to create a fisheye lens effect with Photoshop shopvido Design and Graphics 0 Oct 12, 2012 12:42 AM
Mirror two computers? definitive Mac Basics and Help 0 Jul 3, 2012 06:29 AM

Forum Jump

All times are GMT -5. The time now is 11:43 AM.

Mac Rumors | Mac | iPhone | iPhone Game Reviews | iPhone Apps

Mobile Version | Fixed | Fluid | Fluid HD
Copyright 2002-2013, MacRumors.com, LLC