Learn to write surface shaders in Unity in this complete tutorial series.
In this Unity tutorial series we will be giving you an introduction shader scripting, showing you how to write your our own surface shaders for your Unity game.
This text tutorial is accompanied by a complete video. I recommend watching the video and referring to the text as reference.
Be sure to read the tutorial carefully, and post any questions you may have if you get stuck, as there is a lot to cover. I will be using some examples from the Unity shader reference found here:
http://docs.unity3d.com/Documentation/Components/SL-SurfaceShaderExamples.html
My goal is to help you understand how shaders work and how you can write your own shaders from scratch in Unity.
NOTE: This tutorial requires very basic knowledge of scripting such as variables and functions. If you have no scripting experience I recommend you first watch our Introduction to Scripting tutorial in the getting started section.
In part 4 we covered how to add normal maps to our shaders, now let’s take a look at adding specularity
Part 5 – Adding specularity to our Unity surface shaders
Our shader is looking great, but it is still using lambert shading. Let’s add some specular highlights to our shader and while we’re at it we will use some awesome properties to control the specularity.
First, before we can use specularity we need to change our lighting model. Currently we are using ‘Lambert’, to get specularity we need ‘BlinnPhong’, this is a predefined lighting model in the Lighting.cginc file in your Unity installation. (You can actually add lighting models to this cginc file, but that’s a topic for another day.)
So what properties does a specular shader add to the mix?
Well we have three new ones:
- _SpecColor – This is used in the lighting model itself to control the tint of the specular highlights. As it’s already being called in the lighting model, we don’t need to do anything else with it.
- o.Specular – This is the specular power, or how soft the falloff is on the specularity.
- o.Gloss – If you want to use an image to control where the specular highlights will show, this is where it is output. You can think of this as a black and white image to cut out areas of specularity.
So let’s apply specularity to our shader:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
Shader "unityCookie/Bumped Specular" { Properties { _MainTex ("Diffuse Texture", 2D) = "white" {} _BumpTex ("Normal Map", 2D) = "bump" {} _SpecColor ("Specular Color", Color) = (1,1,1,1) //This passes a color to the BlinnPhong lighting model _SpecPower ("Specular Power", Range(0, 2)) = 0.5 //How strong our specular highlight it, notice how I have the range going to 2 to allow for some really sharp highlights } Subshader { Tags { "RenderType" = "Opaque"} CGPROGRAM #pragma surface surf BlinnPhong //We are now using the BlinnPhong lighting model struct Input { float2 uv_MainTex; float2 uv_BumpTex; }; sampler2D _MainTex; sampler2D _BumpTex; float4 _SpecPower; //We define the _SpecPower as a float4 (4 floating variables for RGBA) void surf (Input IN, inout SurfaceOutput o) { fixed4 tex = tex2D (_MainTex, IN.uv_MainTex); //We define our texture as a fixed4 so we can extract the alpha to use as a gloss map o.Albedo = tex.rgb o.Normal = UnpackNormal (tex2D (_BumpTex, IN.uv_BumpTex)); o.Specular = _SpecPower; //We use the spec power to control the intensity of our specularity o.Gloss = tex.a; //We use the alpha channel of our image to control where we want specularity. } ENDCG } Fallback "Diffuse" } |
Cool, so most of this should make sense, notice how we defined our _SpecPower with the sampler2D’s, This is where all properties go.
Next we have this one:
o.Gloss = tex.a;
We are using the alpha channel of our image to define the specular highlights. This means we don’t need a third image to control specularity.
You should be familiar with using spec maps by now, but if not, they are a black and white image, where the black cuts out the specularity to make it look more Lambert. this helps add an extra level of detail to the shader.
Next we will go in add take a look at cubemap reflections…
Alex, any tips on creating a left side screen vs right side screen controllers for Android? I.e. move camera with right side, move charactercontroller with right side..plus a button on right side to shoot, aim, and such.
Hi Chris,
Gabriel would be better to answer this as he’s the mobile dev, but I believe you need to have some textured planes in front of the camera and sending a ray out from where the user touches the screen (Input.touches?) and see where the ray hits to do a various action.
-Alex
I found something that works. Joystick.js with standard assets (mobile) is good for moving. And this is good for guiTextures..
for(var touch:Touch in Input.touches){
if(touch.phase==TouchPhase.Stationairy&&goButton.HitTest(touch.position))
DoSomething()…True part;
else if(touch.phase==TouchPhase.Ended&&goButton.HitTest)
DoSomething()…False part;
}
and so on…
Ah cool, glad you got it sorted
-Alex
Is it possible to add some buttons to the other parts of the tutorial series somewhere on this page, like they do on BlenderCookie?
Oh, I see now that there are such links in the other parts, just not in this latest tutorial…
Thanks for the heads up. Updated
Hi Alex,
>We are using the alpha channel of our image to define the specular >highlights. This means we don’t need a third image to control specularity.
I am used to other game engines where you save out a separate specular image. Is it possible that this can be added rather than using an alpha image.
Also I am not sure how the alpha is saved. Usually in an image the alpha is tranparency. Are you actually saving the image as a psd? I normally stick to tga’s for game images you see.
Sorry if I have missed the point.
Hi Thomas.
It is, the reason we include it in the alpha of the diffuse is that it is one less image that needs to be called which means it’s more efficient.
To use a separate image, just add in another image input, sampler2D and tex2D then map that image rather than the tex.a
to save alpha:
In photoshop create a new channel in the channel box (this will automatically be assigned alpha) then with this channel selected paste in the black and white spec map.
Does this help?