General Graphics in Unity – Vertex Colors, Shaders, Meshes, UVs

September 11, 2019

General Graphics Information

Meshes, Shaders, Vertices, UVs

Youtube – MESH COLOR in Unity – Terrain Generation

Tutorial #1

Youtube – Learning Shaders in Unity – Everything about Meshes in under 5 Minutes

Info #1

Youtube – Pico Tanks: Vertex shader in Unity

Info #2

Tutorial #1

I was interested at looking into using vertex colors for objects, which led me to a few interesting videos on various aspects of 3D modeling in general. Tutorial #1 was a nice example of using vertex colors in Unity, as well as giving me a simple tutorial to look into on mesh deformation as well. It uses Unity’s shader graph to apply vertex colors, and just simply sets colors with a gradient onto the vertices themselves based on their height (y position).

Info #1

Info #1 was a very brief but general overview of topics on meshes.

  • UVs: It explained how UVs are used to map textures onto faces of objects, which was the biggest topic I had not really covered up to this point. UVs also belong directly to a vertex.
  • Vertices: It also went into how their can be more vertices on an object than you’d expect (since they have a normal that goes with individual faces).

This video was specifically aimed at Unity, so some of the information was most likely Unity specific. For instance, the fact that the Mesh class contains Vertices, Normals, UVs, Tangents, Triangles, and Colors. It finally got into vertex colors at the end, which also showed an example of it being used that just made a very cool colored cube I thought.

From: Info #1

Info #2

Finally, Info #2 was just a very quick video of a game project showcasing their use of vertex shaders to actually move trees in their environment when objects are moving through them. Moving objects affect the colors of an underlying texture map, which use this “color information” to apply affects, such as rotating the trees.

Outline Shader in Unity

July 3, 2019

Outline Shader Tutorial in Unity

