Hello Guest

Author Topic: Graphic anomalies at different resolutions  (Read 6068 times)

Majicpanda

  • 2D Toolkit
  • Jr. Member
  • *
  • Posts: 62
    • View Profile
Graphic anomalies at different resolutions
« on: June 12, 2013, 04:29:27 am »
I'm seeing what looks like a strip of black pixels across the very top of my images and odd lines here and there when doing animations as the spites flip in and out.

I've tried literally every combination of settings I can think of but nothing works universally.

What I have is 40x40 pixel art characters that load right into a tk2d sprite collection.  I have the target height set to 126, tried 128... same results but at different resolutions.  I've tried uncompressed, trim alpha on, off, reduced 16 bit... but no matter what settings I use depending on the device resolution I'm seeing extra lines drawn inside my sprite images.  The web build I have seems to look perfect if i export to 1024x768 but if I try something like 1280x720 all a sudden I get the lines.

This is really putting a kink in our plans for a pixel art game so any help is appreciated.  I created our previous game which had 100x100 images and had zero problems, so I don't know if it's because the target height is so small or what the problem is...

Edit: To confuse matters more I've removed all sprites from the scene so that there are none overlapping or anything else that might be causing issues.  The black line of pixels or odd vertical ones, etc appear based on a combination of res and position on screen.  Example is I can set up 4 characters with the same sprite on the screen with target size 128 and maybe only 2 will have the weird line of pixels, but if I move them all then all might have it or none.  If I then change the resolution of the build or build to my iOS device the same occurs... 1-4 may have the weird issue depending on screen position etc.

Edit edit: Adding manual padding of 1 to my character sprites seems to resolve the issue, any explination for that?

Edit edit edit: The artist didn't put 1px empty space around the sprites.... I'm going to assume this is best practice and is what caused the entire 4 hour headache.  Can you please confirm?  I'm going to have him move all the art away from the edges of the image if so.
« Last Edit: June 12, 2013, 06:10:46 am by Majicpanda »

unikronsoftware

  • Administrator
  • Hero Member
  • *****
  • Posts: 9709
    • View Profile
Re: Graphic anomalies at different resolutions
« Reply #1 on: June 12, 2013, 10:53:23 am »
If you take a point sampled sprite and then downsample it, you're gonna end up getting some weird sampling artefacts, as it can't blend pixels to smooth things out. First thing to do is to add one pixel of padding in the sprite collection editor.

Go into the sprite collection editor, settings, and then change Pad Amount from Default -> 1/2 pixels and commit. It should look a bit better, hopefully without the black lines now.

That still doesn't solve the problem that you're downsampling the image - you have to decide what you want here, if you want to downsample, then you'll have to live with the artefacts that remain - it might be perfectly fine, or else you can rescale your camera to be pixel perfect always.

Majicpanda

  • 2D Toolkit
  • Jr. Member
  • *
  • Posts: 62
    • View Profile
Re: Graphic anomalies at different resolutions
« Reply #2 on: June 12, 2013, 07:54:39 pm »
How am I downsampling the images?  The backgrounds are done in 192x108 for a nice 16:9 effect and all the characters are done in a 40x40 canvas which fits this "world" size of 192x108.  If I set the Character atlas to target size 108 and ortho size 10 and the backgrounds to the same, then everything comes out to scale exactly as the artist intended.  Am I doing something incorrect?

I think our art workflow is off....
Should all imported images always be a PoT texture?  Our world background is 192x108 for 16:9 and our little sprite guys are 40x40 because that's all the space we needed.  I  changes my target height to 80 and all the texture problems seem to have disappeared, but this doesn't seem like a logical workflow because an image being placed into tk2d sprite collection could be a number of completely different sizes like 20x10, 10x40, 100x100.. who knows, so I'm not understanding how you're supposed to create your art compared to the tk2d sprite collection settings.

Adding a 1px padding around everything "seems" to solve the issue, but I'd like to know how to actually do this correctly.. our last game never encountered this problem and I designed it with ortho size 1, target height 720 and all the images were 100x100.  Works on all resolutions with no padding etc so not sure what's different here.
« Last Edit: June 12, 2013, 10:19:10 pm by Majicpanda »

unikronsoftware

  • Administrator
  • Hero Member
  • *****
  • Posts: 9709
    • View Profile
Re: Graphic anomalies at different resolutions
« Reply #3 on: June 12, 2013, 10:48:44 pm »
Maybe I misunderstood what you meant.
If you're using an ortho camera, the sprites will be different pixel coverage at different resolutions, no? So is this meant to work perfectly at 1920x1080, i.e. 1 texel in your source image = 10 screen pixels?

Your art workflow is fine.
I think the above is the only thing to sort out. Theres not really a great deal to it.

If you create with an ortho size of 10, and target size 108 in the sprite collection,
Code: [Select]
what is the ortho size of your actual camera and what is the native resolution? The native resolution is the resolution the game is meant to look perfect in. Get it perfect in this one native res first and then the others just require some trivial changes..

Majicpanda

  • 2D Toolkit
  • Jr. Member
  • *
  • Posts: 62
    • View Profile
Re: Graphic anomalies at different resolutions
« Reply #4 on: June 13, 2013, 02:01:29 am »
I had my artist do 192x108 to have a nice 16:9 background size to work from, so knowing Unity I know physics works well at ortho 10, so the size on screen kind of just worked out automatically.  If we want the art to look smaller should we be making target height bigger or target ortho smaller?.. or actual ortho smaller (that would mess up a lot of things unless tk2d collections were modified exactly accordingly)

I suppose if we were to say... the native resolution is 192x108 to be pixel perfect.. so how do we adjust from there regarding Unity ortho size, target height and ortho target in tk2d?

FYI adding 1px padding on all images "seems" to have fixed the weird texture flashing issues.. but I wish I knew what I did wrong that's causing it, if anything. 

Edit: Looks like we raised the backgrounds to 224x126 which is a multiple of 16:9 and then made the characters 126 target height... this might cause problems?  Do we need to change to 256x144 as according to this?
http://pacoup.com/2011/06/12/list-of-true-169-resolutions/

Goal: Target 16:9 and design most everything to fit in 4:3 and let NGUI scale properly.. i didnt really think about targeting a specific resolution correctly.
« Last Edit: June 13, 2013, 02:30:06 am by Majicpanda »

unikronsoftware

  • Administrator
  • Hero Member
  • *****
  • Posts: 9709
    • View Profile
Re: Graphic anomalies at different resolutions
« Reply #5 on: June 13, 2013, 10:16:43 am »
The thing is, you should target one resolution specifically and make it perfect on there. Adjusting for other resolutions is trivial, but it should be perfect somewhere first, otherwise you're more or less working blind. Not that its a real issue, but you can introduce unintended scaling - adding that 1 pixel padding generally hides most of that. Adding one pixel padding to 224x126 isn't exactly going to make your atlases much bigger, so that certainly remains a viable option.

I don't know how NGUI does scaling, so I can't really comment on that part of your workflow.