Getting Rid of Ugly Pixel Art!

This forum is currently in read-only mode.
From the Asset Store
Vintage steam pixels for your UI! 125 unique assets in a single pack!
  • Hello, again, forum!

    I'm looking for a way to get rid of pixels breaking off of the grid without redrawing it in a thousand animation frames.

    The game Tower Climb, (that was made in Construct Classic, if I remember correctly) doesn't matter what happens, the pixels are always aligned. Even if you throw a projectile, the pixels will always be in a perfect grid.

    But, when I try this, the pixels seem to break out of the pixel grid and act like they aren't even a part of the game... I can see how this would work great for non-pixel games, but I just can't stand it. (end rant)

    I'm not sure how to add pictures to the forum, so I included some "zoomed in" images with a .cap to show the the effect I'm going for in a zip below.

    Honestly, this has bugged me since I first started using construct and any help will be appreciated!!

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • -Update-

    So, the creator of Tower Climb said to: "Set the sampling to point so the gpu doesn't interpolate the rotated textures. Then set the internal resolution to the size you want in the application properties bar, finally, add a window object and set the client size to multiples of the internal resolution."

    I know how to change the Sampling to point, but what does he mean about adding the window object?

  • -AnotherUpdate-

    Now it looks really fuzzy, but I feel like I'm getting close! I'm not sure if I followed the example I posted above. Here is a .cap where the pixels are in the right grid, but become distorted!!! Still looking for answers...

  • When you set application width and height to 600px everything works fine, pixels are not blurred, but when you use window object and set 600px of height and width of application that have 100px on width and height there is some linear filtering, so I think is bug in window object, because it don't read settings of your sampling method.

    Sorry, but I cannot help you.

  • What do you exactly mean by it becoming distorted? Checking your rotation example it looks like it very well should. If you make it rotate very slowly, you can see that it doesn't produce any colors in between black and white (unless you zoom it to a very small size), it might only seem so when it rotates fast.

    So yeah, this is pretty much what rotated lowres stuff looks like at point sampling. You can only rotate it in 90 degree increments if you want to keep every pixel of the image intact. Other angles will look fuzzy.

  • When you set application width and height to 600px everything works fine, pixels are not blurred, but when you use window object and set 600px of height and width of application that have 100px on width and height there is some linear filtering, so I think is bug in window object, because it don't read settings of your sampling method.

    Sorry, but I cannot help you.

    Thank you very much for taking a look either way. If I figure it out, I'll let you know!

  • What do you exactly mean by it becoming distorted? Checking your rotation example it looks like it very well should. If you make it rotate very slowly, you can see that it doesn't produce any colors in between black and white (unless you zoom it to a very small size), it might only seem so when it rotates fast.

    So yeah, this is pretty much what rotated lowres stuff looks like at point sampling. You can only rotate it in 90 degree increments if you want to keep every pixel of the image intact. Other angles will look fuzzy.

    Hmmm, I'm starting to wonder if it has something to do with my computer. When I turn off the rotate behavior on the black and white sprite, it still looks blurry. Almost like I haven't changed from Linear to Point. The pixels are going in the right place, it's just it looks so blurry. Even when static.

    If you know of any alternative way to achieve the look I posted in the OP, I'd be very grateful!

  • Well, I was looking on first example that you post and... damn. I'm little dost. Is somehow weird that Construct - even when you set "point" of sampling method - do some pixel filtering on small objects that will show much bigger in application, so If you wanna see animations contains changing angle of object - but not only - (like in gif with exploding... heads?) you must making them (those object) bigger? I'm confused, I think I'm don't understand something here.

    Here is my investigation result: i.imgur.com/jhm7MKA.png

    Application is 640x480px with window object changing application to 1280x480px. On left you see original guy (128x128px), nothing fancy here. In the middle you see 200% of guy rendered in Construct. On right is guy 200% (256x256px) - size is changed in photoshop with nearest neighbor algorithm (something like "don't blur or sharpen my pixels, just change size of them", something like "point" sampling method should do), but most funny thing is that changing sampling method in Construct - when window object change sizes of pixels - do... nothing.

    i.imgur.com/e8NVkDw.png

    I'm lost.

  • Well, I was looking on first example that you post and... damn. I'm little dost. Is somehow weird that Construct - even when you set "point" of sampling method - do some pixel filtering on small objects that will show much bigger in application, so If you wanna see animations contains changing angle of object - but not only - (like in gif with exploding... heads?) you must making them (those object) bigger? I'm confused, I think I'm don't understand something here.

    Here is my investigation result: Application is 640x480px with window object changing application to 1280x480px. On left you see original guy (128x128px), nothing fancy here. In the middle you see 200% of guy rendered in Construct. On right is guy 200% (256x256px) - size is changed in photoshop with nearest neighbor algorithm (something like "don't blur or sharpen my pixels, just change size of them", something like "point" sampling method should do), but most funny thing is that changing sampling method in Construct - when window object change sizes of pixels - do... nothing. I'm lost.

    Sorry for the late reply, man! I don't remember receiving a notification!

    I am still looking a way to solve this problem, unfortunately... My research has turned up a fix that someone came up with a few years ago. It doesn't seem to work on my computer, though. Something to do with newer graphics cards? If I could find the thread that I found the .cap from originally, I'd post that as well. Hopefully it works for you!

    Either way, the quest continues!!

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)