Godot Documentation: Advanced Post-Processing

in #utopian-io5 years ago




This recent addition adds a description of some advanced features that can be used to make post-processing effects in Godot. Particularly, it has three sections:

  • Post-processing with a Quad
  • Reading from the depth map in a shader
  • An optimization for post-processing

The first section explains a way to do post-processing in the 3D renderer without using a viewport (a previous contribution of mine explained how to do post-processing with a viewport, which is much more limited). It uses a full-screen Quad that is always rendered in front of the camera. In order to do so it uses a shader trick that ensures that the quad will always stay on top of the screen.

shader_type spatial;
render_mode skip_vertex_transform, unshaded;

void vertex() {
    PROJECTION_MATRIX = mat4(1.0);

The above code defines a spatial shader in Godot that outputs the vertex positions exactly as specified in the 3D model. Therefore, the quad is not affected by the camera position or anything else, it always snaps to the front of the screen!

The second part of the doc shows the user how to read from the depth buffer in the post-processing pass. This section explains how to read from the depth buffer (the second benefit to using a full screen quad) , how to convert the depth value into linear distance, and how to transform that distance into world position. This allows users to write a post-processing shader that takes into account the world position of objects that it is shading, this is very useful for many effects.

The last second describes an optimization that is useful when the post-processing shader is particularly computation heavy. If you are familiar with computer graphics techniques you will often hear that it is better to use a full screen triangle rather than a full screen quad (which is two triangles). This is because the GPU dispatches wavefronts in rectangular blocks, and since rectangles dont fit neatly into a triangle they extend off the edge. This happens with both triangles so you get some amount of overlap in the middle of the screen where fragments are rendered twice. The way to solve this problem is to use one large triangle that covers the entire screen. The GPU handles throwing away all fragments outside the screen, and you get no overlap! I explain how to set up such a triangle, it is not a huge step once you have the quad set up, it even uses the same shader.


This documentation is aimed at teaching the user about advanced features of the engine. The focus is on shading techniques that can be used for post-processing. But there is also some information about working with ArrayMeshes and PrimitiveMeshes.

This type of documentation is important because it helps users who are already familiar with the basics take things a step further. User's often ask questions about doing things like this, but the question is typically framed "is it possible to do X" rather than "how do I do X". I think the reason for this is that the documentation really only talks about basic features. We do an excellent job walking the user through the steps of setting up a basic game, but we don't do as well showing them exactly how much can be done.


Between now and my last post I have been busy working on many smaller changes to the docs and to the engine itself. As a bonus I included several of the small PR's that I have made i the last week.


At the time of posting the website has not updated to show the tutorial, but it will soon

GitHub Proof of Authorship


Hello @clayjohn,

It is great to see another contribution by you.

As always the work done by you for the project is awesome and that's why this contribution has been staff picked by me for the category.

The code examples quoted in the documentation seems very useful.

I am looking forward to the next contribution from you.


Your contribution has been evaluated according to Utopian policies and guidelines, as well as a predefined set of questions pertaining to the category.

To view those questions and the relevant answers related to your post, click here.

Need help? Write a ticket on https://support.utopian.io/.
Chat with us on Discord.

Thank you for your review, @ms10398! Keep up the good work!

Hey, @clayjohn!

Thanks for contributing on Utopian.
Congratulations! Your contribution was Staff Picked to receive a maximum vote for the documentation category on Utopian for being of significant value to the project and the open source community.

We’re already looking forward to your next contribution!

Get higher incentives and support Utopian.io!
Simply set @utopian.pay as a 5% (or higher) payout beneficiary on your contribution post (via SteemPlus or Steeditor).

Want to chat? Join us on Discord https://discord.gg/h52nFrV.

Vote for Utopian Witness!

Hi @clayjohn!

Your post was upvoted by @steem-ua, new Steem dApp, using UserAuthority for algorithmic post curation!
Your post is eligible for our upvote, thanks to our collaboration with @utopian-io!
Feel free to join our @steem-ua Discord server

Thank you for sharing you game development post with us! You have received an upvote! Please visit our page @steemgg to learn more about how you can use our platform Steemgg, the first html5 gaming platform built on the Steem Blockchain to get more out of game development.
Vote for bobdos Witness

@clayjohn, sorry to see you have less Steem Power.
Your level lowered and you are now a Red Fish!

Do not miss the last post from @steemitboard:

Christmas Challenge - Send a gift to to your friends

Support SteemitBoard's project! Vote for its witness and get one more award!

Coin Marketplace

STEEM 0.29
TRX 0.11
JST 0.033
BTC 64918.30
ETH 3169.12
USDT 1.00
SBD 4.05