Youtube – Shader – Smooth Outline – [Tutorial][C#]

By: N3K EN

As someone with very minimal shader experience in Unity still, this step by step tutorial is nice for just getting a feel for how shader code is setup while also creating a useful effect for certain art styles or attention drawing practices. It simply creates an outline around 3D objects of various color with variable width.

Starting with Unity Shader Graphs – Brackeys

May 12, 2019

Unity Shader Graphs

Basic Tutorials

Youtube – MY NEW FAVOURITE FEATURE! – Shader Graph Tutorial

By: Brackeys

Youtube – FORCE FIELD in Unity – SHADER GRAPH

By: Brackeys

These tutorials get into the basics of using the Shader Graph feature in Unity. This seems like a nice tool to have a basic understanding of to make some cool effects, so I want to check in on it at some point.

Field of View Tutorial with Mask Shaders

January 22, 2019

Field of View

Tutorial – E03

Youtube -Field of view visualisation (E03)

By: Sebastian Lague

This tutorial ties the Field of View (FoV) series in with shaders. These shaders block everything from rendering except what is viewed by the player character. The shader scripts actually had barely anything added to them, and I’m not completely sure what they did.

The shaders were both Standard Surface Shaders. A Stencil method was added into the SubShader section of both. In StencilMask, this method was just:
Ref1
Pass replace
In StencilObject, it was:
Ref 1
Comp equal
The only other additional code was in StencilMask, which was adding “Queue” = “Geometry-100” to the Tags, then ColorMask 0, and ZWrite off.

SHADER PROGRAMMING TERMS

  • ”Queue” = “Geometry-100”

    So these tags are terms that represent integer values that determine what is rendered first. Geometry has an integer value of 2000, and is the base for most opaque objects, so choosing “Geometry-100” will make whatever this shader is applied to render before anything labeled as just Geometry (like most opaque objects) as it will now have a value of 1900.

  • ColorMask 0

    ColorMask sets color channel writing mask. Writing ColorMask 0 turns off rendering to all color channels. Not sure exactly what this ends up doing.

  • Stencil

    The Stencil Buffer is a general purpose per pixel mask for saving or discarding pixels.

  • Ref 1

    This is the value each pixel is compared against and/or value to be written to the buffer.

  • Comp equal

    Comp compares the reference value to the current contents of the buffer.

  • Pass replace

    A Pass block renders geometry of a GameObject once. This determines what to do with the contents of the buffer if the stencil test passes (which might go with the Ref). Replace writes the value into the buffer.

ATTEMPTED SUMMARY

StencilObject is placed on the materials to all of the GameObjects, like the obstacles, the ground and the targets. This makes them render completely black. Then the StencilMask is applied to the ViewVisualization material of the player’s vision, and this “uncovers” the objects in vision by allowing them to render normally (removing the internal mask the objects are placing on themselves).

StencilObject creates a reference value of 1, then compares to that value. So it should only render pixels whose value equals 1, the reference value in the buffer. StencilMask has a Pass replace command, so this apparently writes the Ref value directly to the buffer. So this is writing the value 1 to the buffer. For some reason, this renders just before standard Geometry queue objects, and there is a ColorMask 0. This will require more shader knowledge in the future for me to understand fully.

PROBLEMS

For some reason, my ground plane was fading out on the edges. The outter edges would actually fade so much they completely blended into the background as the exact same color. I know the ground was still there as I could see it in the editor and the player did not fall when walking on the invisible ground area, but it just did not appear. Changing the Directional Light color to black fixed this for some reason, so there appears to be some strange interactions with these shaders and the lighting in the scene.

Recap – Week of January 13 to January 20

January 20, 2019

Recap – Week of January 13 to January 20

Thesis Work

Continue to search for some research on the general term of “game mechanics” to solidify the use of its definition as well as determine the components that make for interesting variable mechanics.

Terminology to Look Into – Programming

Structs

Structs were a big part of the field of vision tutorials, and I still don’t fully understand how to utilize them. They are structured data containers that can hold many types of variables to use over and over, but I’m not sure if there’s more to them to help utilize them, especially for games. Could help to look into a tutorial where there are characters or enemies with stats (i.e. RPGs), or a pokemon-like tutorial (well, also under RPG).

Field of Vision Recap

Youtube – Field of view visualisation (E03: stencil shader)

By: Sebastian Lague

To start, I just wanted to include that there is a 3rd part to this tutorial series I would like to get to. The field of view (FoV) tutorial was really useful for learning several aspects of Unity programming overall. I learned more about creating Editor elements for making your scripts into more designer friendly tools. I was still getting some weird interactions with the GetAxisRaw command I need to look into. This was also a nice refresher on generating meshes within script, but the extra twist of tying it in with raycasts was something interesting, new and useful.

Learning Foundations of Unity Shaders

My Blog – Learning Foundations of Unity Shaders

This was my first time learning about shaders and getting into the Shader Language and scripting anything, so I was introduced to a lot of new concepts and terminology. I covered it pretty extensively in the blog post, so I just relinked it here. These tutorials made by Unity in several steps are usually very informative conceptually as well as programmatically.

Quadtree and Octree

These data structures for use in games seem like they could be very useful for some things I am interested in since they seem like they can be pretty computationally beneficial if you want to have wide reaching field forces interacting between many different objects. I will still need to do more research into this, as well as find more tutorials as they were hard to find.

Learning Foundations of Unity Shaders

January 18, 2019

Intro to Shaders in Unity

Glitchy Man Material

Unity3D – Live Training Session: Writing Your First Shader In Unity

This tutorial was pulled from the tutorial list I created January, 17th (“Assorted Unity Tutorials – Structs, Shaders, and Unity Architecture”). IT not only introduced me to the core components that make up a shader in Unity, it also covered a lot of terminology and behind the scenes information to give me a better foundational understanding of how shaders operate.

Types of shaders you can create in Unity:
  • Surface Shaders: code generation approach that’s easier to write lit shaders than using low level vertexe/pixel shader programs
  • Unlit Shaders: don’t interact with Unity lights, useful for special effects
  • Image Effect Shaders: typically postprocessing effect that reads source image, does calculations, and renders result
  • Compute Shaders: programs run on graphics card, outside normal rendering pipeline; used for massively parallel GPGPU algorithms or accelerate parts of games rendering
Explaining Basic Shader Script

Shaders go onto a material. Determines how a material is rendered. Standard for Unity shader uses Shader Language. The Properties block is similar to public variables in Unity, as they can be seen in editor. The Pass block is where script passes logic to renderer. Tags explain how it wants to be rendered. The two structs (data functions) pass into main functions. These are the vertex function (vert) and the fragment function (frag).

Core Terminology for Shader Scripts
  • Vertex Function: takes shape of model and potentially modifies it; gets the vertices of model ready to be rendered; converts form object space to clip space (relative to camera); result goes to fragment function
  • Fragment Function: applies color to shape output by vertex function; this paints in the pixels
  • Property Data: colors, textures, values set by user in inspector
  • LOD (Level of Detail): this goes with how detailed object is (usually associated with idea in games where closer objects have higher detail and far objects have low detail)

Shaders do not use inheritance. Most classes in Unity start as Monobehavior, which gives you a lot of nice base functions. Shaders need that included, which is what the line { #include “UnityCG.cginc”} is for. This includes the use of a bunch of helpful helper functions.

Two important structs: appdata and v2f. appdata passes in information of vertices of 3D model. These are passed in in a packed array (variable with 4 floating point numbers: x, y, z, w). POSITION is a semantic binding, this tells shader how something will be used in rendering. V2f is short for “vert to frag”.

Coordinate system translations:

Local space -> World Space -> View Space -> Clip Space -> Screen Space

Looking into fragment sections

Fixed4 can either be: x,y,z,w or for color, r,g,b,a. Created a variable _TintColor in properties, which showed up in Unity inspector under the Unlit_Hologram material. This then needed to be used in the CGPROGRAM to actually do anything. We added this color to the fixed4 col found in fixed4 frag, which “adds” the colors together.

Making a transparent Shader

First, changed RenderType in Tags from Opaque to Transparent. Also needed to add “Queue” = “Transparent” here, as the order things are rendered is also important. Because of this, you want other things rendered before rendering the transparent thing because you want the transparent thing rendered “on top”. There are several primary queue tags that exist for rendering order. The following is the order of rendering generally, from first to last.

Primary Queue Tags for Render Order:
  • Background (first, back)
  • Geometry (Default)
  • AlphaTest
  • Transparent
  • Overlay (last, top)

Add ZWrite Off keyword. Tells us to not render on the depth buffer. This is usually done for non-solid objects (i.e. Semi-Transparent).

Displacing vertices and clipping pixels

Using the function “clip” in frag function to clip out pixels within a certain threshold. Adding sin function along with several variables (Speed, Amplitude, Distance, Amount (Multiplicative Factor)) into vertex function to move vertices around in object space, relative to the object. This is done before passing into the frag function. _Amount was a factor in a range between 0 and 1 just to control how much the shader effect was happening. The amount was important for the C# script used to control the effect on a time based interval. The C# script, HoloManGlitcher, could access the variables within the shader script. This was done simply through the material. (i.e. holoRenderer.material.SetFloat (“_Amount”, 1f); )

Assorted Unity Tutorials – Structs, Shaders, and Unity Architecture

January 17, 2019

Unity Tutorial Assortment

Structs, Shaders, and Unity Architecture

Youtube – HOW TO MAKE COOL SCENE TRANSITIONS IN UNITY – EASY TUTORIAL

By: Blackthornprod

Youtube – Beginning C# with Unity – Part 15 – Structs

By: VegetarianZombie

Youtube – Reduce Garbage Collection in Unity with Structs

By: Unity3d College

Youtube – Unity Architecture – Composition or Inheritance?

By: Unity3d College

Youtube – Shaders 101 – Intro to Shaders

By: Makin’ Stuff Look Good

Unity3D – Live Training Session: Writing Your First Shader In Unity

By: Unity

This is juts a list of some useful resources of tutorials for some things I would like to get around to soon. They cover some basic functionalities of Unity, as well as some more in depth programming concepts to help aid in building my code.