Tiled palette quantization tool
Moderator: Moderators
Forum rules
- For making cartridges of your Super NES games, see Reproduction.
Tiled palette quantization tool
I made a new tool that converts images to 8 palettes with 4bpp. You can try it out here: https://rilden.github.io/tiledpalettequant/. For snes select 16 colors per palette, and shared color zero. Drag an image over the webpage and press Quantize. You can click on the generated images to save them.
Re: Tiled palette quantization tool
I recall you posted some sample output images to the Discord server. I imagine that if you post them here, other readers of this forum may have a better idea of what the tool is for.
Re: Tiled palette quantization tool
Here are some generated images:
What is this tool used for?
These are all 8 palette, 4bpp images, not 8bpp.What is this tool used for?
- If the image looks good at 4bpp then you can use it instead of an 8bpp version, saving vram and cartridge space.
- You can convert an image to 4bpp or 2bpp and use it as a background layer.
- If a tileset has too many colors, you can convert it to fit the snes's restrictions.
- You can also convert sprites if you arrange them on a 16x16 grid.
- Give it an image and use the generated palette for your own art, the palette colors are sorted by similarity.
Last edited by Rilden on Sun Sep 04, 2022 3:54 pm, edited 1 time in total.
Re: Tiled palette quantization tool
Daamnn, I couldn't even notice at first that the plushies photo is already converted.
Really good
Really good
Re: Tiled palette quantization tool
Great job so far. Adding a small amount of ordered dither could help reduce banding even further.
Do you plan to add a license to the source code repository?
Do you plan to add a license to the source code repository?
Re: Tiled palette quantization tool
I added a license, but the js files found there are generated by the typescript compiler. I will refactor the source code and will publish it in a new repository.
Re: Tiled palette quantization tool
Sorry.. not specifically SNES images, but I did use it on some difficult PCE images (16 colors, 16 palettes, shared color, 3bit RGB elements):
http://www.turboxraypce.org/projects/co ... of98_1.png
http://www.turboxraypce.org/projects/co ... of98_2.png
http://www.turboxraypce.org/projects/co ... of98_3.png
http://www.turboxraypce.org/projects/co ... of98_4.png
http://www.turboxraypce.org/projects/co ... of98_5.png
http://www.turboxraypce.org/projects/co ... of98_6.png
http://www.turboxraypce.org/projects/co ... of98_7.png
Amazing job! I need to update me conversion/pre-prepping app for SNES 15bit RGB range and try this out!
http://www.turboxraypce.org/projects/co ... of98_1.png
http://www.turboxraypce.org/projects/co ... of98_2.png
http://www.turboxraypce.org/projects/co ... of98_3.png
http://www.turboxraypce.org/projects/co ... of98_4.png
http://www.turboxraypce.org/projects/co ... of98_5.png
http://www.turboxraypce.org/projects/co ... of98_6.png
http://www.turboxraypce.org/projects/co ... of98_7.png
Amazing job! I need to update me conversion/pre-prepping app for SNES 15bit RGB range and try this out!
Last edited by turboxray on Mon Sep 05, 2022 5:13 pm, edited 1 time in total.
- TmEE
- Posts: 960
- Joined: Wed Feb 13, 2008 9:10 am
- Location: Norway (50 and 60Hz compatible :P)
- Contact:
Re: Tiled palette quantization tool
These results are really good, only minor manual work needed to make them perfect afterwards ~
Very awesome !
Very awesome !
Re: Tiled palette quantization tool
Okay I prepped a snes image:
http://www.turboxraypce.org/projects/co ... c_5rgb.png
I have it set to 8x4 tiles, but that just means you need two 32x32 tilemaps (with hDMA) for a 8x4 palette association.
http://www.turboxraypce.org/projects/co ... c_5rgb.png
I have it set to 8x4 tiles, but that just means you need two 32x32 tilemaps (with hDMA) for a 8x4 palette association.
Re: Tiled palette quantization tool
Very useful tool that can be used for many systems ! I linked it in the SGDK readme if you don't mind
It would be awesome to have a dithering option, 2x2 mesh at least (larger grid ordered could be useful too but error diffusion not so much as it would eat VRAM quickly). What is the pixel fraction parameter ?
It would be awesome to have a dithering option, 2x2 mesh at least (larger grid ordered could be useful too but error diffusion not so much as it would eat VRAM quickly). What is the pixel fraction parameter ?
Re: Tiled palette quantization tool
Thank you for linking my tool, I appreciate it.
Pixel fraction controls how many pixels are processed per step. With a smaller number the conversion is faster, but the result has a lower quality.
Pixel fraction controls how many pixels are processed per step. With a smaller number the conversion is faster, but the result has a lower quality.
Last edited by Rilden on Tue Sep 06, 2022 7:21 am, edited 1 time in total.
Re: Tiled palette quantization tool
Ok, thanks for the information !
Re: Tiled palette quantization tool
It's nice, what kind of algorithm are you using?
And I don't want to sound overly critical of it, (I guess I cant do better myself, image quantization is hard to do in itself and juggling with multiple palettes makes it worse)... but I don't like the jpeg-like square artifacts it produces. Also sometimes it chooses slightly different shades for different palettes which somehow looks odd.
I think the palettes it chooses aren't really optimal, e.g. with the carina nebula image, i'd expect for example that there would be one palette with lots of yellow, one with lots of blue, and one half blue / half yellow for the features around the edge.
I've investigated a little into quantization algorithms and there's one I like called "neuquant", unfortunately its original website seems to be lost but there's a js implementation on github. Here's your test image quantized into 16 bit color with that one.
Even though it only uses one palette I think it still looks better...
Maybe if you could do something like force it in neighbouring cells, or overall, to use a few shared palette entries, that would improve the result.
Or try changing the underlying quantization algo itself (don't know how well it can be separated from the palette switching part)
Also when I make more detailed / big pixel art for SNES, i sometimes use multiple layers stacked on top of each other, this would work pretty well with your image, for example, have the yellow part on one layer and the blue one on another. This would be a great additional feature, to automate this would require the algo to somehow detect large scale features though.
And I don't want to sound overly critical of it, (I guess I cant do better myself, image quantization is hard to do in itself and juggling with multiple palettes makes it worse)... but I don't like the jpeg-like square artifacts it produces. Also sometimes it chooses slightly different shades for different palettes which somehow looks odd.
I think the palettes it chooses aren't really optimal, e.g. with the carina nebula image, i'd expect for example that there would be one palette with lots of yellow, one with lots of blue, and one half blue / half yellow for the features around the edge.
I've investigated a little into quantization algorithms and there's one I like called "neuquant", unfortunately its original website seems to be lost but there's a js implementation on github. Here's your test image quantized into 16 bit color with that one.
Even though it only uses one palette I think it still looks better...
Maybe if you could do something like force it in neighbouring cells, or overall, to use a few shared palette entries, that would improve the result.
Or try changing the underlying quantization algo itself (don't know how well it can be separated from the palette switching part)
Also when I make more detailed / big pixel art for SNES, i sometimes use multiple layers stacked on top of each other, this would work pretty well with your image, for example, have the yellow part on one layer and the blue one on another. This would be a great additional feature, to automate this would require the algo to somehow detect large scale features though.
Re: Tiled palette quantization tool
Can you post my tool's output image you used for comparison? How many palettes and colors per palette did you use? I want to look into this.
Last edited by Rilden on Tue Sep 06, 2022 7:24 pm, edited 1 time in total.
Re: Tiled palette quantization tool
I take it you have no experience in this kind of stuff. It's not trivial in the least. I've written my own, refined it over the years, and I gave up on trying to make it "perfect". The best it does is get really close, and then lets the artist finish it off with manual touch ups. This is bar far THEE most impressive attempt I've seen yet - maybe only matched by Nitro Character Studio for GBA development that does this (and good luck finding that official app from Nintendo). If you want to use two layers, simply write your own app that splits ALL colors in tiles by half (regardless of the amount), and running the "upper" and "lower" through this app. If you want to look at how the app is running, just look at the repo. All the source is right there.none wrote: ↑Tue Sep 06, 2022 6:30 pm It's nice, what kind of algorithm are you using?
And I don't want to sound overly critical of it, (I guess I cant do better myself, image quantization is hard to do in itself and juggling with multiple palettes makes it worse)... but I don't like the jpeg-like square artifacts it produces. Also sometimes it chooses slightly different shades for different palettes which somehow looks odd.
I think the palettes it chooses aren't really optimal, e.g. with the carina nebula image, i'd expect for example that there would be one palette with lots of yellow, one with lots of blue, and one half blue / half yellow for the features around the edge.
I've investigated a little into quantization algorithms and there's one I like called "neuquant", unfortunately its original website seems to be lost but there's a js implementation on github. Here's your test image quantized into 16 bit color with that one.
carina-nebula-nq8.png
Even though it only uses one palette I think it still looks better...
Maybe if you could do something like force it in neighbouring cells, or overall, to use a few shared palette entries, that would improve the result.
Or try changing the underlying quantization algo itself (don't know how well it can be separated from the palette switching part)
Also when I make more detailed / big pixel art for SNES, i sometimes use multiple layers stacked on top of each other, this would work pretty well with your image, for example, have the yellow part on one layer and the blue one on another. This would be a great additional feature, to automate this would require the algo to somehow detect large scale features though.