Skip to content

❄️ HW 11: Shaders

Assignment Deadline

Gradescope assignment due Friday, March 22nd 2024

Submit

Image title

Computer graphics allows us to create different things from a single pixel to a group of pixels. Pixel shading is one of many things that can be performed with computer graphics. Pixel shading refers to the process of computing a color for a pixel. On shader-based hardware, this is where your pixel shader is executed. In a basic forward renderer pass, where we are rendering objects into the frame buffer, the pixel is typically first lit and then fogged if fogging is being used. the output of a pixel shader consists of not only an RGB color, bu also an alpha value, which is usually interpreted as the "opacity" of the pixel, used for blending.

Shaders

Image title

A shader is a shader program, a program that runs on a GPU. In Unity, shaders are categorized as such:

  • The most common type of shaders are the ones part of the graphics pipeline. They are important because they help perform calculations that determine the color of pixels on the screen. In Unity, we work with Shader objects.
  • Compute shaders work outside of the regular graphics pipeline and perform calculations directly on the GPU
  • Ray tracing shaders perform calculations related to ray tracing

Shaders are an important part of the computer graphics rendering pipeline because they inform the computer how to render and shade objects within a scene. Shaders can powerfully enable speed and detail enhancements in a program and can provide special effects in 2D and 3D computer graphics.

HLSL

Image title

HLSL is similar to the shader language, "Cg", which is a shader language developed by NVIDIA and GLSL, the shading langiage used in OpenGL. HLSL is the language that is behind Unity's shaders, a flexible and powerful shader that can be used within the context of Unity and other contexts. We can write many different kinds of shaders, they usually come in six forms including vertex shaders, geometry shaders, pixel shaders, compute shaders, ray tacing shaders, and tessellation shaders. Microsoft also uses this language for their Direct3D API to create GPU programs.

Important notes about HLSL syntax:

  • DirectX 9-style syntax: Uses sampler2D, tex2D(), and similar functions. This syntax works on all platforms and is considered legacy syntax
  • DirectX 10+ style syntax: Uses Texture2D, SamplerStatea and .Sample() functions. Some forms of this syntax do not work on OpenGL platforms because textures and samplers are not different objects in OpenGL.
  • It is important to note the different HLSL syntax because different hardware may be specific in what they need

Shader Graph

Image title

In Unity, Shader Graph is a tool that helps build shaders in a visual way. Instead of writing code, we are able to use a node-based system to create a graph framework. It is great in giving instant feedback that reflects our changes.

Visual Effect Graph

Image title

Unity's Visual Effect Graph (VFX Graph) allows you to create simple and complex visual effects from a node-based programming language that combines blocks, nodes, and sequences. These effects can range from common particle behaviors to complex scene simulations. Together, these nodes can be combined as building blocks to created advanced procedural effects.

According to the Unity Manual, the Visual Effect Graph is useful for:

  • Create one or multiple Particle Systems.
  • Add static meshes and control Shader properties.
  • Create properties to customize the instances you use in the Scene.
  • Create events to turn parts of your effect on and off. You can then send these events from the Scene via C# or Timeline.
  • Extend the library of features by creating sub-graphs of the Nodes that you commonly use.
  • Use a Visual Effect Graph in another Visual Effect Graph. For example, you can reuse and customize a simple but configurable explosion in more complex graphs.
  • Previews changes immediately, so you can simulate effects at various rates and perform step-by-step simulation. For instructions on how to install the Visual Effect Graph, see Getting started with Visual Effect Graph.

Submission

GitHub Pull Requests

To receive credit for this homework assignment, please make sure you provide a link to your GitHub branch and name the branch as your first name. Then assign Nile and Debbie as Reviewers and Assignees before you hit the green Create Pull Request button.

Image title

Image title

Image title