Wintermute Engine Forum

Wintermute Engine => Technical forum => Topic started by: Indra Anagram on November 08, 2017, 06:23:41 AM

Title: Custom 2D actor sprites (replace Molly) and BMP transparency questions
Post by: Indra Anagram on November 08, 2017, 06:23:41 AM
Dear WME game developers,

My questions might seem stupid to you, but I'm still pretty new to Wintermute and game development, so your friendly help and patience is vitally important. There are different levels of understanding WME, and who knows, maybe this topic will help another beginner to understand WME better.

I'd like to ask about two things that both are related to replacing Molly with a custom 2D character. I'm in the beginning of making a 2D game with only horizontal (left and right) movement for actors. My current objective is to explore WME and create a working demo for an artist as my collaborator. For this demo I've got a single image of a female silhouette. I just resized it to fit Molly and replaced Molly's images in "walk" folder with my own images (see screen).

(https://image.ibb.co/jggSxb/00.png)

Questions:

1. How does WME deal with BMP transparency? I mean we've all seen Molly images against pink background (see screen).

(https://image.ibb.co/d5aFiG/00.png)

How does that pink background become transparent in WME? When I created my custom images to replace Molly files in "walk/rr" folder, I simply painted background with the same pink hue in Photoshop (tried another hue, yet it was not tranparent and there was colored rectangle around my actor in the game), changed Mode to Indexed colors with transparency and saved images as 8-bit BMP.
2. However, when I replaced 00.bmp in "talk" folder with my custom image, an issue appeared: the pink background of BMP is partially seen now (see screenshot).

(https://preview.ibb.co/bPNHxb/issue2.jpg) (https://ibb.co/fOZ83G)

There is no such issue as the actor "walks" (slides to the right in my case), but each time it stops, the pink background reappears. The female silhouette was sized and placed to fit Molly in the image. So what's the matter? You may wonder why I decided to replace 00.bmp in "talk" folder. The point is I needed an image for my actor standing still, and "stand.sprite" says:

Code: [Select]
IMAGE = "actors\molly\rr\talk\00.bmp"
I assumed to replace the image of Molly standing still I needed to change 00.bmp in "talk" folder. Am I right? And how do I remove that partially visible pink background?

THANK YOU for your attention and help!

Title: Re: Custom 2D actor sprites (replace Molly) and BMP transparency questions
Post by: Indra Anagram on November 09, 2017, 07:22:16 AM
Hey guys,

I solved the issue and answered both questions myself  :)

In case someone gets stuck with same questions:

1) When you open a sprite file (say, walk.sprite) in SpriteEdit, the pink hue is specified for transparency in its properties by default.

(https://image.ibb.co/cuL8Nb/issue2_sol1.jpg)

2) As you transfer an image to Indexed Colors mode in Photoshop, pay attention to Dithering effect value. In my case the mistake was in the effect value 75%. After I set it to 1%, the issue of pink image background partially visible was solved.

(https://image.ibb.co/jFXNhb/issue2_sol2.jpg)
 
Title: Re: Custom 2D actor sprites (replace Molly) and BMP transparency questions
Post by: Mnemonic on November 12, 2017, 09:58:43 AM
However, using color keys for transparency is a rather ancient technique. Since WME supports PNG images maybe you should rather use alpha channels.
Title: Re: Custom 2D actor sprites (replace Molly) and BMP transparency questions
Post by: Indra Anagram on November 12, 2017, 02:57:02 PM
However, using color keys for transparency is a rather ancient technique. Since WME supports PNG images maybe you should rather use alpha channels.

Hey Mnemonic! THANK YOU for Wintermute Engine! And for your reply!

I can create sprite images without any background as PNG with transparency... however, I don't quite understand what you mean by using alpha channels  ??? You mean in Photoshop or in WME? If in WME, how exactly do I use those channels?
Title: Re: Custom 2D actor sprites (replace Molly) and BMP transparency questions
Post by: Mnemonic on November 12, 2017, 03:05:47 PM
If you create PNGs with transparency in Photoshop, they will just work in WME. No need to do anything special.
Title: Re: Custom 2D actor sprites (replace Molly) and BMP transparency questions
Post by: Indra Anagram on November 12, 2017, 06:23:15 PM
Mnemonic, BIG THANKS!  ::thumbup