Tiled sprite edge discrepencies when scrolling

rated by 0 users
This post has 2 Replies | 2 Followers

Top 50 Contributor
Posts 73
SunBurn_Community_Licensee
paul_blamire Posted: 09-01-2010 8:14 PM

Hello,

In an attempt to learn sunburn (and xna in general) better, I've been putting together simple scene made of tiled sprites that I can then scroll.

This has largely gone without issue. I have however noticed that some of the edges of the sprites are fuzzy/blurry when scrolling.

By nudging the sprites a long a miniscule amount at a time I could see that the actual pixels being rendered on the edges change slightly as the sprite was moved. e.g. sometimes a section of the sprite near the corner of the tile may be perfectly straight, while others it may have a pixel here and there standing out from the otherwise straight line. I should probably add at this point that the sprites being used are anti-aliased png images that use transparency.

All my googling would lead me to believe that this is probably due to the sprites not being aligned directly with pixels due to using floating point numbers for positioning/scaling etc, and texture sampling interpolating between pixels. Many people suggest clamping the position of sprites to integer values only to alleviate the issue. This feels very much like it would explain the effect I can see although I definitely haven't proved it (or would know how to). (Q1)

Now I'm aware that sunburn uses projection when working with the 2d system, so if I want to clamp to pixel values it's not quite that simple. From searching the forums I found the following quote:

"If you'd like to move sprites per pixel it's probably easiest to set the view-width to the screen width, then each unit moved corresponds to a pixel on the screen." - http://www.synapsegaming.com/forums/p/1194/6123.aspx#6123

This seemed like it would be worth a try. I adjusted the view width to 1280 and set the preferred back buffer width to the same. I then ensured that my tiled sprites were set with position and size values where the vector values represented pixels.

The scene rendered and I could see the layout of the tiles was as expected however each tile was now rendered using gray only. It looks like a silhouette.

The scene only uses one static ambient light, therefore the only parameter I could think of that might need changed would be the intensity of the light. So I tried values from the range 1 - 10000 (randomly of course) but with no luck. (Q2)

So I suppose my questions are:

Q1 Given the rather vague description above, is the pixel alignment explanation a likely one worth pursuing?

and

Q2 Does the gray silhouette effect sound familiar to anyone and do you have any suggestions for solving it?

If anyone has any suggestions that may point me in the right direction with either of these, then that would be greatly appreciated.

Kind regards,

Paul

Top 10 Contributor
Posts 4,546
Employee
SunBurn_Studio_Licensee

Hi Paul,

Because of the projection it's not possible to align sprites to the pixel center.  However this is generally unnoticeable when the scene contains lighting and shadows as they provide a lot of depth and contrast.

It sounds like the gray effect you're running into is fog, make sure to disable it in the SunBurn Editor (located in the Environment tab).

Let me know if this helps!

Follow me on Twitter – development and personal tweets
Awesome XNA Videos – Lighting, Rendering, and game videos

Top 50 Contributor
Posts 73
SunBurn_Community_Licensee

Hi John,

Thanks for the reply. You were quite right about the fog. I was using an unedited environment file from the 2d starter project and the large increase in view width was obviously pushing back the projection so that the fog was taking effect.

Re the first point, I'm just going to keep experimenting. Some of the platformer starter kit sprites have quite thick black lines around the actual content, probably to provide contrast.

The fact I was clearing the screen to white before rendering them, and then using uniform ambient lighting was probably showing the effect at it's most exaggerated. Plus there is just not enough going on on the screen to distract your eye from any artifact like that.

I think I'll just try to put a more complete scene together and still see if it is still noticeable. Just wanted to check I wasn't doing anything stoopid.

Thanks again for the help,

Paul

 

Page 1 of 1 (3 items) | RSS