Hi there

I want to make 2D trees, I know I should skinning the branches to bones, but I don't know how to do it for leaves, I cannot skinning every leave to lots of bones, it will cost heavy performence, So, how to achive this effect and cost less performence, I hope every leave of my trees can move standalone instead of whole piece movement

Related Discussions
...

I doubt you really need every leaf to move on its own. If you do, you'd need a bone for each leaf. You can use a region attachment for each leaf, no need for meshes. That could make sense if the tree is the most important element on the screen, though many parts of a real tree move together naturally. Work from the movement you need and only make the skeleton as complex as necessary for that movement.

It's common that adding every possible detail doesn't fit within performance budgets. Look for ways to fake it! You can use bones to deform the whole tree, giving it movement without animating every leaf. Mix that with animating some of the leaves to get a convincing effect. A single image could have multiple leaves on it, possibly with blank space between them. Layer a number of those images to make a tree where many pieces can move, though not every individual leaf. You may be able to draw attention to one area of the tree, like a leaf falling off, which can allow the other parts of the tree to be simpler without looking bad.

Ever see the "trees" in Super Mario? They are highly stylized and simplified, but they work well.

Bild entfernt wegen fehlender Unterstützung für HTTPS. | Trotzdem zeigen

Bild entfernt wegen fehlender Unterstützung für HTTPS. | Trotzdem zeigen

Also instead of attempting to be realistic, the trees dance. If you look closely, they don't just dance randomly, they are synchronized to the music!

While Spine does a lot with skeletal animation, don't be afraid to mix in frame-by-frame animation. A tree can be a large element, so you may not have a lot of frames to work with or you may want to restrict frame-by-frame to an area smaller than the whole tree.

If your scene has multiple trees, at runtime you can pose a single tree and then draw it multiple times. This way you can have say 10 trees with unique poses, but draw 100 trees and user are unlikely to notice they are not all unique.

    Nate
    I wish leave moving different from others instead of whole leaves in the same area have same velocity and rotation, that looks bad.
    perhaps what should I ask is that how to make every leave show different transform when them move following the branch. Can I achieve the effect by shader ?
    For example, branches of willow have many leaves and I wish their transform are different frome each other.

    You can do a lot with shaders. It can be pretty difficult, but the effects can be amazing. For example:
    https://www.shadertoy.com/view/tdjyzz
    The author of that says in the comments it took about 2 months to make, and he links to some resources.

    For willow branches like you showed, you could try using a mesh for each branch and controlling multiple branches with a single bone. That can give behavior similar to using a path, but with less performance implications. It is shown in this tip:
    https://esotericsoftware.com/spine-tips#21-cake

    Bild entfernt wegen fehlender Unterstützung für HTTPS. | Trotzdem zeigen

    It will take a lot of experimentation to find a way to get the effect you want by faking it. If you stay focused on being able to individually animate every leaf, the only solution is a bone per leaf, which isn't reasonable unless the tree is extremely important. Trees are often background elements. Or maybe it is a desolate wasteland with a tree on it, so there aren't many leaves? 😄

      2 Monate später

      Nate sorry for the late reply
      there are many trees with lots of leaves, I'm looking for a mathod to achive the effect of tree && leaves like Ori

      • Misaki hat auf diesen Beitrag geantwortet.

        suanLoBeach This is a tutorial for a hair rig, not tree leaves, but I think this video may possibly be helpful: