Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

blurring photo edges for web presentation 1

Status
Not open for further replies.

boyfromoz

Technical User
Feb 1, 2001
469
AU
I'm trying to blur the edges of some photos so the edges gradually fade to transparent so they blend in with the background of a web page. I've tried all sorts of things but none are satisfactory.

Can someone please tell me the best way?
 
hi Nippi,

you should be able to do this using simple feathering. First set your image in a layer on its own, then create a new layer beneath it. Fill the new layer with the bg of your web page (either with a solid colour or the bg pattern using the edit >define pattern and then edit > fill:pattern command).

Next select the image layer. Do you want the photo to blend into the bg as a rectangle or as an outline of the image? This will determine the complexity of the selection required - if it is merely a rectangle then we can use the rectangular marquee tool with the feather set to an appropriate value. Otherwise you will need to use the most appropriate selection method to outline the image and apply the select > feather command.

Once you have created your selection go to your layers palette and with the image layer still active click on the add layer mask icon. This will have the effect of deleting the edge of your image, but will retain all your image information.

If this looks ok in PS turn off the background layers visibilty and save it for the web using transparency - remember to set the matte colour to your background colour. (if you are using a patterned bg use an index transparency to knock out the dominant colour, or else line it up perfectly! (hard!!))

Should work ok but tell me if theres a prob
gottago
see ya
 
OK. I was on the right track and had tried this, but its still not quite right.

I am using a rectangle photo on an almost white background. Regardless of the width of the feather setting, the edges of the photo never quite dim to the virtual whiteness I need. i want the edge of the photo to be virtually invisible, as opposed to simply just being lighter.


I want the edges of the photo to appear to start forming out of the background, as opposed to them simply being lighter on the edges.

GollyG. You instruction are clear and I can have a shot at something harder is you have another solution.

tah for now

Nippi
 
K. Have solved it, its messy... but it works.

Done as you said GollyG, then remasked and use linear gradient on the edges moving from the inside of the picture out until I got it right. Figure there is still a simpler way?
 
The thing to remember with your feathering is that the feather will be either side of the selection. Since the 'marching ants' (dotted line representing selection) is simply a divider, PS calcultes it at 50% transparency, meaning it falls in the middle of the feather. So even if you make a selection thinking it is the outside border, when you feather it it becomes the midpoint.

So create your selections inside the extremeties of the picture - if you need more control go into quick-mask mode (bottom of the toolbar). This will show a full grey-scale rendering of the mask, allowing fine adjustment.;-)

gollyg
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top