Mobile app version of vmapp.org
Login or Join
Si6392903

: Saving PSD to PNG with layer transparencies loses layer effects I've got a PSD of a shirt mockup that has several effect layers for highlights and shadows, and then layers for shirt colors.

@Si6392903

Posted in: #AdobePhotoshop #Layers #LayerStyle #Transparency

I've got a PSD of a shirt mockup that has several effect layers for highlights and shadows, and then layers for shirt colors.

What I'm trying to do is use this in a web based editor where I can programatically set the background color without having to load a separate image per color - the base PNG would be an overlay allowing the color to show through.

I need to save the mockup to a transparent PNG with no shirt colors - just the highlights and shadows.

However, when I do save as a PNG or save for web as PNG with none of the shirt color layers visible, the resulting PNG doesn't maintain the transparency.

Here's the sample file: www.dropbox.com/s/f1j5bj4nk48l9l0/tee-mockup.psd
The shading group is set to passthrough, and the layers in it are set to color dodge, screen, color burn and multiply.

I can't for the life of me how to save this as a PNG with transparencies/layer effects intact. I know this is possible because many online editors are using mockups just like this. Is there a specific method for doing this? Any help is greatly appreciated. Thanks!

10.01% popularity Vote Up Vote Down


Login to follow query

More posts by @Si6392903

1 Comments

Sorted by latest first Latest Oldest Best

 

@Turnbaugh909

Blending modes within Photoshop do NOT translate to PNG format. It is not a matter of "how". It is a matter if it being impossible based on current technology.

In order for a PNG to work properly all your Photoshop layers need to be set to Normal for the blending mode. This means you need to avoid using any blending modes when setting things up in Photoshop.

Blending modes use inter-layer calculations to formulate an appearance. Essentially Photoshop does a calculation:
(this pixel / blending mode) + Underlying pixel = appearance

In the PNG format, there is no inter-layer communication. Within a PNG everything is 1 layer and a pixel is a color and an alpha, that's it. You can't tell a PNG to "alter color of this pixel based upon the pixel underneath it" because the PNG isn't aware of any pixel underneath it.

In short, you just can not achieve inter-layer interactions using PNG images. If using PNGs for highlights and shadows the best you can do is create dark and light pixels then adjust the alpha for those pixels but you just can not use blending modes.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme