Custom Sprites for the Palette Editor

[Krazete]

I figured out a method to turn normal sprites into palettized sprites (sprites readable by the Palette Editor) a while ago, around the time Annie was announced. So now that I've got the process down, I'm opening submissions.

The Palette File Pipeline​

1. Choose a raw image (raw.png).
2. Using the raw image, create the linework layer (line.png).
   • Soft edges are allowed. If tracing, use the brush tool. If using selections, turn on anti-aliasing.
   • The script only reads the alpha channel here; it does not use any color information.
3. Using the raw image, create the base colors layer (base.png).
   • Hard edges are required. Use the pencil tool instead of the brush. For other tools, turn off anti-aliasing and feathering.
4. Using the base colors layer, create the color areas layer (area.png).
   • Hard edges are required.
   • Different items/materials/areas should be different colors.
   • If colors match in this color map, they will match forever. (E.g. if the hat and the skin are both colored #A1B2C3 in your area.png submission, then the hat will always be skin-colored in the Palette Editor no matter what.)
   • If you're picky about color IDs, encode them in the red channel. See this reply for more info.
5. Submit the layers (raw.png, line.png, base.png, and area.png) in a reply to this post.
   • I will input it into create_sprite.py and upload the result to the Palette Editor.

Alternatively, instead of raw.png and base.png, you may submit a highlights layer (highlight.png) and a shadows layer (shadow.png) .

Here are some sample PSD files of sprites I've converted: Google Drive Folder

Step 4 requires a bit of coordination since all sprites of a single character would need matching color areas and matching color IDs. For existing characters, you can reference the Palette Editor (click on a sprite and you'll see the corresponding color ID as a circled number in the sidebar).
5.2.0 update: Apparently, official color IDs can change. So I guess it's not important to stay consistent with them in your submissions.

See my replies below for example submissions.

 

[Krazete]

Character: Umbrella
Layers:

Color Areas/IDs:

Spoiler

10 hat top
11 hat brim
20 hair
30 face
31 blush
32 eye white
33 eye pupil
35 hand
36 leg
40 raincoat button
41 raincoat drawstring
42 raincoat drawstring cordlock
50 raincoat body
51 raincoat upper arm
52 raincoat lower arm
53 raincoat collar
60 boot top
61 boot bottom
80 hungern mouth
81 hungern teeth
90 hungern bone
91 hungern ligament
100 hungern body color 1
101 hungern body color 2
110 ice cream cone
111 ice cream bottom scoop
112 ice cream top scoop

 

[Krazete]

Character: Molly
Layers:

Color Areas/IDs:

Spoiler

10 hat top
11 hat bottom
12 hat circle
50 headset band
51 headset earpiece
52 headset mic arm
53 headset mic piece
54 headset mic
55 headset earpiece cover
70 face
71 neck
72 hands
73 glasses right
74 fingers
75 upper leg
76 lower leg
77 glasses left
80 neckerchief
81 collar
82 shoulder
83 arm
84 cuff
88 boobs
89 button
90 waist
91 hips
100 hair main
101 hair strand
102 hair back

 

[Krazete]

Edited from the recent twitter post and the GIFs from the steam announcement.
Character: Umbrella
Layers:

Additional Color Areas/IDs:

Spoiler

38 tongue
92 brim bones
160 hungern eye pupil
161 hungern eye vein
162 hungern eye white
55 raincoat lower body
56 raincoat trim
37 knee
62 boot top

 

[Filiawithpainwheel]

I have a question since I made a color pallette for umbrella and Molly. How can I submit my card?

 

[Krazete]

I have a question since I made a color pallette for umbrella and Molly. How can I submit my card?

Card? If you made a custom card, you can show it off on the SG Custom Fighters thread.

 

[Krazete]

Character: Annie
Layers:

Added Colormap IDs:
180 - Inside Sagan's Mouth

 

[Boonduck God]

what soft ware do I use

 

[Krazete]

i use photopea

 

[Krazete]

Character: Black Dahlia
Layers:

 

[Krazete]

Character: Black Dahlia
Layers:

 

[Krazete]

it's so much more difficult creating a palette sprite from a low-quality screenshot
Character: Black Dahlia
Layers:

 

[averii.X]

I did line art and shading for this sprite if you'd like to add it, I don't know if you'd like me to color it or not since I'm not necesarily familiar with how all the color ids work-

 

[averii.X]

I did line art and shading for this sprite if you'd like to add it, I don't know if you'd like me to color it or not since I'm not necesarily familiar with how all the color ids work-
View attachment 16853 View attachment 16852

also if anyone wants to just edit this in an art program, that's fine too

 

[Krazete]

I did line art and shading for this sprite if you'd like to add it, I don't know if you'd like me to color it or not since I'm not necesarily familiar with how all the color ids work-

Interesting submission. You're allowed to submit Highlights and Shadows instead of a single Base Colors layer, although my create_sprite.py script will process that differently. I wonder how it'll turn out.

However, a Color IDs layer is still necessary. I'll try to explain how to make it.

You need to use the Palette Editor as a reference. When you click an area on a sprite, the sidebar will show you the corresponding color ID (the circled number on the left).

In this example, the main hat part has a color ID of 2.

In your custom sprite, you have to match these color areas via the red channel.

So in your Color IDs layer, the main hat part should be colored something like (2,0,0) or (2,255,255) or (2,155,89) or (2,33,44). The main hat part must have R=2; G and B can be any number.

You'll need to do this for all color areas in your custom sprite.

Also remember to turn off feathering and antialiasing and any other source of blur. Color IDs require precise numbers, so hard/crisp edges are necessary.

 

[Krazete]

Update

• I cleaned up the diagram and instructions in the main post.
• Step 4 (making the color map) is a bit easier now.
  I scrapped the "match official color IDs please" rule since official IDs can apparently change.
  I also upgraded the script to handle color maps better. It no longer thinks #FFFFFF is the same as #FF0000.
  That means "encode IDs in the red channel" isn't a hard rule anymore. Just pick any different color.

 

[Phantasm11227788]

Can I get one based on Air Wulf or Three Wulf Moonsault plz?

 

[Phantasm11227788]

A Sprite I mean