Page 1 of 1

Rotating Pixel Art

Posted: Fri Jul 29, 2022 11:16 pm
by jumptrigger
I'm making a shooter game and I have really small sprite 9x9, the problem is when I rotate them it gets distorted.
How exactly do I fix this?

Image

Re: Rotating Pixel Art

Posted: Fri Jul 29, 2022 11:40 pm
by pgimeno
Thrust II had 32 hand-drawn ship rotations precisely for this reason (actually, only 4; the rest were reflections and 90 degree rotations). Try drawing it by hand.

Re: Rotating Pixel Art

Posted: Sat Jul 30, 2022 12:04 am
by jumptrigger
Thanks for the help. Is this really the only way what if I want to make lots of ships?

Re: Rotating Pixel Art

Posted: Sat Jul 30, 2022 3:02 am
by darkfrei
You can make your own rotating algorithm and keep the symmetry.

By the target sprite, starting by diagonal and going to one of the edge tile:
1. Take the middle of that tile, do rotating about sprite center and ask the color of tile by the source sprite.
1a. Take another 4 points in this tile and and the colors after rotation by the source sprite.
1b. Make the sprites with 1, 2, 3, 4 and 5 used taked points. You cannot be sure which is better until the choose the better solution. This step is for contrast edge on some level.
After all, make the symmetry.

Re: Rotating Pixel Art

Posted: Sat Jul 30, 2022 4:55 pm
by jumptrigger
So?
1. rotate by center of sprite
1a. find what color was at the 4 points when not rotated, but which 4 points?
1b. not sure what you mean

Re: Rotating Pixel Art

Posted: Sat Jul 30, 2022 5:19 pm
by darkfrei
jumptrigger wrote: Sat Jul 30, 2022 4:55 pm So?
1. rotate by center of sprite
1a. find what color was at the 4 points when not rotated, but which 4 points?
1b. not sure what you mean
1a. For example if tile is a square 1 by 1 with the center in the (0.5, 0.5), then take the points (a, b , c , d, e), where

Code: Select all

pointA = {0.5, 0.5} -- center
-- (yet not rotated, in target tiles coordinate system)
pointB = {0.5+0.5*math.cos(math.pi/4), 0.5+0.5*math.sin(math.pi/4)}
pointC = {0.5+0.5*math.cos(math.pi/4+math.pi/2), 0.5+0.5*math.sin(math.pi/4+math.pi/2)}
pointD = {0.5+0.5*math.cos(math.pi/4+2*math.pi/2), 0.5+0.5*math.sin(math.pi/4+2*math.pi/2)}
pointE = {0.5+0.5*math.cos(math.pi/4+3*math.pi/2), 0.5+0.5*math.sin(math.pi/4+3*math.pi/2)}
1b. Just save all images where amount of points are true (black on white or white on black) are same-or-more: 1, 2, 3, 4, 5 and choose the best one by yourself.

Re: Rotating Pixel Art

Posted: Sat Jul 30, 2022 7:37 pm
by jumptrigger
I just decided to scale the image and it looks better