How to reduce size of PNG? OR how to apply drop shadow to section of text only?

[electriclove]

Hi everyone,

I am supposed to be designing a Snapchat geofilter for a school event. The restrictions Snapchat has on submitted geofilters are that the background has to be transparent and the size must be less than 300KB. I have a simple design with a small triangular shape filled with a gradient on the bottom, a small logo, and a few lines of text. I have applied a stroke to each text line. Additionally, I applied a drop shadow to the line of text that is on top of the gradient so that it stands out more (as the colours are similar due to the required theme for the event).

However when I "save as" a png, the file size is around 550KB. I did some reading online and people suggested to "save for web", however this ruins the drop shadow for the line of text. (I have learned it is because there are no pixels for it to blend with?) I have inserted an example of what I mean by the text line cutting through the gradient at an angle below.

My question is: is there a way I can decrease the file size by 250KB while keeping the drop shadow?

If not, then is there a way I can like section off the drop shadow so that there is only a drop shadow over the gradient section and not over the transparent background?

Thank you in advance for your help and suggestions!

[Sahil.Chawla]

Hi Electriclove,

You can use "Save as" to save the file as .PNG, and to decrease the size you can lower the resolution by going to Image > Image Size.

Regards,
Sahil

[Nancy OShea]

Export As > PNG with Transparency.  Do not click on 8 bit option.  Instead decrease image size to reduce file size.  See screenshot.

My resulting PNG.

[Barbara Ash]

You can either:

File > Export > Export As. Choose PNG with Transparency.

Or

File > Export > Save for Web Legacy. Choose PNG24 with Transparency.

Click the flyout menu in the upper right corner and choose Optimize to File Size.

There you can type in your desired file size.

[rayek.elfin]

Photoshop and Adobe applications in general are pretty abysmal at optimizing PNG images without a lot of manual intervention. I use Color Quantizer (free tool, Color quantizer ) to achieve great quality versus very small file sizes with a few clicks. Get the right tool for the job instead of fiddling around with Photoshop.

Also, the old Save for Web function is absolutely terrible at PNG optimization: it can't even handle basic 256 indexed fully transparent PNG export. Avoid like the plague.

See below: 97kb, 512 colours. Color Quantizer.

Or this one, 51kb, 128 colours, dithered, masked edge to preserve edge anti-aliasing (CQ features a brilliant mask tool to control precisely which colours ought to be preserved as much as possible). Color Quantizer has many other setting to control quality, the type of dithering, control whether gradients or details ought to be preserved, and many more.

[electriclove]

Thanks everyone for your replies, I will give them a try. I didn't mention in my original post but the dimensions of the image are also restricted to 1080x1920 px so I don't believe I can change the image size.