Mobile Optimized-Interior Shader

Mobile Optimized-Interior Shader

Interior Shader is made in such a way to improve and enhance Buildings structure because in my opinion most mobile/indie games artists don't focus on Window's detail. This shader helps Artists to improve the game quality while keeping the game Optimized.

There might be many different approaches to this exact solution, but I found this approach to be easy, fast and helpful.


Pre Requisite:

This shader is mainly developed for Universal Render Pipeline. If you are already working on a project here is the link to convert an existing project to Universal Render Pipeline.

https://docs.unity3d.com/Packages/com.unity.render-pipelines.universal@7.1/manual/InstallURPIntoAProject.html

We also need Shader Graph for this shader (It is included in Universal Render Pipeline Package).

Creating Shader:

First of all, Create a PBR Master shader.

TIling & Offset

First, we will start Working on Tiling and Offset of Shader for that Make a property of Vector2 from which we can get the Tiling of the shader from the inspector and connect it to Negate Node to inverse the value and add it into Tiling parameter of Tiling and Offset Node. After that connect all this to Fraction Node and then multiply it with X:2, Y:2. Now we need to subtract our result from X:1, Y:1. Now Connect all this into Split Node from which we Only need X (R) and Y (G). Connect the X & Y output from Split Node to Vector3 Node. Make a Property of Vector1 which will control the Depth of the Shader. Connect depth Property with Negate Node to inverse it and then connect it to the Vector3 Z Value.

No alt text provided for this image

View Direction

Create a View Direction Node and Set its Space to Tangent then insert its output in B Parameter of Divide Node and set A parameter to 1. Multiply it With our Tiling and Offset's Final Result. Take the Divided Input of View Direction Node and insert it into Absolute Node. Now Subtract it from the Multiplied value of Tiling and View Direction. Now Insert it into Split Node. Now we need to split it, that Take the X (R) and Y (G) output, and put it into Minimum Node. Now Insert it into another Minimum Node and also take the Z (B) output from the Split node and insert it into this minimum Node. Now Multiply Minimum Node's output and View Direction's output. Now Add This output with Tiling and Offset's Final Result.

No alt text provided for this image

Color & Texturing

Take a Sample Cubemap Node. Make a Property of Cubemap and Insert it into Cube Parameter of Sample Cubemap Node. Now Insert the Final Result of View Direction Effect into Viewdir Parameter. Make a Vector3 Node and set its Z value to 1 and X & Y to zero. Take a Color Property and multiply it with output from Cubemap Node. Convert this shader into Sub Shader so we can proceed further.

No alt text provided for this image

Final Result:

Adding Multiple Cubemaps to One Material

Make a new Shader and make a Node Of our previous Sub Shader in it. Assign make Properties for its Parameters and insert in respective Parameters. Now make another Node of our Sub Shader and assign its Parameters as well. Now make a Vector2 and insert it into the Tiliing Parameter of Tiling and Offset Node. Take its output and divide it by two. Insert this output to UV Parameter of Checkerboard Node. Now take the output of the first and Second SubShader and insert it into the A & B Parameter of Lerp Node. Now Take The output of Checkerboard Node and insert it into the T Parameter of Lerp Node. Take Output of Lerp Node and insert it into Albedo Parameter of PBR Master Node.

No alt text provided for this image

Properties Panel

No alt text provided for this image

Final Result:


Your Feedback and Comments are much APPRECIATED.

Very well done!

Like
Reply
Majid Rehan

GamEmpires4K followers

4y

Thank you so much Mubasher Amer for putting such an effort and letting us know about your approach to shaders. Really appreciated..

To view or add a comment, sign in

More articles by Muhammad Mubasher

  • Mobile Optimized Grass Trample Effect

    Guys this is a real tough nut to crack but finally, all the pieces of puzzles fallen into the right spots. This shader…

    6 Comments
  • Rat Animation Shader

    This Shader is made in such a way to improve and enhance the little details in the environment to make it more…

    6 Comments

Others also viewed

Explore content categories