• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
1

How to Load Selection with ALL semi-transparent (semi-opaque) pixels

Community Beginner ,
Apr 07, 2018 Apr 07, 2018

Copy link to clipboard

Copied

I have been researching this subject on the forums and experimenting on my own for quite some time without figuring out how to achieve this desired functionality.

My understanding is that load selection's functionality is to select all opaque pixels and pixels with a transparency value of 50% or higher. I have need of being able to select pixels with ANY transparency value greater than zero.

I am working on a 2D Unity project where all assets are required to be imported as they were designed within Photoshop. Some of the assets are created using blend modes and layer styles which are being blended with a base layer that will NOT be imported.

In order for the blend mode to take effect, I must flatten the blend layer with the base layer and then alpha out the base layer's contents (because it will not be imported).

Before merging, I have created a duplicate of the blend layer that is flattened with an empty layer that I can use to sample the alpha with Load Selection.

The issue I am experiencing, is that using Load Selection, inverting, then deleting... while correctly deleting the base layer, actually comes with the unintended consequence of also deleting part of the Outer Glow layer style. The outer glow creates a black outline that fades into full transparency, and I'm essentially omitting half of the effect because the selection will not register the 0<X<50% pixels.

I have tried Load Selection and adjusting the threshold of a quick mask to increase my selection, but this causes all pixels to become fully opaque which is also undesired behavior.

I have even tried something as simple as Load Selection on the flattened layer, inverted selection, and deleted just to see if the inverse of the selected area was accurate, and even doing this deletes part of the glow. I also tried this with Select All to no success.

Is there some way to select all pixel with a transparency greater than zero with Load Selection or some other selection method? I have thought about painting a mask on the flattened layer, but the shape of the art is so intricate I'd imaging it'd be near impossible to get it fading out accurately.

Views

1.6K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Adobe
LEGEND ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

Well, have you even ever looked at the channels palette and image calculations. all your answers are there.

Mylenium

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

Yes, and Yes. Not sure what you were attempting to get at. Could you elaborate?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

Is there some way to select all pixel with a transparency greater than zero with Load Selection or some other selection method?

Not greater than zero, but the Magic Wand set to 0 tolerance will accurately select all pixels that have 0% opacity, so it's just a matter of inverting the selection. With multiple layers you would have to turn on the Wand's Sample Colors from composite image.

I can't think of a way do get at all transparent pixels via Edit>Calculations..., but maybe Mylenium can elaborate

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

I created a mockup PSD file to help illustrate my issue better (I'm not sure how to upload this - third party service?). These aren't the actual assets I'm working with but should be sufficient in explaining the issue I am having.

The file essentially has two elements:

1) Banner graphic - has a purple Outer Glow layer style; the Outer Glow effect uses a Multiply blend mode.

2) Background - simple purple to orange gradient.

Image1.jpg

What I would like: I want to save the Banner the way it looks in the above graphic, but without the background.

The problem of course being that because the Outer Glow uses a Multiply blend mode, it is reliant on the Background layer for the overall outer glow look.

This happens when I turn off the background (note: I have added a white background to help see the outer glow, but this has no effect on the Multiply blend mode):

Image2.jpg

The Outer Glow in each graphic have a disparity in color.

Really, there are only two solutions as far as I can tell (if there are others, I'd gladly hear them 😞

1) Change the blend mode to Normal on the layer style and change the color to be darker (closer to the result you would get by using the Multiply blend mode). NOTE: This is what I ended up doing, but you lose out on the varying luminescence values you would get from using Multiply, so I am a bit dissatisfied with this solution.

2) Merge the banner layer (along with the layer style) with the background so that the Outer Glow is permanent... THEN delete the background. In theory this sounds like it should work.

The rest of this post will deal with solution 2, and the issues that ensue.

First, I will make a duplicate of the Banner layer with the layer style and a duplicate of the background. They will be merged to rasterize the Outer Glow.

I call this layer Banner_Merged.

Image3.jpg

I then make another duplicate of the layer with the layer style, then merge it with an empty layer to rasterize the Outer Glow effect. This layer does not have the background.

I call this layer Banner_Flattened.

Image4.jpg

It does not matter what this layer looks like, since I will only be using this layer to sample my alpha via Load Selection. So, I use Load Selection, invert the selection, then delete from the Banner_Merged layer.

This is the result of deleting the background from Banner_Merged, but with the original background turned back on.

Image5.jpg

The banner and background ARE on separate layers, so this appears to be a success. However, a trained eye will notice that the Outer Glow of the banner has actually diminished after the alterations. You may compare Image3.jpg and Image5.jpg (Image3 is the banner merged with the background, Image5 is the banner with the background deleted).

Essentially, this is what led to me posting here about making semi-transparent selections.

But ultimately, all I really want to do is save the banner without a background while still maintaining the correct outer glow thickness and color that is being provided by the Multiply blend mode on the layer style. Jeez, that was a mouthful.

I hope you can help provide some pointers as to how this would be done. Hopefully, I am just missing something very obvious. And if there is no other method, I guess I could live with solution 1 from earlier in the post.

Kind regards,

Harvey

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

while still maintaining the correct outer glow thickness and color that is being provided by the Multiply blend mode on the layer style. Jeez, that was a mouthful.

I don't think you'll be able to do this, because the blend modes are not honored by other applications. This comes up occasionally in the InDesign forum. If you save a PSD with transparency that includes a blend mode and place in InDesign, the blend mode reverts to Normal when you place. I don't think there is any way to export a blend mode to another application.

Here's a blue to transparency gradient set to Color Burn over yellow in Photoshop on the right. If I save the PSD with its background deleted or hidden and place in InDesign I don't get the PS blend mode.

Screen Shot 29.png

The PS gradient set to normal matches the placed file over in ID.

Screen Shot 30.png

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

Gotcha. Well, let's say I forego importing a PSD to Unity. What about a PNG? Is there any way to delete the background of the merged layer in such a way that it doesn't eliminate most of the outer glow?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

PNG wouldn't help with the blend mode—your multiply blend mode will not be included.

Why merge? Why not simply hide the Background layer and export a PNG with transparency? That works going to InDesign:

Screen Shot 33.png

This is the legacy Save for Web 24-bit PNG with Transparency checked

Screen Shot 34.png

Placed in ID

Screen Shot 36.png

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

Thanks for the suggestion. I tried TIF, PSD, and PNG formats with transparency and they do not work insofar as the alpha cuts into the outer glow effect (the same as deleting the background after rasterizing the Outer Glow).

The blend mode link you provided actually blends the entirety of the image. I have seen some other outline shaders on YouTube videos. They weren't for sprites, but I'm sure there's something out there. I was hoping for a Photoshop solution to avoid any shader overhead, but it's honestly probably very insignificant.

Guess I'll try hunting down some shaders.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

Couldn't you handle the glow with the Unity coding?

https://elringus.me/blend-modes-in-unity/

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

Actually, I found this on the Unity forums:

"The problem with outer glow is it's a very expensive effect to reproduce in real time, and worse the way sprites work the glow can only extend as far as the sprite's mesh, which is usually fairly tight to the sprite, and can bleed glows from the surrounding sprites packed in the sprite atlas too close, hence why the outline effect that is common is usually only a pixel or two wide.

The easiest way to do a outer glow like Photoshop is going to be to an outer glow in Photoshop."

So a Unity shader solution doesn't seem like a good idea. Back to Photoshop it is.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

LATEST

Okay, I've got as good a solution as I will get on this subject.

Through sheer experimentation, I found that a really close approximation is simply to:

1) Set blend mode to normal and manual select a color that closely matches the blend result.

2) Duplicate the layer.

And that's it. Save out as PNG and drop it into Unity and looks near identical to Photoshop. You will have a flat luminence value across your glow, so this won't work with glows that are intended to have varying intensities. But you can probably solve that by inverting the selecting and taking a brush tool with a low opacity and alpha masking/deleting parts of the glow.

There is something about low transparency pixels get alpha'd that makes straight texture conversion to Unity not fully accurate, but this is a viable workaround.

Thanks for your earlier help, Rob.

-Harvey

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

Sorry if I'm misunderstanding your question, but have you tried Command clicking the layer with transparency you want to select? That will load the layer's transparency as a selection, which can then be saved as a channel.

Screen Shot 3.png

Pixels with less than 50% transparency do get selected, they just don't get represented by the selection marquee above. Here you can see the transparent selection gets represented by a corresponding gray value in the saved channel.

Screen Shot 2.png

My understanding is that load selection's functionality is to select all opaque pixels and pixels with a transparency value of 50% or higher. I have need of being able to select pixels with ANY transparency value greater than zero.

If I want to select all of the pixels with any amount of transparency, I can use the Magic Wand set to 0 Tolerance and with Selecting Contiguous Pixels on a pixel that is fully transparent and then invert the selection.

Sel.png

Screen Shot 7.png

Edit: If you have multiple layers turn on the Magic Wand's Sample Colors from composite image

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

Thanks for the reply, Rob!

As an example, I have tried to use Load Selection on an image with feathered alpha (going from fully opaque to fully transparent). And THEN used a Fill for white and I can very clearly see that the Fill extends beyond the perceived marquee selection.

So, I understand what you are saying. The selection is in fact including pixels lower than 50% transparency. I also tried the wand tool at 0 tolerance, but then my selection is simply fully opaque. :[ That is the part that boggles me about this whole thing. If I use Load Selection on that same graphic, Select Inverse, and Clear it will actually remove part of the graphic even though the inverse should be what it ISN'T and in theory have no effect.

Actually, I just realized in writing this reply this may very well be the intended functionality within Photoshop since these operations are likely happening on a per pixel basis. It is possibly that those outliers, being less than 50% when inverted would be treated as more than 50% in their selection and using Clear would understandably cull them.

Now, I'm not sure what to do. I have to delete via selection because I need my images exported as PNGs which do not support alpha channels. I am sure if I used a format that supported alpha channels, I could just save the selection as alpha, and let the image decide how to apply the transparency on the artwork. Hmm..

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

Can you share a sample file? Why PNG? Is this going to print or web?

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

PNG for lossless as it will be going into the Unity game engine which will compress the image format automatically (in other words, to avoid double compression).

I suppose the question is whether there are lossless formats that are supported by Unity that also save alpha channels. I will try importing the PSD directly.

And yes, I will provide a sample file shortly. I tried the wand tool method again. Zero tolerance, inverted, and used a fill. The result was about what I experienced earlier. With the exception of the outermost pixels, the selection is treated as opaque (which makes sense to me).

I'll actually post a few photos after I try importing the PSD to better illustrate what is happening and what I would like to happen.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 08, 2018 Apr 08, 2018

Copy link to clipboard

Copied

My understanding is that load selection's functionality is to select all opaque pixels and pixels with a transparency value of 50% or higher. I have need of being able to select pixels with ANY transparency value greater than zero.

It's understandable why you might think that, because the warning displayed when loading less than 50% transparency as a selection is a bit ambiguous. Here there actually is a selection it just can't be represented with a marquee.

Screen Shot 9.png

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines