Final Project Shader | Unity Shader Graph

Final Summary:

For my final, I really wanted to stick to what I thought would benefit me the most in terms of my own future endeavors within the game-making space. I have been recently working on a low poly environment for a game that I have started recently titled Office: Infinite. Right now it is in its infancy and is not a full build quite yet however after completing one of the indoor scenes here I wanted to try and add some more life to the scene overall. And while I do plan on adding more and more over time I thought that a really good Idea was to recreate flowing clouds within the scene using the unity shader graph as I thought that would have been a really practical use for the Package and would add so much to the scene overall.

Shader explanation:

The clouds were done completely in shader graph using a combination of floats, vector 2 and come color functions. I created a base pattern for the clouds using a simple noise node that I then attached tiling to in order to be able to manipulate or animate the clouds. I did this by creating a cloud speed float and time node to the tiling node allowing the clouds to move over time which is also totally adjustable with a slider that is a part of the plane that is connected to the shader material itself. I wanted to be able to mess around with an alternate slider that could change the look and feel of the clouds so I added in a power and colour node which allows me to fine tune the clouds depending on how I’m feeling or how I want the scene to appear.¬†Once the shader was functioning on the 2d plane that I assigned it to I realized I didn’t really like the look of it because of that reason, the rendering on the camera in unity was being weird with the plane so I went into blender and created a high poly plane that had a large curve kind of like it was blanketing the rest of the scene and imported that into unity. Once I applied the shader to that plane instead of the 2d plane I was happy with the way that the shader was looking. Finally, I added Alpha clipping to the shader in an attempt to allow light to be cast through the clouds onto the plane however this gave me problems.

Struggles/Going Forward:

The biggest thing I struggled with was trying to get real-time shadows cast down onto the plane through the clouds. This has been a struggle for me as I’ve tested multiple different render modes and different lightmaps and global illumination options but none of them seem to work which is very odd and annoying to me. I believe it has something to do with the universal render pipeline for the shader that I definitely want to look further into and figure out because I feel it would add a lot more atmospheric qualities to the scene overall. In the end. I’m very pleased with the results and feel of this shader. I will attach an itch.io downloadable and playable file to the submission of this project so that you can check it out yourself ūüôā

Documentation(Video/Photos):

Youtube Link to in-game footage: https://youtu.be/xNWWD_2OzMI

cloudsclouds1insceneblender-cloud-map

Week 9 Work | 90’s paper cup digital painting sbs

Working with substance designer 3d is actually really fun and enjoyable. It’s more user friendly than other similar programs and was very interesting and curious to explore around all of the different functionalities, not only with the various patterns, shapes, and designs you can drop in; but also by playing with all of the different customizable sliders and various tools within those proposed shapes or patterns that allow you to create something visually appealing to you.

My main inspiration when exploring substance design was to attempt to create a pattern that resembles the classic ’90s paper cup design using more primitive shapes but still blending them in a way that resembles that style of pattern. I was pleased with my results and feel as though I could’ve kept tweaking the pattern forever haha. I settled on this. (Left is my result, right is the inspiration | below is wip)

90s-paper-cup90s-mug3d

creating-and-merging-shapes-substance-designerpaper-cup-design

Week 8 PBR explorations.

This week was interesting as I’ve never really utilized these types of textures in my Unity projects. I played around a lot with the tilling slider on the textures as changing it produces some really interesting new designs with the same PBRs. After working with PBRs now. I am going to start taking advantage of the power of these materials more often.

HDRI and PBR found on: https://polyhaven.com/

tillingpbr-unity-scene

pbrcapturepbr

Week 7 (3d and vertex shaders)

 

Earth, Sun and Moon | push()pop() exercise

This was really fun to work on and was a surprising challenge to actually try and recreate the rotation around the sun on a more 3d plane. Ran into problems with certain push()pop() values being very fragile.

View: https://editor.p5js.org/sliceofair/full/PMXzv9pSo

earth-sun-and-moon

Bumpmap Exercise | Using the 3D model

I attempted at creating a bump map on this 3d spaceship. This was pretty confusing at the start because of all of the interchangeable values to get your desired look. I messed with the scale values to try and get it more in the frame and used an orange juice image overlayed onto the ship.

View: https://editor.p5js.org/sliceofair/full/EKhtMgOX2

bumpmap

Midterm Digital Mirror Illusion | Cam Saunders

Link: https://editor.p5js.org/sliceofair/full/7vbj-vCuO

Screenshots:

midterm-shader-1midterm-shader

Inspirations:

Infinity Mirror room (AGO) | Infinite Video effect

inspo-midterm-1inspo-midtern

About/Summary:

For this midterm assignment, I knew I wanted to try and create something “trippy” or that resembled some form of illusion. Therefore the “digital mirror” style artwork really spoke to me when I was brainstorming ideas. My main inspiration from a style/design standpoint was to try and recreate or resemble an infinity effect whilst utilizing a live video feed from your webcam to push that idea of an “infinity mirror” effect. I was originally texturing spheres for the effect however they did not create the same feeling of a constant loop.¬† similar to an actual mirror or phone screen.

This “infinity” style of work is really cool to me and is something I will explore further; not only is it continuously satisfying, but the live video feed textured onto each box allows the viewer to constantly create their own interesting patterns and illusions through their body movements alone creating an “infinite” amount of cool possibilities within this “infinite” mirror shader. My biggest challenge was trying to utilize some shaders within the feed as the filter function is not supported in WebGL. As well as figuring out how to properly create the grid I was looking for to accurately convey an “infinite mirror” effect.

Overall, this was a fun and challenging design process for me and I’m happy with the outcome.

Week 3 (generative form)

Favorite Shader 1:

shader-generative-formgenerative

Iterating upon one of my shaders from week 2. I wanted to severely multiply the number of pattern cells being displayed at a given time. This shader recreates the original pattern and splits it into 20 different parts creating a very satisfying effect. While making this I learned that a lot of mind-bending effects can more easily take form using st(fract) and smoothstep together.

Week 2 Homework Cam Saunders

Gradient #1: This week, using the float(), smoothstep() and mix() functions I was able to create an interesting blend of Vec3 colors in a parabolic state through defining PI and the sin function which allowed me to play with the parameters of where the gradients occurred and mixed with one another. I think this would be a really cool shader to try and animate utilizing u_time which I plan to use more often in order to bring my shaders to life.

mixed-gradient-shader

Code: