Pixel Art and Aspect Ratio

BQubed

Member
I feel like I'm abusing this forum with questions, but I assure you that I do look through tutorials and the manual before I do. I'm having a problem that makes absolutely no sense to me whatsoever and I have pictures to prove it:

aspect_ratio_glitch.png

Take a look at the player character in my game-in-progress, specifically the eyes. It looks as if I set the wrong aspect ratio, but it's set at 16:9 (640x360) and my monitor is also 16:9. The odd thing is that it seems that only SOME sprites in my game have this issue while others don't. Before, I had a small table that had one leg that looked as if it had a different pixel density than the other one.

Camera Properties, Viewport Properties AND Room Settings are all set to 640x360. Perhaps I set something wrong? I really thought this kind of simple problem was behind me, but the real stumper is that it's not ALL pixel art, it's some.
 

Khao

Member
Do any of the object have decimals in their X and Y values? If the player is at, say, x = 326.5, y = 180, some of those pixels will get screwed-up horizontally because the sprite can't properly be rendered at a position between pixels.

If that's the case, when drawing that object, try drawing it at a (floor(x), floor(y)) position.

If that's not it, I have no clue.
 

BQubed

Member
I don't have any draw events in these objects. That being said, I've tried using draw_self() to see if it was somehow related to that and still nothing. It's so strange. I thought it was related to animation but the inanimate table I drew (which looked perfect in Aseprite) became distorted in the room.

EDIT: Actually, now that I looks closer at the bookshelf, I'm noticing some distortion among the books as well. The bed too. The pillow line at the top is thinner than the other lines. So I guess it's everything. Still, I've scaled within 16:9 so I have no clue why this is happening.
 

ophelius

Member
Set your viewport to a multiple higher than your camera, so try a viewport of 1280x720, or 1920x1080. It'll give you more sub-pixel accuracy, and might help with these issues. In my game, when I experimented with setting my viewport to the same low-res as the camera, it immediately looked ugly.
 
Last edited:

BQubed

Member
I'll try it, thank you.

EDIT: It didn't work, but when I changed all values to 320x180, instead of 640x360, I noticed a marked improvement, though it's more zoomed in than I'd like. I'm going to play with more values and see what happens.
 
Last edited:

ophelius

Member
I'll try it, thank you.

EDIT: It didn't work, but when I changed all values to 320x180, instead of 640x360, I noticed a marked improvement, though it's more zoomed in than I'd like. I'm going to play with more values and see what happens.
It's unusual because all pixels should look the same if your viewport is an integer multiple of your camera. The objects you're describing that have different pixel densities, try using this code in the draw event(also suggested by Khao):

draw_sprite(sprite_index, image_index, round(x), round(y));
or your can use floor(), both give slightly different results:
draw_sprite(sprite_index, image_index, floor(x), floor(y));

As Khos suggested, and I'm also suggesting, is that maybe those objects have internal x and y positions that have decimals. You don't want to change their position by forcefully aligning their true positions because you want the true value to stay intact, but if you just draw them at an integer position, their x and y positions will remain intact but they will be drawn aligned to the pixel grid and no distortion will occur.
Maybe give that a try
 
Last edited:

BQubed

Member
You know what? I haven't tried it (I'm not on my dev computer) but I'm pretty sure that's what it is. I don't place things according to tile, I usually hold CTRL so I can place them very precisely. I didn't realize that could cause pixel issues when placed like that. Thank you both, I'll give it a shot when I can.

EDIT: Ok turns out I was able to try it sooner than I thought. The pixelation got worse in some areas and better in others. Damn, I was SURE that was it.
 
Last edited:

ophelius

Member
Placing an object in the room, even precisely with Ctrl, does place it at an integer location, so that shouldn't be the issue. But you are able to resize the object and rotate it, so if they accidentally were transformed by stretching them or rotating them a bit(easy to do accidentally), it might cause problems like you're describing by causing the x and y values to have decimals or the pixels themselves to look funny. The internal x and y positions might also be affected in code if you're moving them by non-integer values. But ya, check all these things, I'm sure you'll find it somewhere. The pixels can and should look perfect all the time, they do in my low-res game.
 

BQubed

Member
I can't tolerate even a single imperfect pixel. My eye immediately jumps to it and I can't focus on anything else. I'll check everything whatever all objects have in common and try to find a culprit. I'll share it here when I do so that others learn from my mistake.
 

Yal

šŸ§ *penguin noises*
GMC Elder
EDIT: It didn't work, but when I changed all values to 320x180, instead of 640x360, I noticed a marked improvement, though it's more zoomed in than I'd like. I'm going to play with more values and see what happens.
The easiest solution to fix both of these issues at once is to change the window size to 640x360, while keeping the viewport 320x180; this stretches the 320x180 app surface out over the new bigger window size with no interpolation whatsoever.
 

BQubed

Member
I believe I've solved the issue. I followed a tutorial by Pixelated Pope and disabled all viewports and made a camera object to govern viewports. I had to play around with some of the view_height/view_width numbers in order to get it to a level of zoom that I'm comfortable with. To be honest, I'm not entirely sure why some resolutions (even though they're 16:9) cause this issue, but at least it's solved now.
 
Top