• Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
  • Asset Store
  • Get Unity

UNITY ACCOUNT

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account
  • Blog
  • Forums
  • Answers
  • Evangelists
  • User Groups
  • Beta Program
  • Advisory Panel

Navigation

  • Home
  • Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
    • Blog
    • Forums
    • Answers
    • Evangelists
    • User Groups
    • Beta Program
    • Advisory Panel

Unity account

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account

Language

  • Chinese
  • Spanish
  • Japanese
  • Korean
  • Portuguese
  • Ask a question
  • Spaces
    • Default
    • Help Room
    • META
    • Moderators
    • Topics
    • Questions
    • Users
    • Badges
  • Home /
avatar image
4
Question by alemke · May 01, 2014 at 07:24 PM · alphafogalpha-channel

How to do fog planes like BioShock Infinite

I noticed in Bioshock Infinite they have these fog effects that are just flat planes (not billboards), with a scrolling transparent fog texture on them. They alpha fades to transparency as you get closer to them, and it looks like the alpha also fades out on either end of the plane. So you don't have a hard edge that the texture is scrolling into/out of.

The scrolling and alpha fading as you get closer don't seem too hard. But I am wondering how to fade the alpha at either end of the rectangular plane.

Any ideas?

Comment
Add comment
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users

1 Reply

· Add your reply
  • Sort: 
avatar image
10

Answer by Professor Snake · May 01, 2014 at 10:46 PM

You could write a shader that takes an additional alpha mask texture that isn't being scrolled and "guides" the edge fadeout. Basically a texture like this:

alt text

along with something like:

 o.Alpha=tex2D(_FadeGuide,IN.uv_FadeGuide).r;

This is the finalized shader code. It also handles the fading and scrolling for you:

 Shader "Custom/BInfiniteFog" {
     Properties { 
         _MainColour("Colour",Color)=(1,1,1,1)
         _MainTex ("Base (RGB)", 2D) = "white" {}
         _CutoffTex ("Alpha Guide", 2D) = "white" {}
         _ScrollDir("Scroll Direction",Vector)=(1,0,0,0.1)
         _FadeMul("Fading Multiplier",Range(0,3))=1
     }
     SubShader {
         Tags { "RenderType"="Transparent" "RenderQueue"="Transparent"}
         LOD 200
         
         CGPROGRAM
         #pragma surface surf WrapLambert alpha
         half4 LightingWrapLambert (SurfaceOutput s, half3 lightDir, half atten) {
            //half NdotL = dot (s.Normal, lightDir);
            half4 c;
            c.rgb = s.Albedo * _LightColor0.rgb * (atten * 2);
            c.a = s.Alpha;
            return c;
         }
 
         sampler2D _MainTex;
         sampler2D _CutoffTex;
         fixed4 _ScrollDir;
         fixed4 _MainColour;
         half _FadeMul;
         struct Input {
             float2 uv_MainTex;
             float2 uv_CutoffTex;
             float4 screenPos;
         };
 
         void surf (Input IN, inout SurfaceOutput o) {
             half4 c = tex2D (_MainTex, IN.uv_MainTex+_ScrollDir.xy*_ScrollDir.w*_Time.y)*_MainColour;
             o.Emission = c.rgb;
             o.Alpha=tex2D(_CutoffTex,IN.uv_CutoffTex).r*c.a;
             o.Alpha*=clamp(IN.screenPos.z*0.4*_FadeMul,0,1);
         }
         ENDCG
     } 
     FallBack "Diffuse"
 }

As for the shader properties:

alt text

Base is your fog's texture. Main Colour is the tint you wish to apply to the fog texture. You can also adjust the alpha to make it more transparent. The alpha Guide is your mask; the darker it is, the less visible the fog is going to be. The shader uses the ScrollDirection x, y and w components. X and Y are a 2D vector of the direction of the scrolling and W is a magnitude multiplier. Having either X and Y both be zero, or W be zero would yield no scrolling. As for the fading multiplier, the lower it is, the more distance the object needs to start fading. If you want your fog to also be affected by lighting, change o.Emission to o.Albedo at line 29.

The effect looks like this, with the fading multiplier set to a rather low value.

alt text

Comment
Add comment · Show 11 · Share
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users
avatar image alemke · May 02, 2014 at 04:09 AM 0
Share

That would be super helpful as I am not familiar with writing shaders. ;)

avatar image Professor Snake · May 02, 2014 at 01:25 PM 0
Share

I updated the answer with the shader code.

avatar image alemke · May 02, 2014 at 05:45 PM 0
Share

Wow, amazing! thank you so much! In your gif it looks like the alpha is fading as the player approaches is that happening or do I need to write a script that will do that?

avatar image Professor Snake · May 03, 2014 at 09:34 AM 0
Share

No. The shader takes care of that for you with the

 o.Alpha*=clamp(IN.screenPos.z*0.4*_Fade$$anonymous$$ul,0,1);


line.

If you think the linear fading isn't all that fitting, replace IN.screenPos.z in that line with pow(IN.screenPos.z,2), or something that fits you best.

avatar image alemke · May 03, 2014 at 04:11 PM 0
Share

Thanks again this is so amazing. Full disclosure I was trying out Unreal for the past two weeks. This was my first post back in the Unity community and what a welcome back!

Show more comments

Your answer

Hint: You can notify a user about this post by typing @username

Up to 2 attachments (including images) can be used with a maximum of 524.3 kB each and 1.0 MB total.

Welcome to Unity Answers

If you’re new to Unity Answers, please check our User Guide to help you navigate through our website and refer to our FAQ for more information.

Before posting, make sure to check out our Knowledge Base for commonly asked Unity questions.

Check our Moderator Guidelines if you’re a new moderator and want to work together in an effort to improve Unity Answers and support our users.

Follow this Question

Answers Answers and Comments

23 People are following this question.

avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image avatar image

Related Questions

Alpha Importing Completely White 2 Answers

Unity Fog Shader with Alpha Change 0 Answers

Better to have alpha textures in the same material and mesh, or separate? 0 Answers

Water shader with alpha 0 Answers

How to access alpha value of transparent shader. 3 Answers


Enterprise
Social Q&A

Social
Subscribe on YouTube social-youtube Follow on LinkedIn social-linkedin Follow on Twitter social-twitter Follow on Facebook social-facebook Follow on Instagram social-instagram

Footer

  • Purchase
    • Products
    • Subscription
    • Asset Store
    • Unity Gear
    • Resellers
  • Education
    • Students
    • Educators
    • Certification
    • Learn
    • Center of Excellence
  • Download
    • Unity
    • Beta Program
  • Unity Labs
    • Labs
    • Publications
  • Resources
    • Learn platform
    • Community
    • Documentation
    • Unity QA
    • FAQ
    • Services Status
    • Connect
  • About Unity
    • About Us
    • Blog
    • Events
    • Careers
    • Contact
    • Press
    • Partners
    • Affiliates
    • Security
Copyright © 2020 Unity Technologies
  • Legal
  • Privacy Policy
  • Cookies
  • Do Not Sell My Personal Information
  • Cookies Settings
"Unity", Unity logos, and other Unity trademarks are trademarks or registered trademarks of Unity Technologies or its affiliates in the U.S. and elsewhere (more info here). Other names or brands are trademarks of their respective owners.
  • Anonymous
  • Sign in
  • Create
  • Ask a question
  • Spaces
  • Default
  • Help Room
  • META
  • Moderators
  • Explore
  • Topics
  • Questions
  • Users
  • Badges