The original post is edited beyond recognition

I'd like to to animate a low resolution sprites using a skeleton system. One requirement is to be able to rescale&rotate pixel art. Harder then expected as discussed in this thread

I started to implement a couple of algorithms to experiment. Here is a little tool that allows you to apply different upscaling, transformation and sampling algorithms to pixel art and compare their quality.



Download: PixelPunch004.rar

• For upscaling I implemented the non anti-aliasing algorithms mentioned in the wikipedia article: http://en.wikipedia.org/wiki/Pixel_art_scaling_algorithms
  My improved versions aim to solve some artifact-problems and are marked with the suffix HQ.
  
• For transformation I implemented a standared projective approach that resamples the image based on a homogeneous 3x3 matrix. The visual effect resembles a projection from one plane through a point on another plane.
  I also implemented a bilinear transformation that does not preserve lines and just fits the content of the source image into the target quadrilateral.
  
• Lastly sampling. The transformation yields a coordinate (with fractional part) in the source image for each pixel in the target. Based on that coordinate the sampling algorithms decide on a color to put there.
  
  Sampling methods do NOT preserve the palette:
  
  Smooth bilinear considers the 4 closest pixels assigns them weights (that sum up to 1) and and mixes a new color.
  
  Smooth bicubic works similarily but considers the closest 16 pixels. (Just google bicubic sampling)
  
  Sampling methods DO preserve the palette:
  
  Major bilinear works like smooth bilinear but instead of mixing 4 pixels it choses the one with the biggest weight.
  
  Second bilinear does the same but returns the pixel with the second biggest weight.
  
  Best fit narrow works like Smooth bicubic but instead of returning the calculated color it returns that out of the 4 cloest pixels that match this color best. (best aka least squares of the difference in R, G and B)
  
  Best fit wide does the same but returns the best fit out of the 16 closest pixels.
  
  Best fit Any does the same but returns the best fit out of ALL pixels. (So every color in the palette is considered as an option)
  
  Bilinear Mix is a little crazy. In the first pass it does the same thing as "major bilinear". Then it compares the result with "smooth bicubic" building a difference map. Pixels that are a local maxima in the difference map and where the difference exceeds a certain "Mix Threshold" are replaced with the result of Second bilinear in that location. However, the threshold required for the second best option to be chosen scales with the weight of that second best option.
  

Usage:

1. Drag a PixelArt image into the program.

2. Chose a Upscaling method.

3. Chose a Transform method. If transformation is enabled you can...

   a) Skew the image. Click & Drag edges and corners with your LEFT mouse button
   b) Rotate the image. Click & Drag somewhere with your RIGHT mouse button to rotate around that point.

4. Chose a Sampling method. This only takes effect if transformation is enabled.

Last but not least you can...
...adjust the size of the image to your screen with the Zoom slider.
...hold SPACE to compare the current Sampling-Type with the previous one.
...toggle Fullscreen by pressing the F key.
...save the image (as you currently see it) by pressing the S key.

Which combination do you think works best? What other approach could be promising?

Hi there!

I'm reading this forum for a while now and it motivated me to pickup work on a project that involves pixel graphics. But after having spend some time here I learned that pixel graphic is more then low-resolution images and in retrospective my take at "bringing it to a new level" now seems rather pretentious. Breaking the rules deliberately requires to know them. So while there are other reasons that make it worthwhile for me to continue working on the game I'd really like to hear some opinons of pixel pro's. What aesthetic impression does the game have on you? Are there elements you think are interesting or even beautiful? What details annoy you? (Annoyance like in seeing an advertising using "Comic Sans" ^^ )



You can play a prototype here. Click the swf to give it keyboard focus and run around using the cursor keys.

http://www.swfcabin.com/swf-files/1266178842.swf

I've also experimented with different post-processing approaches to accentuate the pixels. (You probably need a decent monitor to see the differences)



General feedback & tips for (visual) improvment are very welcome!