raymir opened this issue on Feb 27, 2008 · 10 posts
raymir posted Wed, 27 February 2008 at 10:14 PM
hi everyone, i would like to know if any of you have a tutorial or can teach me how to make those pictures that kind of pop at you... example: http://www.giddykippa.com/site/index.cfm the way the big teddy bear to the right looks like is popping out of the screen.. sorry if i cant explain what im trying to see.. thanks in advance..
aprilgem posted Wed, 27 February 2008 at 10:19 PM
Take a look at the actual image:
http://www.giddykippa.com/images/header_back.jpg
It's not really popping out -- the background is really just part of the image.
So the thing to do is to incorporate the background into your title/header image, and make the main graphic element go beyond the fake border of your main area. :)
raymir posted Wed, 27 February 2008 at 10:28 PM
that was a bad example of a website... i saw another one but i cant find it.. where the make the graphic pop at your.. do you understand what im trying to say?
aprilgem posted Wed, 27 February 2008 at 10:30 PM
Um, no. I don't understand.
raymir posted Wed, 27 February 2008 at 10:34 PM
i think it may have to do with what you said on top.. once i find the example im talking about.. i will post it... other question thou, do you know where i can find tutorials of how to make cool text and buttons etc in photoshop?..
Angelouscuitry posted Wed, 27 February 2008 at 10:56 PM
I think the image of the bear just has a transparent background, as in there is nothing to the image accept the bear/ Then that is layer over whatever is underneath. And then a drop shadow is layer is placed in between.
raymir posted Wed, 27 February 2008 at 11:01 PM
oh ok.. thanks
eddiej posted Thu, 28 February 2008 at 6:59 AM
I think it is the angle at which the image of the bear was taken ie from slightly above.
The image also stands out a bit because of how the image was lit.
If your asking how does the image sits in front and over laps the background the the answer is it is a compostion of several images,the bear,the backgorund colours etc.The bear has probably been cropped from a studio shot and a drop sahdow has been applied to the bear which makes it look like its casting a shadow onto the background.
Basically the page designer designed the background image ie the blues and whites and the text then dropped the image of the bear onto it, probably in a programme like Macromedia Fireworks.I think it is possible to do this with Photoshop but never tried.
Eddie
vince3 posted Fri, 29 February 2008 at 3:55 AM
Attached Link: http://www.photoshoproadmap.com/Photoshop-blog/2007/07/22/the-best-80-photoshop-text-effects-on-the-web/
here are some text effect tutorials.
pauljs75 posted Fri, 29 February 2008 at 4:28 AM
Another way to do something similar is with .png files that support transparancy. (Even better than .gif in that regard - no edge mess.) But I'm not sure if IE7 is on the boat with that one yet. (Works well with Firefox, and I believe Opera as well.) Do the other stuff as described before, but with transparent .png you have more freedom not worrying about trying to match the background color. (Like the Wings3D critter I put in my sig.)
Your friendly neighborhood Wings3D nut.
Also feel free to browse my freebies at ShareCG.
There might be something worth downloading.
