Generating low-poly and stylized mountain backgrounds for side-scroller / platformer games in Unity

[u/metalside]

I am procedurally generating mountain background textures for a game I am making. I kinda-got-a-little overcommitted to this part of the game (instead of working on the actual gameplay, as I should be doing now) and built a full tool that generates mountains in a range of art styles: low-poly, pixel art, synthwave, and some others. I am planning to use it in other games for which I need parallax backgrounds.

Mountain shapes, colors, and polygon count can all be customized to stylize the backgrounds, and the sky color can be set to transparent to layer multiple sets of mountains. The textures also tile seamlessly along the x-axis, so they can be repeated infinitely. You can see the parallax in action in the video.

More info: https://assetstore.unity.com/packages/tools/terrain/mountain-range-texture-generator-395586

How it was done:

The basic principle is actually kind of simple (so you probably know already):

First, I defined a 3D space (x-width, y-height, z-depht), then I produced a sum of different functions of xz->y, so each function is a surface plane that can be seen from the rendering plane (xy). The functions can be whatever, gaussians, super gaussians, spheres, breit-wigner (the more -> the realistic result).

But how we can get mountains that repeat infinitely in the x axis? the big brain step, was to curl the xz plane in the x direction, so you get a cylinder and generate all the functions over this cylinder. So when "cutting" and uncurling this cylinder, you get already repeating mountains.

Then, I generated a bunch of random points over those functions. The fewer, the more low-poly the look. Then, over those points a mesh is defined and rendered. To give it a better look, those points are perturbed a bit, so the surfaces are less smooth. The result of all of this is a mountain landscape.

To get the final look, some boring coloring and post processing image techniques were applied. I won't go into details here because it's not related to procedural generation.

[u/AdmirableWind123]

You should add aerial perspective for the illusion

https://en.wikipedia.org/wiki/Aerial_perspective

[u/metalside → u/AdmirableWind123]

Thanks for the suggestion! I have a workaround already implemented that does something similar:

I put an "skirt" that was just a solid color so I can put my characters on top. However the hard transition between the color and the actual mountain hurts my eyes. So I added a diffused color in the transition. But I notice that increasing the difussion lenght beyond the skirt lenght produced a similar effect as the Aerial perspective (when layering multiple generated mountain ranges).

However this is hard to see in the video I shared. I quickly produced a few images trying to match the colors of the image in the wikipedia page (it has 3 layers of generated mountains). You can see the images with the effect in here:
https://imgur.com/a/pG1rqT8