Easy Toon Style in Godot

let's talk about how to make your game look like a cartoon hi I'm Mike and today let's go over what it takes to give your game a cartoonish style there's actually a couple of distinct elements that we'll cover here before we hop into Godot where I'll show you a quick way to implement the shading side of things using the basic spatial material that is available to you within godotone so the two things that we need to think about when talking about a cartoon style are the character design and the lighting oftentimes cartoons have exaggerated proportions or large heads smaller bodies or move in ways that humans just physically can't and this is kind of something that's important to keep in mind for if you're trying to actually have a game that looks exactly like a cartoon you're going to need to factor in the character design in that way another thing we need to consider for cartoon Styles is lighting particularly how the Shadows work in most cartoons it's done by what is referred to as cell shading so it's a single line basically where the shadow hits that is a different color from the rest of the object where the light is occasionally you'll have another level of light on top of that that's showing more of a proximity to a light source that will change the color again but they are distinct clean lines whereas in a lot of the default rendering options for most of the game engines out there it's done in a physically based rendering style so it's trying to approximate how light behaves in real life so you'll find a lot more gradients and shallow falloffs between light and shadowed areas on your objects so if we have a tune shading but realistic character designs realistic being a sort of looser term here we got something that looks a lot more like the Borderlands Series where the humanoids are roughly realistically proportioned and there's the cell shaded style graphics on top so there's harsh shadows and not a whole lot of gradients between light and dark areas the inverse of that would be something like OverWatch where the characters are a little bit more exaggerated but the lighting system in OverWatch is more physically based rendering so it's a lot more gradients between light and dark areas on character models and then the final one where we have both the cartoonish Styles and cell shading I would be something like Wind Waker where link is very clearly has cartoon proportions and also has this sharp line between light and dark where the light is clearly divided from the Shadows so now that we have that basic knowledge in place for what you're trying to aim for and the different things you'll need to consider let me show you how to easily achieve a pretty decent effect of cell shading basically within the good old game engine using the default spatial material so here we are in Godot this is just the basic demo scene that I will be using to show off at the end there's the three bears that I've created prior to this that are already hooked up to these buttons so they will show in the demo but let me show you how to set up some basic cell shading using godot's default 3D spatial material here we have my bear friend model with the textures that I applied in blender just as a rough idea of what I was looking at and we'll add a surface material override again just the basic standard 3D spatial material and then let's scroll down and change the color and the option that we're looking for is right here under shading if we take a look at this we see we have these options here for how the material is going to interact with light that is hitting it and there is a tune Shader option so let's select that for the Shader now you can see here there's not really a whole lot of difference between the tune shading and the the default one that it started on and that's because at the moment the roughness is turned up all the way so that means that it's going to diffuse as much as possible and make the gradients between light and dark as it's smooth as possible so if we turn that down all the way we get a nice distinct line between the light and dark areas of our object so the next thing that we want to change is the specular of the material so if we go back up to the top where we chose the tune shading we can choose how it renders the specular which is the reflection of any light source and if we select tune we get these nice large blobs of color which because this is bear is a matte color my personal visual preference is that if it's a matte object that's not supposed to reflect any light I like like to turn this off and just disable the specular option now another thing that we can look at here is if we go down here to the rim effect we can give the bear some backlighting or some Rim lighting to make it pop out a bit more to make it so that we can see a little bit more of the details on the model in this case I don't particularly like the look for this object here especially in this lighting it doesn't work for me so much so I'm just going to leave that disabled but just know that that's an option for you if that is something that you're looking to achieve and then if we turn on the light here just add a light to the scene and move it around we can see how it affects the cell shaded material we can see that the light itself also has a sharp defined Edge as it travels around the bear [Music] now there are other tune Shader options out there there are several that you can find at godotshaders.com this one in particular is complete cell Shader for Godot 4 by ELD scald uh it was a bit more of an involved setup process and this is with the time I was able to invest into this video the best that I could make it look the color is interestingly the same hex value as the other materials but it looks very different in uh in this context and then as a final touch I've added a quad mesh here to added post-processing outline Shader just to give it that extra little bit of pizzazz for a cartoon look thank you [Music] foreign look using the default spatial material in Godot I was working in Godot 4 but the same steps do apply to Godot 3. the only difference being that you'd have to get a good O3 compatible outline Shader for that final step if that's the look that you're going for if you made it this far in the video and you've learned something hitting the like button is a great way to help get this video to a wider audience I have another video kind of going the other way talking about how to achieve a pixelated look very easily in Godot as well that you can find here and that's it for me for now so thank you so much for watching good luck with your projects and I will see you next time take care foreign [Music]

Channel: Watt Interactive

Views: 10,255

Keywords: cel shading, cel-shading, cel, toon, Godot 4.0

Id: rAU7nPclNtA

Length: 7min 38sec (458 seconds)

Published: Sun Apr 23 2023