Skip to main content
wayne_carey
Known Participant
July 7, 2022
Answered

JPEG with outline path to transparent PNG files conversion

  • July 7, 2022
  • 3 replies
  • 5363 views

Hey Everyone!

 

I’ve been handed what could be a HUGE project if I can’t find a solution to make this easier. I’ve got hundreds, if not, thousands of JPEG files that have been outlined with a path, and our web guys are moving to a new B2B platform that requires transparent PNG files rather than JPEG files for our product images. Does anyone have a quick easy solution, maybe an app, that can convert a folder of pathed outlined JPEG files into transparent PNG files? I can painfully do this one file at a time in Photoshop but it will take WAY too long to do this. 

 

Before we go any further, I’m on an Intel-based iMac running macOS 12.4 Monterey.

 

I’ve scoured the web for a Mac-based app for the conversion and so far, all I’ve downloaded will not save a transparent PNG from a pathed outlined JPEG. I guess I could write an Action and use the Batch tool to do this but that’s far from perfect in my experience, especially what I need to do here. Any thoughts?

This topic has been closed for replies.
Correct answer willcampbell7

Thanks again, William.  Thinking about it, I think it might be a great option for disabling the letter case.  That way I could still denote the web version over the full res version in the file names and others could have the choice if they should want it.


I made a few more tweaks. I realized the code I used for saving JPG is better suited for print work (I come from the print biz) and uses baseline. I updated the script to use progressive, 3 scans. Better for web images. Also @wayne_carey how about marking my answer as the solution? It is, I hope. It helps my reputation here <smile>

https://www.marspremedia.com/software/photoshop/batch-web-images

 

3 replies

Earth Oliver
Legend
July 15, 2022

I've been using Image Processor Pro to do exactly this for the past 15 years. Before dismissing the great advice you received here, you should have at least tried to use the tool. 

willcampbell7
Legend
July 15, 2022

This sounds like a good idea for a new script so I took a stab at it the morning. I've taken components from my other scripts and combined the parts into a solution specific to this need. I call it "Batch Web Images." It's fresh out the oven, conceived only hours ago, so bear with me if I missed something and it throws an error because of something I didn't anticipate. Gotta start somewhere, and this is it. I'll watch responses and fix anything that comes up. Also I am thinking maybe add the option to crop close to the subject, perhaps enter a small percentage of subject size for margin all around. All feedback is welcome. Download at this link:
http://www.marspremedia.com/software/photoshop/batch-web-images

EDIT: oh and I forgot to mention, please mark as correct answer if it works out. Thanks!

EDIT2: here's an image...

 

William Campbell
willcampbell7
Legend
July 17, 2022

Thanks for the feedback, Stephen. It's very helpful.

I've done a little more work on the script. Updated version is at the same link:

http://www.marspremedia.com/software/photoshop/batch-web-images

Below is an updated UI image.

I've added the option for alpha channel. Great suggestion. And added the option to crop to a percent of subject longest dimension, as I mentioned in the last message.

In your comments I wasn't sure at times if you were pointing out how the script works, or how you wanted it to work that just so happens to be how it works. Anyway, yes subfolder structure is preserved. Nothing I sweated over, just this initial script was quickly made by plugging togethter pieces of other scripts, and it was from one that happened to have that feature added (user request). Yes path is first found. Same for the new alpha channel option. And yes, fallback to select subject if either is missing.

The progress bar should work, but it can be strange when losing app focus, like you tab away to another app while the script is running. This applies to all my scripts with a progress bar. It's just one of those quirky Adobe app things. To help, I took out disabling the progress bar close button. That's just a habit. No harm in leaving it. As for having a progress bar -- I'm a big fan, even if it's funky. When I process 500 images I like an idea of where we are. That's just me, and since I'm the programmer, my scripts get progress bars.

About "worth noting in a read-me doc", yes of course, but that comes later. At the moment I'm at the stage of building a proof of concept. When the time comes this new script is working OK and added to my website, trust me, it will be throroughly documented as are all my scripts. I assume you have visted my site before? See this page for an example of documentation that nears the effort of coding the script itself: http://www.marspremedia.com/software/photoshop/batch-multi-save    It took quite some time and effort to write all that.

Last, about saved settings, yes I imagine that eventually, just like other scripts of mine, but that's a line once crossed the script becomes closed source.

Monday is just arond the corner and that means back to paying projects. I'll revisit this one here and there as time permits. Keep the suggestions coming. All feedback is welcome.

 

William Campbell
willcampbell7
willcampbell7Correct answer
Legend
July 26, 2022

Thanks again, William.  Thinking about it, I think it might be a great option for disabling the letter case.  That way I could still denote the web version over the full res version in the file names and others could have the choice if they should want it.


I made a few more tweaks. I realized the code I used for saving JPG is better suited for print work (I come from the print biz) and uses baseline. I updated the script to use progressive, 3 scans. Better for web images. Also @wayne_carey how about marking my answer as the solution? It is, I hope. It helps my reputation here <smile>

https://www.marspremedia.com/software/photoshop/batch-web-images

 

William Campbell
Stephen Marsh
Community Expert
Community Expert
July 7, 2022

Can you upload a few example images? If you can do this via a batch action a script would do the same.

wayne_carey
Known Participant
July 7, 2022

I thought about that and tried it but the action can't save to the other folders you're working in (meaning the Action can ONLY save to the folder you used when creating the Action to save the file as a PNG) and batching it doesn't save to different file formats, just appending to the existing file name.  So that makes you think of using the Image Processor.  Well, it doesn't save to PNG.  I've been complaining to Adobe about this for many years now.  I've added a file showing an example of the files I have to work with.  It is a low-resolution with outlined path to keep this simple.  Years ago, I had a stand-alone app for the Mac that did exactly what I need but it's no longer in the app store and I can't find anything in any search engine for an app to do this.

Stephen Marsh
Community Expert
Community Expert
July 7, 2022