Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Wondering how to accomplish a certain animation task? Ask here.

Moderators: Víctor Paredes, Belgarath, slowtiger

Post Reply
emillionreasons
Posts: 3
Joined: Sat May 08, 2021 4:00 am

Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by emillionreasons »

Hello, I've been searching around looking for answers to a problem I'm having and I can't seem to find a solution.

I recently started using Moho Debut 13.5 and I'm pretty new to animation. I'm having a hard time figuring out how to import a .PNG image with a transparent Background into Moho without it showing up with a black background instead of a transparent one. I created some "parts" for my character that I want to import.

I've tried exporting my images as .PNG files through both Photoshop and Affinity Photo (Just to make sure I've tried it all)

I know that I've successfully knocked out the background by making a selection and saved the PNG correctly to my computer. In my desktop preview, they show up with transparent backgrounds but for some reason when I import these same files into Moho, Moho displays them with black backgrounds instead.

To further test things, I've sent the .PNG files with the character parts to my boyfriend who has Moho 12 pro installed on his computer. He imported the files the same way I did

File > Import > Image

For some reason on his computer, the Images do show up correctly with the transparent background!
We both cant figure out why this won't work on my computer with Moho Debut 13.5

I purchased Moho Debut 13.5 and I have entered a serial number, So I'm wondering if this is a pro feature or if there is something I am missing here, it just doesn't add up.

If anyone can help that would be awesome :) Thanks
User avatar
synthsin75
Posts: 10253
Joined: Mon Jan 14, 2008 11:20 pm
Location: Oklahoma
Contact:

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by synthsin75 »

I checked on Debut 13.5, and I don't have any problem with transparency in pngs here. If you post an image you're trying to import, we can check it.

Also, you can try to import an image we know has proper transparency, like this forum's header image: http://www.lostmarble.com/forum/styles/ ... s/logo.png
If that works, then you're likely missing some export setting in your image editors.
emillionreasons
Posts: 3
Joined: Sat May 08, 2021 4:00 am

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by emillionreasons »

Thanks For Helping Wes!

I tested the Moho Logo from the forum you sent, and It worked. The image uploaded with the proper transparent background.

I'll send you one of the .PNG images I'm working with so you can test it, thanks for offering to do so.

I sent the same image files as the one ill be sending you to my boyfriend earlier, and these are the exact same files that were not working for me and showing up with black backgrounds, it just doesn't make sense that when he imported the same files, they were working for him and uploading correctly with transparent backgrounds.

I'm interested to see how it works for you, otherwise, It seems to be a problem on my end, maybe with moho or my computer, not sure.

Here is a google drive link to the PNG of an eyeball I was using.

https://drive.google.com/file/d/1mSiYZv ... sp=sharing

Thanks, again for all your help!

-Em
User avatar
Greenlaw
Posts: 10382
Joined: Mon Jun 19, 2006 5:45 pm
Location: Los Angeles
Contact:

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by Greenlaw »

Oh, this one is curious. If I import this image to Moho 13.5, it has a black BG, but if I import to 12.5, it has a transparent BG.

I haven't seen this problem with my own PNG images, so there must be something odd about the file. But obviously, 13.5 is also being more picky about this file than 12.5 is.

I'll let you know if I learn anything useful.
User avatar
Greenlaw
Posts: 10382
Joined: Mon Jun 19, 2006 5:45 pm
Location: Los Angeles
Contact:

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by Greenlaw »

Ok, I'm back with some more info:

I opened the file in XnView, a free image browser, and resaved the file. The re-saved copy imports properly to Moho 13.5 with a transparent BG. I suspect re-saving it from any problem might fix the problem.

This seems to mean there is something odd about the way the file was saved that Moho 13.5 is sensitive to. Are you seeing this problem with all your PNG files, or just this one?
User avatar
Greenlaw
Posts: 10382
Joined: Mon Jun 19, 2006 5:45 pm
Location: Los Angeles
Contact:

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by Greenlaw »

BTW, if you're using Photoshop, you might considering installing the following script:

https://github.com/hsw107/Photoshop-Exp ... Files-Fast

I use this to save out PNG layers from Photoshop, and it's great! After installing it, just select it from the Scripts menu, and a window will open with many useful options like:

Export Visible Only
Name Files
Top Groups As Layers
Trim Each Layer
Trim Combined
Padding
Scaling
Overwrite
Transparency
Keying

And more...

And as the name suggests, this script significantly faster than the native command in Photoshop.

I prefer using this script over importing a layered PSD file because PNG filess are easier to update, and a layered PSD can break in a Moho project depending on how you edit the files. For example, if you merge layers, this can change the Layer ID which Moho was referencing, and Moho will not know what to do. But if you re-run the script and allow it to overwrite the PNG files, and Moho will have no trouble finding and updating the new layers.

Things to be aware of:

I suggesting using Trim when exporting the PNGs. Unfortunately, this means the images will need to be placed manually. To help me with this, I like to save a copy of all the visible layers in a group and flatten this group, so I have a reference image to position the other layers over.

