As an Amazon Associate I earn from qualifying purchases from

Procedural Era for Stylized and Optimized 2D Foliage

Word: This text was initially revealed on LinkedIn. For those who take pleasure in my article, please click on by means of and take into account sharing on social media and connecting with me!

Video games want detailed background artwork. Whereas typically not central to the gameplay, high quality and different background artwork is required for storytelling, immersion, visible enchantment, and normal polish. A scarcity of selection in background timber is noticeable in a sport. Creating a wide range of timber by hand takes a number of effort, and every variation wants bespoke work from an Artist.

Procedural Era can be utilized for this drawback by lowering the necessity for bespoke content material creation. As a developer, you typically received’t have full management over your Procedural era work. This makes it significantly effectively suited to such background content material – content material that’s vital however received’t break the sport if it isn’t solely good.

A programmatic method to foliage additionally permits for a selected look and elegance to be created by means of parameters, after which additional different barely utilizing these parameters.

LSystems For Foliage Era

No alt text provided for this image

LSystems have been used extensively for foliage era. The algorithm is of course suited to producing branching timber and crops. It permits for a level of randomization and allows you to management the aesthetics of what you generate by means of using parameters and guidelines.

Fundamental LSystems are simple. Branching, size, angle, and iteration rely covers this.

However What Can You Do To Generate Extra Aesthetic Paintings?

I cherished the aesthetic of Kate Compton’s work and modeled my very own after it, with the added standards that no matter I create should be appropriate for real-time simulation in Unity, so it could possibly be used as a instrument for artwork era for 2D Unity video games. Kate has shared her foliage PCG work in addition to guides for these beginning out with PCG –

I added the next parameters:


Department angles

Department width

Max department size

Max leaf size

Base color

Color variation


Leaf shapes

Leaf side ratio

Petal rely

Petal measurement

Petal form

Petal base color

Petal saturation

Department spikiness

Department taper

No alt text provided for this image

Including Visible Variance

What if you’d like extra selection for every generated tree, so there aren’t simply duplicates throughout?

Generate a forest by “altering it slightly”. Take the bottom mannequin, saved in a construction (DNA), after which change related parameters by just a bit to generated an analogous tree of the identical species. Repeat x10 or x100 and also you’ve received a forest that’s uniform however not stuffed with the identical cloned tree.

Past this, Kate additionally shares some normal rules for extra visible selection if you’re utilizing PCG strategies.

Listed below are some concepts she suggests for enhancing distribution, so every little thing you generate seems to be pure and has some variance.

1. Barnacling – Encompass massive objects with just a few smaller or perhaps even a number of tiny ones to offer it a extra pure look.

2. Footing – Make sure that every little thing you generate seems to be prefer it matches in with the world, principally by dealing with the place objects would work together (On this case the tree department and the bottom would overlap within the type of roots)

3. Greebling – Initially utilized by these working at Industrial Gentle & Magic for the particular results of Star Wars. Add small particulars to massive surfaces to make them seem extra advanced and attention-grabbing.

No alt text provided for this image

After including smaller, barely modified timber subsequent to every one:

No alt text provided for this image

So as to add to this, you may as well simulate development – Improve department size, leaf rely, flower rely, and at last iteration rely over time.


I went with the apparent method first – simply manipulating mesh place and rotation utilizing a sine wave. I apply this with a wind power variable relative to the space from the bottom of the tree – so principally, the foundation doesn’t transfer in any respect, and the treetops will transfer essentially the most. It seems to be adequate for a stylized 2D sport.

I later used Shader Graph to maneuver all of the animation to the GPU – manipulating vertex place utilizing shader code works simply as effectively and leads to a lot better efficiency.

Information Buildings – Plant DNA

Era is randomized however deterministic. For those who use the identical parameters, you’ll get the identical tree once more. In a manner, the construction of parameters is a tree’s DNA.

Generate a tree you want? Put it aside’s DNA. Load it later to re-use in your sport.

Taking this additional, you may cross-breed and evolve species utilizing Genetic Algorithms. The tree DNA is already outlined as a struct of floats.

Merely put, use a genetic algorithm to mix two halves of DNA collectively after which mutate them to create a brand new species. Then set it up so a designer can choose two timber they like and mix them collectively.

You may prolong this idea into gameplay – add some participant generated content material by permitting gamers to generate their very own crops, save them, evolve them, re-plant them, and so forth.

How Do You Optimize Mesh Era For Producing And Simulating Foliage In Actual-Time In Unity

Era is sluggish and does take a while. So long as the code isn’t unnecessarily advanced, you will get 300 timber in a few minute and perhaps add a loading display if it’s good to do that throughout gameplay.

However the generated timber must be optimized for efficiency as effectively. Background artwork is strictly that- background. You may’t have an excessive amount of CPU/GPU work and draw calls being taken up by background artwork – it’s wanted for foreground artwork, animations, shaders, lighting, AI, gameplay, and so forth.

