Giter Club home page Giter Club logo

godot-cel-shader's Introduction

Godot 3.2 Cel Shader v2.0.0

By David Lipps aka Dave the Dev at EXPWorlds


Example Cel Shading Image

This is a demonstration project showcasing the included Cel Shader. All the assets were made by me, feel free to use them. Have fun!

Donate If this project helped you out, consider sending some coffee my way so I can stay locked in "the zone" and bring the Godot community more cool free stuff.

Companion YouTube Tutorial (for version 1.0.0): https://youtu.be/laastFVkTaA

New with v2.0.0:

  • Texture objects with base color and shade color textures.
  • Shadows can cast on objects in the shade color.
  • Applying light color and intensity works more like one would intuitively expect.
  • Outline shader included.

Cel Shader Parameter Discriptions:

  • Use Shade: Turns shading on or off. (not sure why, but you can)
  • Use Specular: Turns specular highlights on or off. Specular makes things look shiney or glossy.
  • Use Rim: Turns rim highlights on or off. Rim lighting highlights the edges of an object in direction of a light source.
  • Use Light: The light color and intensity multiplies with the Diffuse output.
  • Use Shadow: Shadows are cast on the object in the shade color. Shadow quality may depend on various settings (see Godot Documentation).
  • Base Color: The normal color of the material when there is no shade or highlights. Multiplies with the base texture color.
  • Shade Color: The color of the material when angle between the light and the surface nomal exceeds the shade threshold (aka the color on the object where there is no light). Multiplies with the shade texture color.
  • Specular Tint: The color that gets added to the base color where there is a specular highlight.
  • Rim Tint: The color that gets added to the base color where there is a rim highlight.
  • Shade Treshold: The value which represents the angle between the light and surface normal at which the transistion between base color and shade color occurs.
  • Shade Softness: A value which increases or decreases the gradiant amount at the transition between the base and shade colors.
  • Specular Glossiness: The power multiplier controlling the amount of specular highlight. (Higher values equal smaller highlights)
  • Specular Threshold: The specular value cutoff used as a base in the smoothstep function. (Best to keep at 0.5 and control specular size via the Glossiness)
  • Specular Softness: A value which increases or decreases the gradiant amount at the transition between the base and specular highlight tinted color.
  • Rim Threshold: A value which controls the threshold angle between the light source, camera angle, and the edge of an object. (aka the higher the value, the more the rim highlight will spread from the edge of the object)
  • Rim Spread: A value that deattenuates the spread of rim highlight around the edge of an object. (aka the higher the value, the more the rim highlight will spread around the edge of an object.)
  • Rim Softness: A value which increases or decreases the gradiant amount at the transition between the base and rim highlight tinted color.
  • Shadow Threshold: A value which controls the cutoff value for shadows. The higher the value, the more a shadow will cast.
  • Shadow Softness: A value which increases or decreases the gradiant amount at the transition between the base and shadow colors.
  • Base Texture: A texture which will be visible in areas of an object calculated to be lit by a light source. Multiplies with the Base Color.
  • Shade Texture: A texture which will be visible in areas of an object calculated to be shaded (in darkness or shadow). Multiplies with the Shade Color.

Outline Shader Parameter Discriptions:

  • Outline Thinkness: The thickness of the object's outline.
  • Outline Color: The unshaded color of the object's outline.

Additional Notes:

  • The outlines were made using the inverted hull method in Blender and/or the included outline shader.
  • To use the outline shader in combination with the cel shader, place it in the next pass after the cel shader.
  • It is probably best to use only one directional light, or things will start to look odd. If you need many lights in your scene, make sure cel shaded objects are only affected by one directional light by means of groups and visual layers.
  • A lot of the ideas behind the way this shader works was inspired by Junya C Motomura's 2015 GDC talk linked here and this article by RoyStan linked here.

I can be reached at: [email protected] I'd love to hear your thoughts. Especially about how I can improve. I'll do my best to get back to you.

godot-cel-shader's People

Contributors

davedadev avatar expworlds avatar mikaeljb avatar wtkooa avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

godot-cel-shader's Issues

Textures appear faded

When adding a texture it appears faded. I attempted to play around with the settings which unfortunately didn't help.

Spatial Material:
SpatialMaterial

Cel Shader:
CelShader

Feature Request: Normal Maps

First off I would just like to say your shader is great and works very well. Also, thanks for fixing the textures bug so fast.

I think two improvements that would make this even better are support for normal maps and multiple lights. Multiple lights seems like it is tricky though.

On to what this issue is about normal maps, it would be great to have support for normal maps. I have the charactor setup and they look great but my charactor does have a normal map for details. If I could utilize that as well it would be even better.

Thanks :)

At some points you can see through the 3d model with the shader.

For testing I applied the shader to this character from Genshin Impact. This meant that you could see the back of the mesh in some places. After adding the outline shader a few spots disappeared but a few didn't.

I used the Godot version 4 so maybe I made a mistake by modifying the shader for the new version even thought I don't think this is the case because I didn't changed much.

I am not good at shader programming so is there anyone, who can help me with this problem?
Down here is a image with the faulty spots marked in red:
Bildschirmfoto vom 2024-04-07 14-07-572

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.