Alternatively, you can save without Trim, which will import the images 'in place' but they also come in with full canvas boundaries. You can use the Crop tool to drag out smaller boundaries pretty easily. The catch with this method is that the Crop tool is not compatible with Mesh Warping...but if you allow the mesh edges to crop the image instead, this might not be an issue. (That reminds me, I need to bump my request for an Auto-cropping button. It's silly to have to manually crop every layer with this tool.)

Personally, I'd go for the Trimmed export and manual positioning method. It's really not a huge deal to position the layers manually if you have the reference image in place.

Hope this helps.
Last edited by Greenlaw on Sun May 09, 2021 5:03 am, edited 2 times in total.
emillionreasons
Posts: 3
Joined: Sat May 08, 2021 4:00 am

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by emillionreasons »

Hey, Greenlaw

Thanks for hunting down that info for me!

Resaving seems to work! When considering your suggestion that something might be wrong with the saving process, I went back into Affinity to try to re-export and see if I missed anything again.

I selected export as a PNG & then I realized that in Affinity there are two settings under "Preset" when your in the export options.

One is called "PNG" and the other is called "PNG-8 Dithered"

I selected the latter option "PNG- 8 Dithered"
and then exported the image, it seemed to work this time!

Everything is now showing up transparent when the file is imported to Moho 13.5 so this seems to be the viable solution to this problem. Hopefully, that will be helpful for anyone having this issue going forward.

Thanks, You're For Help, that was a weird one indeed!

- Em
User avatar
synthsin75
Posts: 10253
Joined: Mon Jan 14, 2008 11:20 pm
Location: Oklahoma
Contact:

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by synthsin75 »

I've reported the issue. Hopefully Moho can get back to handling these as well as 12.5 did.
User avatar
Greenlaw
Posts: 10382
Joined: Mon Jun 19, 2006 5:45 pm
Location: Los Angeles
Contact:

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by Greenlaw »

8-bit dithered might make your image look grainy. I think this is reducing your color depth to 8-bits or 255 colors plus the transparent color.

What you want to look for is saving in 32-bits; this means saving 24-bit color plus the 8-bit alpha channel. In some programs, the option might simply be called Transparency.

I don't use Affinity, but I'm sure it should be able to do this.

if you have access to Photoshop, just check Transparency in the Export Preferences, and then when you choose Quick Export As PNG, it will save with the proper transparency. (Assuming there is not background layer blocking the transparency.) Or, use the Fast script I described earlier.

If you use Krita, there is a similar script that comes with the program. It's not nearly as robust as the Fast script for Photoshop but it does the job nicely.
User avatar
Greenlaw
Posts: 10382
Joined: Mon Jun 19, 2006 5:45 pm
Location: Los Angeles
Contact:

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by Greenlaw »

Oh, and if that's just how Affinity saves 32-bit PNG, then download XnView and use it to resave the files. XnView is available for Win, Mac and Linux platforms, and it's free (donations welcome.) XnView is my preferred image browser because it opens pretty much anything, and it also has some basic image editing and batch conversion features.
User avatar
SimplSam
Posts: 1218
Joined: Thu Mar 13, 2014 5:09 pm
Location: London, UK
Contact:

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by SimplSam »

On my primary Windows workstation the source file shows with black transparency in the thumbnail view of File Explorer, but not in the preview pane. On my craptop it's transparent in both views.

The source image is Affinity Photo 16-bit. When I converted it to Affinity Photo 8-bit -> Moho 13.5 is happy.

In Affinity - I also created a simple transparent square image with a colored rectangle inside, and again see the problem when the Image is 16-bit, but not when it is 8-bit. Converting either way (8->16, 16->8) creates or removes the issue for Moho 13.5.

In Photoshop - I also created a similar transparent image, and again see a similar Moho 13.5 transparency problem (grey background instead) when the Image is 16-bit, but not when it is 8-bit. Converting either way (8->16, 16->8) creates or removes the issue. Note: In PS File-Save as PNG to retain 16 bitness (not Export).
Last edited by SimplSam on Sun May 09, 2021 7:06 am, edited 1 time in total.
Moho 14.3 » Win 11 Pro 64GB » NVIDIA GTX 1080ti 11GB
Moho 14.3 » Mac mini 2012 8GB » macOS 10.15 Catalina
Tube: SimplSam


Sam
User avatar
synthsin75
Posts: 10253
Joined: Mon Jan 14, 2008 11:20 pm
Location: Oklahoma
Contact:

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by synthsin75 »

Yeah, I can confirm converting to 8-bit with Gimp solves the problem.
User avatar
Greenlaw
Posts: 10382
Joined: Mon Jun 19, 2006 5:45 pm
Location: Los Angeles
Contact:

Re: Please Help: Importing A .PNG With A Transparent Background - Keeps Showing Up With A Black Background Instead!

Post by Greenlaw »

Ah, I see...if the other option is 16-bit, then by '8-bit' they must mean 24-bit color. In other words, 8-bits per channel (RGB+A). (Ugh. Who came up with these 'standard' terms.) :)

So, ignore what I wrote earlier about 'grainy 256 color' output. It was the 'dithered' description that made me think this setting was 8-bit color (256 colors). (Like what you get with a GIF image.)

That said, if dithering is an option in Affinity, you probably don't want to use it unless you have very wide gradients in your image. Dithering in 24-bit color can fix banding problems, especially in blue sky images or deep underwater renderings, but it does this by adding noise to your image. At least, that's the common use for dithering in 24-bit color. You shouldn't need it for higher bit-depths but Moho does not support higher bit-depths. (Probably why Affinity's 16-bit option doesn't work properly in Moho. 16-bit is actually 48-bit color, but that doesn't account for an alpha channel.)

Which brings up a longtime wish list item: as a professional animation program, Moho really needs to start supporting higher color bit-depths. Please, guys? 😺
Post Reply