The branches are particular person sprites and there aren’t that a lot of them.

The leaves are generated meshes, which have 4 vertices every. That is obligatory for the stylized look and selection. That is the place many of the rendering time is spent, in order that’s the place optimization must be targeted.

Right here’s how I dealt with optimization:

Shared supplies

Every leaf has the identical set of parameters and colors are decided throughout the shader based mostly on the pixel’s distance to the bottom. Which means a single occasion of a fabric will be shared by every leaf in a tree.

Optimized shaders

For starters, use Unity’s URP and related unlit URP shaders.

Shader-based wind animation

The GPU tends to be underused in comparison with the CPU, so it’s nearly at all times helpful to maneuver advanced computations to the GPU. On this case, it’s higher to simulate wind by means of making use of a sine perform to the mesh vertices (I like Shader Graph for this). The choice could be altering object positions and rotations utilizing C# code, which is able to nearly at all times carry out worse.

Mix meshes to scale back draw calls additional

I found a pair years in the past throughout a unique undertaking (VR Instructional Video games for the oil and gasoline business) that Unity’s Static and Dynamic batching are inefficient. I assumed that the variety of meshes in a scene wouldn’t matter, simply the triangle and vertex rely. It seems, you may often enhance efficiency by fairly a bit by combining meshes wherever potential, fairly than solely counting on batching.

I like the Easy Mesh Mix asset from the Unity Asset Retailer for this.

Earlier than combining meshes:

No alt text provided for this image

No alt text provided for this image

After combining meshes:

Draw Calls decreased to round 33%, Batches decreased to 0.5% of the preliminary rely.

No alt text provided for this image

CPU and GPU time nearly halved, which might loosely be translated to imply that efficiency and body fee will likely be 2x higher.

No alt text provided for this image

Mixed, unanimated

No alt text provided for this image

No alt text provided for this image

This nonetheless takes up an honest quantity of rendering time due to the variety of meshes used. Framerates are nonetheless okay, however could possibly be an issue if you happen to’re focusing on low-end {hardware} or want different costlier computation for graphics, AI, or gameplay.

Billboards For Efficiency – Perhaps Not In This Case?

If you will get away with out animations, you don’t want particular person meshes anymore. I needed to check out utilizing Render Texture to provide billboards fairly than rendering timber with lots of of leaf meshes.

Right here’s what my script does:

  1. Isolate timber to their very own layer and ensure the render to texture digital camera solely sees that layer (Culling masks).
  2. Heart the digital camera on the tree.
  3. Render what the digital camera sees to a texture.
  4. Apply this texture to a sprite.
  5. Disable the tree and exchange it with a single sprite.

That is sluggish although. Every tree must be rendered individually, one a body. Takes about 10 minutes for a 100 timber. The consequence reduces draw calls drastically and brings down body time.

No alt text provided for this image

No alt text provided for this image

This didn’t work as anticipated for me – draw calls, triangles, and vertices are decreased, however the precise body rendering time didn’t go down. So ultimately, combining meshes appeared to offer me higher efficiency.

Good Instrument Design

For this undertaking, my focus was on with the ability to iterate and prototype shortly, and never a lot on the standard or usability of the tip product. Nonetheless, I gave slightly little bit of thought to instrument design:

  • A single struct for plant DNA – I am reiterating, however this makes for good instrument design in addition to all parameters that have an effect on era are saved and accessible collectively.
  • Every parameter has fastened constraints each within the code and within the editor UI – Due to the distinctive traits every parameter is liable for, setting these constraints makes it simpler to iterate additional in addition to use the instrument. This ensures every little thing you’re producing nonetheless resembles the shapes you’re going for.
  • Unity UI sliders for every parameter, constrained in the identical manner.
  • UI for different features – I can choose crops by clicking on them, after which both exchange them, evolve them with the genetic algorithm button, or save and cargo them.

No alt text provided for this image

A really apparent subsequent step for good instrument design could be to make use of Unity Editor Scripting, maybe with the UI Toolkit, to make this UI accessible by means of the Unity editor fairly than by means of in-game UI.

Ultimate Ideas

For me, this undertaking was an honest and quick place to begin for entering into extra PCG content material. If you wish to discover out extra about PCG, I’d undoubtedly suggest trying out Kate’s weblog right here –

Efficiency optimization was key for ensuring what I’m producing can truly be utilized in an actual sport. I may be trying into 3D foliage era subsequent, so optimization and simply studying about essentially the most environment friendly methods to render 3D artwork in Unity will likely be important for that.

After this, I labored on a instrument for procedural narrative era. Hold an eye fixed out for an article about that one quickly!

We will be happy to hear your thoughts

Leave a reply

Enable registration in settings - general
Compare items
  • Total (0)
Shopping cart