NPR/Cartoon Style VFX and Other Noobish Queries

I’m a web designer turned middling motion graphics animator, and a complete VFX neophyte and who has very recently come across this amazing site in my efforts to become something vaguely recognizable in a dark alley as a pro if you squint hard enough.

Despite the abundance of amazing resources generously offered here and the internet abroad, I’m having a difficult time figuring out just where to begin, especially in regards to creating NPR (do people still even use this term?)/anime style effects for non-interactive animated production.

I work primarily in After Effects, but I’ve noticed a great majority of the VFX tutorials I’ve seen so far with really cool effects most relevant to my vision are created in Unity or related gaming engines, which I suppose is to be expected considering this site is called REALTIME VFX and not POSTPRO VFX, XD! Other times, they start off in After Effects, then export to formats more conducive to the aforementioned engines, but I’ve yet to see anyone making things in something like Unity, then exporting that work into After Effects. Can it be done? If so, is it a sort of workflow heresy?

I also find that a lot of them are feature a more “realistic” rendering style. Two highly inspirational precedents for the look I’m trying to achieve have been in the gaming world,… basically anything done by Arc System Works like the new Dragon Ball FighterZ and the latest Guilty Gear games. Where would be a good place to start towards achieving a 2-5 shading tone VFX aesthetic style like that using digital tools? Are these all hand drawn or some combination of hand drawn and digital generation? Any rules and best practices in “cartoonifying” real life reference that I might be able to spring forward from? By this I don’t mean giving real footage a cartoon look, but rather for the sake of argument, breaking down reference footage of a real smoke cloud into simplified motion using basic shapes explaining the art of creating a believable abstraction of reality.

Regarding hand drawn VFX, are the majority of people in the industry still using Flash as opposed to TVPaint, Toon Boom, or even Photoshop? It’s something that has been frowned upon in the world of web design for quite some time now, but I tend to see more than a few tutorials and pre-made VFX package offering solutions produced in that program.

Thanks in advance and many apologies if anything I’ve asked has been covered extensively in the past that I’ve irresponsibly failed to check out beforehand.

Welcome!

While it’s very doable to render out an effect from Unity to bring back into After Effects it veeeery rarely makes sense to do so. The reason for this is that all game engine tools are heavily optimized to run extremely fast and that comes with some quite agressive limitations. If the endproduct is a render for after effects it makes more sense to use an offline tool like Houdini, Maya or C4D as they will give you a lot more control over the effect.

As for the handdraw style, you are right in that it’s a mixture of handpainted sequences and digital trickery. This is probably why there are few tutorials about it as it lands in between disciplines. You’ll find better tutorials about creating those animations if you look at pure 2d animation channels and forums. At its most basic you simply animate a sequence, then play that back on a sprite in engine. So in that case it would be 95% work creating the animation and 5% getting it to run in engine. Now, there are more complex solutions as well that combines meshes and shaders with the handpainted assets. However, they have a lot in common with other realtime techniques, so when you get comfortable with those it won’t be a problem to apply them to any style.

1 Like

Thank you so much for warm, prompt, and informative reply, Partikel! Would you say that some of the tutorials regarding game engines are applicable to other programs like After Effects, in other words, do they generally share the same sort of DNA in the sense that there are analogous tools and effects that exist in both kind of programs but perhaps under a different name or something?

Part of the problem I’ve encountered is that most AE VFX tutorials I’ve seen seem to cater to either doing compositing tricks and effects for epic, broadcast/film quality title sequences and much less about effects that have a “game-ish” or cartoonish aesthetic. I suppose like most things, its a matter of extrapolating pieces of what you’ve learned from one technique and applying those principles to other, maybe less obvious executions, but it would be nice to have a place to begin, namely having fundamental education what different effects and tool do and how to mix n’ match them to achieve certain looks.

Not really. After Effects caters to a different market than game engines. Anything you do in After Effects will need to be rendered out and therefore its tools cater to that. For games, it’s all instant so they are quite different. However, if you learn how to make effects in Unity, you’ll be able to pick up Unreal and so on. After effects is generally not used much for cartoony game effects. I’d recommend checking out Adobe Animate for that sort of thing.

What you can use Animate for is to make sourcematerial that you send into a game engine as a starting point. If you want to get started with cartoonish effects, check out @Keyserito s channel: https://www.youtube.com/watch?v=8TfjhBeLDQc&list=PLQD_sA-R5qVLOZ2EIi4zqsD3WSnF4QwIy

After you’ve done that, and you have a good looking explosion animation or whatever, render it out and put the frames in an atlas.

Then, check this video out, and use your newly created texture instead of the one in the tutorial.

After that, you’ll have a good idea of what the different pieces of software does.

2 Likes

A great start! Thank you so much for your time and insight, Partikel!

There’s also a great GDC talk about the art style of Guilty Gear Xrd if you want to see some details about how they approached it there. I found it really fascinating, even if not immediately applicable.