1
\$\begingroup\$

I recently added many layers to my 2D game scene (multiple background sprites that scroll at different speeds via a parallaxing script) and it hurts my eyes to look at it. I have multiple layers of trees in different shades of green and as I move along I get a jagged movement as the trees overlap each other.

enter image description here

I tried fixing this by removing a layer of the trees, but it did not help. I also tried lowering my movement speed and, while it helped some, I cannot lower it any lower without making the movement painfully slow. I found the antiAliasing script on the unity Scripting API, but I am not sure where to put it, or if that is even what I need. Can anyone help? Have I made my question clear?

\$\endgroup\$
3
  • \$\begingroup\$ I made a gif and could not upload it because of size, so here is a link to it on giphy. The frame rate is kinda slow which works to our benefit since it magnifies the effect. You can also notice some screen tearing, so bonus points if anyone knows how to fix that. \$\endgroup\$
    – Sencored
    Commented May 31, 2017 at 1:53
  • \$\begingroup\$ @Sencored "Here"... where? \$\endgroup\$
    – Vaillancourt ♦
    Commented May 31, 2017 at 2:00
  • \$\begingroup\$ ummm... kinda forgot to paste the url... sorry guys... media.giphy.com/media/26FmPB6joYzYFFayk/giphy.gif there you are \$\endgroup\$
    – Sencored
    Commented May 31, 2017 at 2:05

2 Answers 2

Reset to default
5
\$\begingroup\$

The biggest problem is that your background has too much contrast and your player character has not enough. This is causing attention to be directed at the busy background and not at the player character.

There's an entire discipline - Visual Design - that deals with how to direct users' attention and make things look good. The principle of dominance and emphasis in particular gives you a bunch of tricks to focus the player's attention. Here's a few powerful examples:

  • Isolation: placing the subject among a plain background
  • Contrast: such as colour, brightness. A colourful and/or bright subject stands out among dull, darker surroundings
  • Placement: things placed at the centre gets more attention

See how Rembrandt uses these principles to attract the viewer's attention at the painting's subjects:

The Night Watch

There's one more principle which is applicable for games: motion. Things that are moving (or otherwise changing rapidly, like flashing/pulsing) are more attractive.

So back to your example, here are some practical changes you can make that are based on these principles:

  • Make your character brighter, and the background darker. The last layer of your background is bright green, which is very distracting. Make it a darker or duller colour. Your character ought to be bright, or at least have bright highlights and a strong silhouette.
  • Make your background scroll slower. Normally parallax layers are placed quite a bit further behind the main layer, so that they scroll noticeably slower and attract less attention. Non-gameplay layers that scroll as fast or faster than the gameplay layers should be used very judiciously.

Further reading:

\$\endgroup\$
1
  • \$\begingroup\$ While I believe that this answer is what all answers on any forum should strive to be, there are just a couple of slight problems. Nothing you did was wrong, but rather I have made some errors in my own art. For example, I was trying to make it look like you are deeper in the forest (hence the use of darker colors first and getting lighter as it goes out) so the use of the brightest green in the very back is supposed to suggest sunlight. Perhaps I could change the color? Any other suggestions would be greatly appreciated. Also, props for using Rembrandt for reference. It really helped. \$\endgroup\$
    – Sencored
    Commented May 31, 2017 at 3:54
0
\$\begingroup\$

The parallax effect looks nice, actually. I think the problem is the frame rate of the animation. The trees seems to "teleport" in a few frames, so animation is not that smooth (but it is not ugly, keep that in mind).

One thing you should try is make the trees contrast with your character, or vice-versa, so the colors of the background doesn't end up mixing with your character. Maybe put some shadows in the trees' sprites so they don't "interfere" with the green of your character.

Or maybe look up some kind of motion blur for the movement of the parallax, or the scene in general, I don't know. Since AA is used to make pixels edges look smoother, I don't think that this is what your design is missing.

Hope I helped in some way. Keep up the good work, you scene looks beautiful.

\$\endgroup\$
2
  • \$\begingroup\$ Thank you, I will keep at it. Also, I thought your answer helped, not only to boost morale, but contrast, like you and congusbongus said, is something I am working on now. I will post progress when I am done to show if it helped or not. I am using the female version of my sprite to have contrast. The original was called walkin' guy because I started with his walking animation, and the female is walkin' gal, and I will use her for the forest scene since she is pink and has a red bow. I hope the red and pink will draw attention to the character. \$\endgroup\$
    – Sencored
    Commented May 31, 2017 at 4:07
  • 2
    \$\begingroup\$ Update: I think a simple bit of contrast, as you and congusbongus said, was exactly what I needed. Here is the updated result. media.giphy.com/media/l0IyaEYYTKw6ivYru/giphy.gif \$\endgroup\$
    – Sencored
    Commented May 31, 2017 at 4:49

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .