вторник, 3 июля 2018 г.

Fake interior shader for cheap windows

How to create material to simulate interior through window in Unreal engine.

In many outdoor environments like cityscapes there are a lot of different buildings. You’d probably want to show that buildings are not empty box-like objects. Instead, they have various rooms interiors visible through their windows. This could be expensive as long as you need to model all exteriors, texture them and set-up lights. It became even more expensive if you need use some glass shader to make windows looks more material. The glass could probably reflect some light or be dirty. And at the same time it should be transparent. Transparent objects are expensive.

But in case when such interiors are part of background, what means that its is not mentioned that player can be near enough to explore them, there is some hacks.

Parallax Texture

The first is to use parallax texture.
This approach was used such games as Bioshock Infinite and many other:




Cubemap Texture

The more accurate approach is to use a cubemap. This method gives you more realistic result.



Creating material



You need to generate world-space coordinates for every texel of your room. Fortunately, Unreal already have a node to do this for you. The node named InteriorCubemap. It generates UVW coordinates that can be passed to cubemap.


Shift parameter helps to tweak camera position inside room. This value is used with bunch Tweak Cubemap. By thweaking those siz values you able to modify output of Interior Cubemap to achive best mapping for a cubemap.

Another one tweak is related to texture coordinates itself. Those nodes allow to tile rooms and shift them along U and V axsis.



I've added options to control look for the room by changing it's tint and saturation


And another one good idea is to add a curtains if you are planning to make a materila for a fake window


Curtains are lerped with output cubemap


This is how it works:



Baking cubemap




First, you need to bake your interiour into cubemap, or find cubemap somewhere else. Let’s assume that you have some scene with interior for your fake room. Place SceneCaptureCube Actor at the center of your scene.  


Then create new CubeRenderTarget and set it as TextureTarget property of CaptureCubeActor. Now you have a cubemap of your room. The best practice is to use a room that fits into cube. You can save your cubemap as a static static texture and delete CubeRender from scene. Use captured cubemap in shader and have fun. (But remeber, that you will need to tweak some settings first)