How to merge paths into one object and save initial colors in Adobe Illustrator?

Question

I am creating a tree draw in Adobe Illustrator and I want to export this draw into Adobe After Effects and later create some animations on leaves and later export with Bodymovin library into the React project.

I have created everything and in the end, I had very bad performance cause of a lot of paths inside my draw. So I need to change this draw into less weight group of paths.

I want to merge those branches and leaves that would have been animate and I am getting a problem with merging groups into one shape in Illustrator.

When I want to Unite paths in Pathfinder my branch has getting the same color from leaves.

How to merge/flat group into one shape and save used colors? I have tried to rasterize layers but it generates me images .png and later looks terribly in the browser.

Answer 1

You can't.

Objects with different appearances need to be different objects. If you want the leaves to be a different color than the branch, you simply can't have one object in the strictest sense.

---

I'm not an After Effects user.. but maybe....

An exception to the above statement would be Symbols or Groups. While neither of these will "combine" the separate paths or shapes, they do create an object designed to be transformed as a single object.

I assume you understand Groups based upon your screenshot.

You might try a Symbol though. Drag the Group to the Symbols Panel to create a symbol of the artwork.

Again, I'm not an After Effects user, so I'm uncertain how After Effects will handle symbols. If it's similar to Illustrator, then it would be one object which is more "enclosed", or "isolated" - for lack of a better term, than a Group would be.