Thomson Gunardi Teguh

Games and Graphics Programmer

Wireframe Shader

A shader that renders only the edge of each polygon on the mesh.  The shader uses the geometry shader to assign barycentric coordinates to each per vertex data for every single triangle.  These coordinates are linearly interpolated across each triangle by the rasterizer, allowing each fragment to have information on how close it is to the edge of the triangle.

Screen space derivatives of the barycentric coordinates were then used to reduce aliasing by adjusting the alpha value that is used as opacity.

High Dynamic Range (HDR) is enabled and bloom post processing was turned on through the use of Unity’s post processing stack.

Wireframe Projector

The wireframe projector is an example application of the wireframe shader that can be used as a visual effect in games.  The wireframe material is projected onto objects that is within the view frustum of the projector.  In this case, the object is rendered twice.  First using the object’s own material and then with the wireframe material.

The projector’s cone is determined by the cucoloris texture (commonly known as a cookie texture) attached to the projector.  This is one of the source of attenuation for the wireframe effect.  The other source of attenuation comes from direction of the projector from each individual fragments.  The angle between this direction vector and the fragment’s normal determines how strong the attenuation should be.

The two sources of attenuation controls the intensity of the wireframe effect, giving a nice drop off gradient for areas that are not in the center of the projector’s cone of vision.

Animating the projector between two orientations using sin waves and spherical linear interpolation, creates an effect suitable for showing a security camera’s cone of vision in a stealth game.

Previous Post

© 2020 Thomson Gunardi Teguh

LinkedIn | GitHub | thomsongunardi@hotmail.com