How to fix blurry pixel sprites

Get help using Construct 2

Post » Tue Sep 27, 2011 7:45 pm

Hey all, (hopefully) a simple question here. The 16-bit sprite I'm using looks really blurry during run-time; according to one of Ashley's posts I found, this is because I put the hotspot in between two pixels, so it isn't rendering properly. However, I can't find a single place to put it that doesn't make it blurry! What am I doing wrong?
B
20
S
9
G
6
Posts: 607
Reputation: 6,112

Post » Tue Sep 27, 2011 7:57 pm

Have you tried enabling 'pixel rounding' in project properties? (new to r59)

If you set an object's position between two pixels (e.g. X = 2.5), most browsers display it with linear filtering, to make it actually look like it's half way between two pixels. However, for fine pixel art, that can make it look blurry. Pixel rounding always forces the draw position to be rounded to an integer which should fix the problem.

Setting an object between pixels is more common than you might think: all the behaviors do it. For a lot of games, it makes the motion look really nice and smooth, but it doesn't suit pixel games.
Scirra Founder
B
359
S
214
G
72
Posts: 22,948
Reputation: 178,532

Post » Tue Sep 27, 2011 8:11 pm

Yeah, but that doesn't seem to be working either... I'd post a .capx, but there's literally nothing in the project but this one single sprite.
B
20
S
9
G
6
Posts: 607
Reputation: 6,112

Post » Tue Sep 27, 2011 8:13 pm

I think you should, maybe you did something different! I have tested pixel sprites and they work just fine here, no blurring.
Scirra Founder
B
359
S
214
G
72
Posts: 22,948
Reputation: 178,532

Post » Tue Sep 27, 2011 8:21 pm

*sigh* Got it working. No idea how, but it's working.

Thanks for the responses and sorry for wasting your time, I guess!
B
20
S
9
G
6
Posts: 607
Reputation: 6,112

Post » Tue Sep 27, 2011 8:48 pm

Aaaand I changed the size of the sprite and it started being blurry again. Here's the cap:

http://db.tt/61FvHuSV

Complete with auto mirror issues. My first foray into C2 is off to a lovely start, as you can see.
B
20
S
9
G
6
Posts: 607
Reputation: 6,112

Post » Tue Sep 27, 2011 9:37 pm

Doesn't look at all blurry to me here. What browser are you using, and can you post a screenshot of it looking blurry?

To get auto-mirror working properly, center the origin. Edit the sprite, click the image points tool, and hit 5 on the num pad.
Scirra Founder
B
359
S
214
G
72
Posts: 22,948
Reputation: 178,532

Post » Tue Sep 27, 2011 9:45 pm

I'm using Firefox 6.0.2. Here's a screenshot of it in run-time, with an in-editor comparison. It's definitely not as blurry as the first time the problem happened, but it's still very noticeable.

http://dl.dropbox.com/u/19702035/C2help.png

And thanks, auto-mirror works fine now.
B
20
S
9
G
6
Posts: 607
Reputation: 6,112

Post » Tue Sep 27, 2011 10:01 pm

Doesn't look at all blurry for me in Firefox 7. I'm a little confused by your picture. The editor is zoomed in but the comparison to the sprite at runtime is the same size - it should be smaller if displayed at 100% scale. Are you doing some scaling at runtime...?
Scirra Founder
B
359
S
214
G
72
Posts: 22,948
Reputation: 178,532

Post » Tue Sep 27, 2011 10:12 pm

I zoomed in a little bit just so they'd be the same size, but it's still blurry at 100% scale. Here's another at 100%:

http://dl.dropbox.com/u/19702035/C2help2.png
B
20
S
9
G
6
Posts: 607
Reputation: 6,112

Next

Return to How do I....?

Who is online

Users browsing this forum: Yura G and 16 guests