Aquatic Surface is a well optimized advanced material that implements configurable water effect.

Features

• Water clip line effect 
• Underwater and over water surface
• Underwater post-process volume
• Two types of static reflection/refraction projections (box projection. spherical projection)
• Translucency effect support for underwater particles and meshes
• Water holes for boats
• Example 4 types of basic configurations: lake/reef/pool/waste
• Animated caustics based on decals
• Standard UV mapping, vertex color flow, and texture color flow maps
• Over 100 parameters like translucency, fog depth, mapping, reflective, refraction, scattering, wet color.
• Multiple material switches enable/disable some of the effects to increase quality/efficiency
• Separated onto 4 materials: overwater surface, underwater surface, in water post-process volume, caustics decal. Each of them can be used with other water systems.
• Very fast and GPU friendly. 120-160 instructions depend on used effects.
• Quality/Efficiency adjustment. cinematic (realistic reflections) and standard (fast static box projected cube-map)
• Water edge implemented without using the distance fields
• Specular effect and glittering on waves
• Simplified underwater scattering
• Implemented as the unlit translucent material
• Interactions & Buoyancy components
• Fast simulated interactions with moving area
• More options and switches to customize/optimize than you can try during your whole life 🙂

Gallery

Release changelog

Documentation

Get started

In Aquatic Surface package the water visualization is divided into multiple specialized material effects. Each layer of the effect can be separately configured to achieve incredible effects and can be used individually.

• Overwater surface (M_AquaticOverWater)
• Underwater surface (M_AquaticUnderWater)
• Pre-translucent volume water (M_AquaticVolume)
• Post-process screen water (M_AquaticScreen)
• Caustics decal (M_AquaticCaustic)
• Waterplane holes for boats (M_AquaticHole)
• Material function fo translucent meshes (MF_AquaticTranslucent)

Demo folder contains all assets prepared to showcase the example Maps. Check the example maps to see the possibilities of the Aquatic Surface system.

Each example map uses its own template of water materials located in Template folder like Like/Reef/Pool. A template is a group of material instances created from Aquatic Surface master materials. For example, in folder Demo/Lake you can find material instances of materials used on LakeMap. Those materials can be easily edited to achieve another visualization of lake water.

You can create your own material instances of water by duplicating the chosen template content or by using the editor option “Create Material Instance” on master materials located in Material directory.

Few simple steps to start using Aquatic Surface:

1. Chose the template of Aquatic Surface water that you want to use on your map. For example AquaticSurface/Demo/Templates/Reef.
2. Drop the blueprint (/Demo/Templates/Reef/BP_AquaticSurface_Reef) of water on your level.
3. Modify the parameters of the blueprint to adjust the water to your map. Especially it is important to set up bounds of reflection overwater/underwater and post-process volume size. A detailed description can be found in Aquatic Surface Blueprint section.

Aquatic Surface Blueprint

The BP_AquaticSurfce is a combination of underwater overwater and post-process materials that provides a user-friendly interface to configure water.

Pay attention that M_AquaticScreen material should be set in PostProcess component in PostProcessMaterials array.

Over Water Surface

The M_AquaticOverWater is the material effect visible from over the water reflection refraction fresnel and depth. This material should be used on plane meshes aligned horizontally with normals directed upward.

1. Find the M_AquaticOverWater* material that you want to modify from the example library of materials.
2. Click right select duplicate option on the material. Rename to your water. It is good practice to have a clean naming convention like M_AquaticOverWater+River/Lake/Ocean.
3. Put on your scene flat plane surface and apply the newly created material.
4. Open created material and edit parameters to customize for your scene.

Under Water Surface

The M_AquaticUnderWater is a waterplane surface rendered from under the water. This material mainly represents the effect of refraction and reflection under the water. This material should be used on plane meshes aligned horizontally with normals directed down.  

1. Find the M_AquaticUnderWater* material that you want to modify from the example library of materials.
2. Click right select duplicate option on the material. Rename to your water. It is good practice to have a clean naming convention like M_AquaticUnderWater+River/Lake/Ocean.
3. Put on your scene flat plane surface and apply the newly created material.
4. Open created material and edit parameters to customize for your scene.

Pre-translucent volume water

The M_AquaticVolumeWater is a custom post-process effect rendered before translucent. Ths material visualizes the underwater ‘fog’ and wet surface.

The fog parameters should be set in BP_AquaticSurfce blueprint because these parameters are shared between multiple materials (like translucent).

Post-process water

The M_AquaticScreenWater a post-process effect that visualizes the distortion vignette and water plane clipping line. This material should be used in the post-process volume.

Caustics decal

The M_AquaticCausticDecal material is the effect of caustics projected on the ground. The effect is animated using a simplified method based on animated textures. Caustics animation using a looped cycle based on 16 frames. Caustics decal should be used wich blueprint BP_AquaticCausticDecal prepared especially to update the animation.

1. Find the M_AquaticCaustic* material that you want to modify from the example library of materials.
2. Click right select duplicate option on the material. Rename to your water. It is good practice to have a clean naming convention like M_AquaticUnderWater+River/Lake/Ocean.
3. Drag and drop Blueprints/BP_AquaticCausticDecal on your scene.
4. Set created material to the Dynamic Material parameter in BP_AquaticCausticDecal on your scene.
5. Open created material and edit parameters to customize for your scene.

UV mapping and normals

Wave effect is based on two moving normal maps. The system supports two types of wave effect animation in UV Transform and Water Flow. To switch between these two types of UV just change Use Flowmap option in the material. UV animation is supported by overwater surface as well as the underwater surface.

UV transform

UV Transform mode is the fastest and simpler method just moving and scaling the normal map layers UV coordinates in time. This mode is enabled when UseFlowMap is set to false. In this mode, two scaled layers of normal maps are moving linearly in a defined direction. The configuration of movement speed and scale can be changed in UV Move Sale 1 and UV Move Sale 2 parameter.

Water Flow

Water flow is one of the coolest methods of water animation, first introduced in Portal 2 presented on SIGGRAPH 2010.
The basic idea in this method is to move the UV of the water textures according to direction vectors drawn on the surface.

This package supports rendering water witch two methods of flow colors, vertex color, and flow map texture. Each method has some advantages and disadvantages described below:

Flow-tools

Texture-based flow mode uses textures that can be prepared in an external tool like FlowMap Painter. Those textures should be loaded as vector displacement maps because of data precision that is important to achieve the best possible visual effect. There will be a special tool for creating flow map textures in Unreal Engine Editor in the future version of the Aquatic Surface package.

Vertex-based flow mode is the more interesting feature because does not require any additional textures only mesh used for effect should be tesselated (divided on multiple triangles). You have to decide how many verticles do you need to draw your flow on the mesh.

Editing vertex flow

The process of editing water flow per-vertex is a little inconvenient because there is no tool for this in UE4 editor. I didn’t want to transform this package into a vertex-flow editor plugin because it’s not the idea of Aquatic Surface. I’ve decided to use Vertex Paint editor and create additional tools for previewing the results of changes that make the whole process a little more convenient.

1. Switch the option UseFlowMap to true to use the flow map feature on water.
2. Change mesh density according to your requirements of precision. If the material is not reacting on vertex color brush then probably you should use mesh with higher density and select the mesh component to paint.
   
3. Switch the option UseFlowmapToolthe to true in the overwater material to see debug vertex flow preview.
4. Select the mesh to paint on.
5. Chose Vertex Paint tool in the UE4 editor
6. Setup the paint color R and G according to the table of vectors below:
   

   (0.0, 1.0,)	UP (0.5, 1.0)	(1.0, 1.0)
   LEFT (0.0, 0.5,)	ZERO (0.5, 0.5)	RIGHT (1.0, 0.5)
   (0.0, 0.0)	DOWN (0.5, 0.0)	(1.0, 0.0)

7. Paint on the mesh
8. Use random  value on the blue channel to force noisy transition between normalmaps.
9. After finished work, you have to propagate changes to mesh to save the data.
   

   Unreal Engine 4 has some troubles with using dynamic vertex colors on actors so propagation is required to run vertex colors in the standalone version of the game. It’s inconvenient because you will have to do copies of every water surface that using vertex flow. You can speed up resolving this issue by voting on my bug fix request: https://issues.unrealengine.com/issue/UE-64354

Translucent under the water

The Aquatic Surface package supports translucent materials. This effect is very limited by the material system and requires to add special material node MF_AquaticSurface to the translucent material that will be used on an object in the water. This effect is implemented by fading the translucent objects depends on the distance from the camera.

There are three examples of material created for use under the water:

• M_TranslucentAdvanced – Advanced translucent effect calculated per pixel. It can be slow but very accurate.
• M_TranslucentFast – This material is using Vertex Interpolation. It’s a fast method to implement this effect.
• M_TranslucentDither – Traditional dither material used in UE4.
  

  

Reflections

Aquatic Surface supports multiple types of reflections. Table below shows differences between all approaches:

The type of material is specified in the Parent attribute of the material used as OverWaterMaterial in BP_AquaticSuraface.  It’s good practice to use _Unlit, _Lit, _SSR post-fix in water surface material names.  

Static cube-map reflections

All BP_AquaticSurface actors use the same shared Render Target reflection texture so it is not possible to generate the textures for multiple water reflections at the same time. However, the system can be set to use static pre-baked cube maps and it solves that problem.

Step by step how to create and use the static cubemaps:

1. Select the water actor on the scene.
2. Find the reflection tab in the properties of water actor
3. Clear the Static Reflection Cubemap value if is set. This will force the system to render reflection into the cube-map texture.
4. Click reconstruct button to refresh the texture.
5. Find /Game/AquaticSurface/Textures/Cubemaps/RT_AquaticCubemap
6. Click right button on the RT_AquaticCubemap and from the context menu chose the Create Static Texture
7. Set the newly created texture into the Static Reflection cube-map parameter in an Aquatic Surface actor.
8. Repeat all steps for all Aquatic Surface actors on the scene.

Probably you have some questions. For example WHY the hell I have to do this? Thanks to using static cube map textures your game will load and work very fast even on mobile and VR. It’s far better solution than dynamic reflections used in other water systems.

Dynamic planar reflections

Aquatic Surface can be easily set to use dynamic planar reflections.

1. Select BP_AquaticSurface on your map.
2. Switch UsePlaneReflection attribute to true.
3. Change OverWaterMaterial attribute to material that supports dynamic reflections (with post-fix _SSR or _LIT (for example MI_AquaticOverWaterOcean_LIT)
4. Open project settings and search for “Planar Reflections” switch the  “Support global clip plane for Planar Reflections” to true.
5. Save and restart the editor.

Hole in water plane

There is a simple solution for holes in water planes that can be used for boats. You just have to create a mesh that will be rendered inside the boat and use material M_AuaticHole. Check the example boat.

This feature requires screen color sampling so it is not supported on mobile platform.

Interactions

Aquatic surface supports the interactive surface effect based on physics simulation in a quality comparable to current-gen games. The basic configuration is presented in the video below (LakeMap):

1. Set UseInteraction=true parameter in the overwater/underwater material used in the water surface. 
2. Drag and drop BP_AquaticSimulation actor on the scene.
3. Set parameters of the BP_AquaticSimulation. Add the BP_AquaticSurface from the scene to the AquaticSurface list.
4. Add the BP_AquaticInteration component to the actor that is going to interact with water.

Aquatic simulation reacts on two types of interactions:

1. Component-Based – Actors that contains BP_AquaticInteration will be registered in the water surface and make waves when moving. Check the example Character blueprint with left/right foot interactions connected to the foot bones in the construction script.
2. Event-Based – Interaction can be generated on the event for example hit/explosion by executing the AddInteraction function on Simulation blueprint. The simple example presented in LakeMap level blueprint.
   

How fast it is where is a bottleneck? It takes about 0.06ms per frame for render the simulation in 256×256 texture that result is reasonable even for VR games. Update of the interaction component is the biggest bottleneck of the algorithm because of the slow math evaluation in the blueprints. That is why you should consider minimization the number of interaction components in actors or aquatic simulation blueprint nativization.

Buoyancy

Aquatic Surface supports a fast simplified buoyancy system for physics actors.  An example of using buoyancy is presented in the BP_AquaticBuoyancyActor.

1. Add BP_AquaticBuoyancy  to your physics-based actor
2. Set the parameters of an added component

Main references to create Anime Toon Shading was “Gravity Rush” and “Dragon Ball FighterZ” so if you want to achieve this kind of feeling with dynamic cartoon lighting in your game, then this package will be a perfect starter for you.

Anime Toon Shading is a post-process independent approach to cartoon style effect, which means it uses geometry based shading model that allows customizing every character on the scene to specific lighting conditions and works perfectly in the forward rendering mode.

Package contains a full lighting system that supports single dynamic directional light and multiple dynamic point lights. Perfect choice for VR games as well as mobile.

Features

• Advanced material configuration instanced per object specular/shading/outline
• Dynamic directional light support
  Multiple dynamic point lights that can affect actors
• Very fast and GPU friendly
• Material function, which can be used as an unlit/lit material
• Tested on meshes from paragon (great for stylizing assets)
• Geometry based shading. No need to use post-process uses, forward rendering mode works in VR and mobile.
• Interface for an easily combined dynamic toon lighting system with any actor
• Outline shell mesh (material for additional mesh rendered from inside)
• Multiple parameters designed with thinking of customizing toon shading on characters
• Anisotropic specular (hairs), specular matcaps support (Eyes, Metal)
• Easy to integrate with external post-process.
• Toon specular parameters: Specular size, color, and translucent, softness
• Toon shadow parameters: Glossy effect
• Aberration effect, softness, width, two shading methods (texture and smoothstep function), multiple shading textures
• Toon outline parameters: width, softness, color, and translucency

Gallery

Release changelog

Documentation

Geometry based shading

There are two types of packages on the marketplace that supports toon/cel-shading in UE4. Post-process based (other packages) and Geometry based (this package). Both have cons and pros and It is important to understand the difference to know with them chose. A table below shows basic differences and possibilities that will be supported or blocked depending on what you choose.

Probably there will be support for the post-process shading model in future versions of this package but in the current state, I’m focused on geometry-based shading.

Get started with material

This part of the documentation covers the basics of creating material in Anime Toon Shading. The system is divided into two types of material that can be used on geometry lit and unlit. Both types of material support similar functionalities and parameters but there is a small difference:

• Unlit (M_ToonShadingUnlit) – Very fast but can’t receive shadows.
• Lit (M_ToonShadingLit) Little slower but allow to receive shadows.

To start working with Anime Toon Shading you need to create material for your mesh:

1. Chose the material type that will be used on mesh for example M_ToonShadingLit.
2. Click right and select “create new material instance”.
3. Open material and set up parameters of new material as you like to see an object on the scene.
4. Apply created material to your mesh.

Using directional light

Directional light can be used for setting up global lighting that will be affecting all objects on the scene. Just drag and drop BP_ToonDirectionalLight on scene and setup parameters.

Using multiple point lights

Anime Toon Shading supports multiple point lights that are combined into second directional light data and applied to the base shading model. That functionality can be used for light flashes like explosions, some additional lighting on the scene, and shadowing in darker places where the directional light should not affect the object.

The dynamic light will only affect objects that implement properly BI_ToonShading interface. You can use an example implementation and inherit a base class of static mesh (BP_ToonStaticMesh) and skeletal mesh (BP_ToonSkeletalMesh)

1. Content Browser -> Crete Actor
2. Select BP_ToonStaticMesh or BP_ToonSkeletalMesh
3. Setup default mesh in the blueprint.
4. Set Toon Shading material on the mesh (Get Started section describes how to create new material).
5. Drag and drop created actor to your level.
6. Drag and drop BP_ToonPointLight to your level. Set up parameters:
   

   BP_ToonPointLight
   Intensity	Light color and shadow multiplier.
   Light Color	Color of direct lighting.
   Shadow Color	Color of indirect lighting.
   Position	The position of the light.
   Scale (radius)	The radius of lighting.
   Base Light Weight	How base directional light color affects meshes in this light. 0 means additive, 1 means override the base light.
   Base Shadow Weight	How base directional light shadow affects meshes in this light. 0 means override the base light direction 1 for no change.
   Scene	Will be updated automatically after adding light to the scene.

7. Drag and drop BP_ToonScene to your level.
8. Select BP_ToonScene and add Lights and Actors that should be managed by the lighting system.

Custom character interface

Sometimes there is no possibility to inherit example actors (BP_ToonStaticMesh, BP_ToonSkeletalMesh, ThirdPersonCharacter) that contains the implementation of dynamic lighting. Fortunately “Anime Toon Shading” is very extendable, you can modify your own character to be affected by dynamic Toon Shading lighting as well. It’s a bit complicated but believe me, I did everything I could to make it user-friendly.

1. Open Character blueprint. Add BP_ToonScene reference attribute to your actor. Variables->Add:
   • Variable Name Scene
   • Variable Type BP_ToonScene
2. Add a new component BP_ToonShadingComponent that will be used to communicate with the scene.
3. Add a new function Toon Shading that will be evaluated to update lighting on the object. Functions->Add.
   
4. Add ApplyShading evaluation for every mesh in pawn that should be affected by lighting. In this case, the character contains one Mesh.
   
5. Call function in the constructor to activate lighting on start.
   
6. Implement the ToonShading interface. Open Class Settings and add interface BI_Toon_Shading to list.
   
7. Call toon shading update on events BeginPlay and IToonShading
   

Remember! This modification creates dynamic material instances to communicate with the scene manager, you should use them instead of creating a new one. Custom character interface

External post-process

It’s a good practice to combine two types of toon shading systems for example by using “Anime Toon Shading” for characters and post-process material for the environment.

Post-process based toon shading should support excluding the shading materials that using “Anime Toon Shading”. Generally in this kind of problem full-screen mask tells the post-process shader where to live pixel is not changed. It can be implemented easily by using a custom depth stencil mask. This is a simple example of how to integrate this package with post-process material.

1. Set up your project to use the stencil buffer. This functionality is required because we need an additional buffer to mark pixels rendered by AnimToonShader.
   
2. Select mesh that is using “Anime Toon Shading” material and set stencil mask value:
   

   Remember: It is just an example configuration of the mask. If you already using custom depth stencil for outlines then you should reserve one bit for “Anime Toon Shading” masking.

3. Use MF_PostProcessMask material function as a mask on your post-process effect:
   

Outline shells

The outline effect for forward rendering can be realized by creating a second expanded mesh with front face culling (rendered from inside). “Anime Toon Shading” contains tricky material that can do it for you. You can find an example of this part of the documentation in Demo/Characters/ThirdPersonCharacter blueprint.

1. Duplicate mesh component in your character and rename to ‘Shell’.
2. Initialize Shell in construction script
   
3. You can add the attribute ShellColor to your blueprint or use MakeVector. The alpha value in this vector is responsible for the outline width.
4. The shell material supports the vertex color alpha multiplier. You can locally control the width of the shell by painting (alpha channel) on the vertex color of the mesh. It is a cool feature used in the current generation games.

Flat surfaces

Questions & Answers

SDF Robo Progress Bars is an advanced master material usable for creating a wide range of customized progress bars. Package contains over 50 predefined excellent styles easy to use for various types of games. Material supports advanced customization that covers most of the possible design requirements. Thanks to using SDF functions instead of huge textures all created progress bars always stay sharp, well aliased.

Features

• Two types of shape circle bar/rectangular bar. Fully callable and extendable for more shapes.
• Signed distance functions based rendering. The shape is generated from mathematical functions that give the quality of ‘Vectorized’ graphics without using huge resolution textures.
• Configurable for all resolutions.
• KISS – One mesh per bar.
• Can be mixed with SDF and standard textures.
• Rounded corners of shape colors patterns and progress bar showing.
• GPU friendly, one draw call per bar.
• 23 different example themes that can be adjusted to requirements.
• Unlimited user-defined themes can be created easily using the available properties.
• Multiple advanced effects of progress bar – burning/fade.
• Easy to integrate witch UMG.
• Supported reparenting of themes between different shapes.
• Flexible modification options, each bar presented in this package can be created directly from another.

Gallery

Release notes

Documentation

Showcase and material parameters

Creating a new bar

1. Select bar from group ExamplesSurface/ExamplesUmg. Find a bar that looks closest visual to effect that you would like to achieve (all bars share the same functionalities so can be modified one to another but it’s faster to start from some point).
   
2. Create duplicate or material instance from the selected bar.
3. Set the name for the newly created instance of material. It’s good practice to start name from MI_Surface or MI_Umg. Open material and modify parameters.
4. Modify the parameters of the new bar according to your requirements.

Basic types of bars

All bars used in the game should be created as Material Instance that derives from the build in types of materials. Multiple combinations of bars are possible based on bar shape and bar type. The base bar instance name is constructed according to the specified naming convention:

MI_ + BarType + BarShape + Bar

BarType – System is divided into two separate material instances that allow using this system on the surface meshes as well as on UMG widgets.

• Umg – material can be used on hud controls (widget elements).  
• Surface – material used on regular meshes (planes in 3d space). Check ExamplesSurface folder to see all examples prepared for surface bars. UseInterface switch set false (for optimization). 

BarShape – Allow to chose the basic method of bar visualization.

• Rect – classic rectangular bard that fills from on side to another.
• Circle – advanced bar that fills the circle.

Check ExamplesUmg, ExamplesSurface, ExamplesUmgCircle, ExamplesSurfaceCircle, folder to see all examples.

Using Robo Bars in UMG

1. First place the Image widget on the hud widget.
2. Then apply the progress bar material onto your image widget by setting the parameter Brush->Image as presented below:
3. Setup the material parameter called “Progress” in blueprint graph. You have to get dynamic material instance from the widget and set the parameter value.
   

4. Progress is a basic value parameter in the master material  in range between 0.0 (empty) and 1.0(fully filled) used for setting how much progress bar is filled.

Debug options override the behavior of progress bar by default to visualize the effect of changes in the preview. Find material that you used in your progress bar and disable the debug option by setting:
Progress->ProgressDebug = false

A simple example of using Robo Bars is presented in the demo (Demo/Blueprints/BP_Hud)

Signed Distance Fields

Signed Distance Field is an image where each pixel contains the distance to the nearest point on the boundary. An additional sign of distance allows determining if the pixel is inside or outside rendered shape. SDF image that looks like gradient can be loaded from a file or generated by mathematical functions called Signed Distance Functions.

One of the biggest benefits of using this method is very cheap and configurable antialiasing effect. The same method is used to render outlined/smooth high-quality fonts in Unreal Engine 4 based on low-resolution textures. 

Package SDF Robo Progress Bars uses this method to render all bars in multiple ways.

• drawing smooth outlines, shadows, edges
• configurable division on bars
• combining multiple shapes
• round corners using smooth min function

Master material parameters

The progress bar is divided into 4 basic layers that are combined into one using translucent blending. Each layer is configurable and implements some additional effects.

• Outline layer (white)
• Shape layer (black)
• Progress layer (red)
• Pattern layer (blue) 

Outline layer

The outline effect is very common in progress bars, it’s a great tool to highlight the shape or separate bar from the background to make it more readable. Outline layer is represented by the base shape. In final effect, it can be rendered as shape, filled background or stay invisible.

Shape layer

Shape layer is to describe the shape of the bar and it is represented by combined signed distance functions. Shape layer is always active.

Progress layer

Progress layer is used for drawing current progress (how much shape is filled by color/texture/effect).

Pattern layer

Pattern layer describes the scheme of a division the bar into two colors.

Layers antialiasing

Each layer of bar contains parameters designed especially to control antialiased and smooth edges. This functionality allows to set up hard or soft blending between lower and higher layer. 

From UMG to Surface

Sometimes there is a need to change Surface material into UMG to render on hud without loss of all parameters set in the material. This operation is well supported by UE4.

1. Open material that needs to be changed to support UMG/Surface mode,
2. Find option General->Parent and change to MI_Umg*Bar/MI_Surface*Bar depends on your needs.

Explanation of UE4 mechanism. There are two differences between UMG and Surface materials:

UMG does not support vertex interpolators so UseInterface needs to be set false in materials used in UMG. Surface allows for vertex interpolators so it is used as an optimization.

Questions & Answers

Fast Stylized Procedural Sky is a unique dynamic sky material and advanced weather system that is perfectly balanced between quality and efficiency. Designed and optimized specially for Mobile, Virtual Reality, and stylized PC/Console games.

Features

• GPU friendly works efficiently even on VR/Mobile. Unlit material without blending uses one draw call
• Over 60 parameters to customize
• Network replication supported
• Clouds lighting with scattering and shadows changes depending on sun position
• Clouds shadow casting, height fog, and static and dynamic skylight cubemaps
• Configurable sun and moon, lens effect, eclipse and stars scintillation
• Atmospheric sky gradient with tilting in sun direction
• Customizable automatic clouds UV calculation
• Moon normal-mapping and lighting calculated based on relative sun and moon position
• Time of day curves and advanced preset system
• Multilayered clouds
• Wind direction and clouds speed
• Smooth transitions between weather states based on preset system
• Landscape backgrounds interleaved with clouds, static clouds, and stars layer
• Skydome and skysphere mode
• The material is based on the new unpublished before method for fast calculation of procedural clouds lighting. You will not find this solution anywhere else!

Technical details

• Sky material  (ONLY 150 instructions! and ONLY 4 texture samplers used!)
• Directional light shadow material.
• 1 blueprint that uses material and implements time of day and preset system
• 1 static skylight cubemap recapture helper blueprint
• 1 Sky shadow material
• 3 Skydome and Skysphere meshes
• 10 tilled clouds textures 512×512 with encoded four depth traces on channels
• 1 Moon normal map texture 512×512
• 1 Background equirectangular texture 2048×1024 (R-stars, G-Background clouds, B-Distortion clouds)
• 8 Color curves for simulating the day and night on Earth
• 12 presets of weather (sunny, cloudy, foggy, snowy, smoky, stormy, clean, rainy, half sunny, gloomy, blizzard, overcast)
• 3 time of day presets
• 3 Landscape backgrounds textures 4096×1024 for skydome (depth encoded as alpha)
• 1 Landscape background textures 4096×2048 for skysphere (depth encoded as alpha)
• 4 example static cubemaps for default skylight

Showcase

Release notes

Documentation

Get started

The easiest way to start working with Fast Stylized Procedural Sky is to For start watching the tutorial that shows how to use basic parameters of the blueprint:

1. Unpack FastStylizedProceduralSky into Content in your project.  
2. Open project and you should see a FastStylizedProceduralSky package with the following content:
3. Drag & Drop BP_FastStylizedProceduralSky on your scene. (Remember to remove the old  sky that you used before on your scene you don’t need this anymore)
4. Select FastStylizedProceduralSky blueprint that you just put on the scene and set up lights in the external tab:
   

   Actors
   Sun Light	External directional light used for lighting from the sun. The system will automatically change the direction and color of this light during the time update.
   Moon Light	External directional light used for lighting from the moon. The system will automatically change the direction and color of this light during the time update.
   Sky Light	External skylight used for global lighting on the scene. System recapture during the update. The frequency of recapture can be changed by.
   Height Fog	External fog used for cover the scene by fog. System changes the color of fog based on time of day.

5. Press play and enjoy the show.

Remember! Only movable light can be changed by Fast Stylized Procedural Sky. 

Remember! Enable dynamic lighting (no lightmaps) in projects settings to fully exploit the  abilities of the time of day cycle.

Sky system

Fast Stylized Procedural Sky is divided into a few basic systems that can work in cooperation as well as in separation either systems can stay inactive for manual customization.

All default properties of Fast Stylized Procedural Sky blueprint are editable only if Weather Preset System and Time of Day System is disabled. Three steps are needed to disable both systems:

• (Time Of Day) Use Time Of Day Curves = false, 
• (Time Of Day)  Time Of Day Change Mode = BlueprintDefaults
• (Weather Preset) Weather Change Mode = BlueprintDefaults

From this time all default properties of the sky can be manually customized for specific weather and time of day conditions.

External data

External options in Fast Stylized Procedural Sky blueprint allows stylizing final result for wide range types of games.

Fast Stylized Procedural Sky supports casting shadows from the sun on the ground.

This effect is implemented based on Light Function material that unfortunately is not supported on mobile.

Time of Day system

The time of day system is responsible for the passage of time calculations celestial movement and sampling curves of colors over time-based on sun height.

Time of day system changes a number of parameters of the sky based on time of the day like sun color, clouds colors, fog colors etc. The system can be updated in two modes:

• curve system
• preset system

Both modes exclude each other to change between these modes use flag Use Time Of Day Curves. Here is the list of  parameters that can be controlled by each of the systems:

Time of day curves

List of all Time Of Day settings can be controlled by curves. The curve system is active only when Use Time Of Day Curves = true. All defined curves are sampled based on the sun height. Mapping from time to sun height:

If the curve is not defined in the Time Of Day system then sky uses the default parameters from the time of day preset.

A simple example that shows how to change the horizon color using the time of day system:

1. Find curve to change in sky blueprint: Blueprint->SkyLowerColorCurve
   
2. You can edit the existing C_SkyLowerColor or duplicate the curve and replace a value of the SkyLowerColorCurve parameter in the blueprint.

Time of day presets

Basically the preset is a collection of predefined Time Of Day parameters that can be loaded to the sky. The preset system allows interpolating between these parameters and load custom settings for specific conditions. Time of day presets library can be found in TimeOfDay directory there are three basic examples presets BloodyMidnight, BlueNight, Pinky.

Time of day preset system is active only when Use Time Of Day Curves = false.

There are multiple methods to activate preset in the project that can be defined in Change Mode:

Adding a new preset to the library

The library of time of day presets can be easily extended. Few steps are needed to create and customize a new preset:

1. Open Select TimeOfDay directory and preset that will be extended.
2. Click right and select the option Create Child Blueprint Class.
3. Set the name and attributes in default properties of the newly created class.
4. Now preset is ready to use. Add preset to Time Of Day preset List in Fast Stylized Procedural Sky blueprint and start using as described in the section dedicated using a standard library of preset.
5. There is no preset editor. Just edit preset settings in the blueprint on the scene. Results of your changes you will see in the scene preview. After preset is finished just copy preset settings group and paste to your preset class.

Preset settings are stored in structure so you can copy current settings of the sky to your new preset. Change in preview and then copy to preset – It is the easiest way to tweak parameters for preset. The other method to updating the presets is by modifying a preset that is set as “selected” and click “reload selected” after finishing the modifications to see the result.

Event-driven time

Fast Stylized Procedural Sky has external functions that allow controlling the time of day for example from the level blueprint.

Weather system

Fast Stylized Procedural Sky comes with a library of presets for different types of weather: cloudy, sunny, clean, rainy, stormy, foggy, overcast, half sunny, glowy, blizzard, stylized. Each preset is just a list of predefined parameters that will be loaded to the sky after activation. The preset system manages the weather preset selection and interpolation between them.

There are multiple methods to activate preset in the project that can be defined in Weather Change Mode:

Event-driven weather

Fast Stylized Procedural Sky system can be configured to changing presets by events from the game. There are a few functions that can be used for steering presets:

• Set Preset Change Mode – Allow to change mode and duration of preset that is used in modes other than Blueprint Default.
• Set Preset External – Sets the preset from the library. Transition duration is how long the weather will be in transition.
• Set Preset External – Sets the preset from the list of presets by index. Transition duration is how long the weather will be in transition.

Example:

Adding a new preset to the library

Sometimes the game requires unique conditions for the specific situation in the game. The library of presets is expandable and weather designers can create their own presets and share parameters with other users of the system. Each preset is defined as Blueprint Class that extends from WeatherPreset class.

Creating a preset:

1. Select preset that will be extended.
2. Click right and select the option Create Child Blueprint Class.
3. Set the name and attributes in default properties of the newly created class.
4. Now preset is ready to use. Add preset to Weather preset List in Fast Stylized Procedural Sky blueprint and start using as described in the section dedicated using a standard library of preset.
5. There is no preset editor. Just edit weather preset settings in the blueprint on the scene. Results of your changes you will see in the scene preview. After the preset is finished just copy the weather preset settings group and paste it to your preset class.

Lightning effect

Fast Stylized Procedural Sky supports new lightning system since update 2.1. The example of using a lightning system is presented in the demo map Demo/Maps/AnimeLightningMap.

Basically, the BP_LightningController actor is responsible for controlling attributes like lightning source location/rotation/area/frequency and update of sky settings. 

Step by step explained how to use BP_LightningController:

1. Place BP_LightningController on your map. 
2. Setup the location of the actor to location above the scene (X=0.000000,Y=0.000000,Z=50000.000000). The volume of the actor presents the area of the lightning effect.
3. Change the External Parameter Sky to BP_FastStylizedProceduralSky actor from your map.
4. Select BP_FastStylizedProceduralSky to find Sky Material and open. Switch the UseLightning value in the material to true.
5. Run the game I watch the lighting effect.

Lightning Activation

The BP_LightningController is automatically active on the map but can be activated by events as well.  Set the activation loops value to 0 to control the activation by yourself. Then use Activate and deactivate events in your game to run the effect during the storm.

Lightning Fast

Lightning Fast is powerful combination materials and blueprints that implement a wide range of realistic and stylized electricity effects this external package can be easily integrated with Fast Stylized Procedural Sky.

Only a few steps are needed to integrate Lightning Controller with lightning Bolt from Lightning Fast:

1. Drag and drop LightningFast/Blueprints/BP_LightningBolt blueprint n the scene where Lightning Controller works.
2. Scale the lightning bolt actor to be visible from a large distance: Try to use Scale (50,50,50)
3. Set Activation Loops in Lightning Bolt blueprint to 0. It will disable auto-activation and allow you to control the lighting effect using a controller.
4. Implement your lightning effect trigger by binding to OnActivated delegate from Lightning Controller.

   

After these few steps lightning bolt effect will be shown at location and rotation randomized in Lightning Controller just after the lightning activation.

Lightning Fast use case is just an example, you can play sound or even spawn other effects/particles using activation event.

Skylight update

The Skylight actor captures the distant parts of the scene and using result data to compute lighting.  This actor can be very well integrated with Fast Stylized Procedural Sky. There are two methods to update the sky during changing the weather and time:

Fast Stylized Procedural Sky allows configuring skylight update to minimalize the costs.

Using sky spheres

Fast Stylized Procedural Sky supports rendering on skydome as well as sky sphere. Skydome is set as the default option. It is required to do a few important steps to switch sky into Skysphere mode:

1. Switch material to sky sphere UV: Open SkyData/IM_DefaultSky  and change UseSkydomeUV = False.
2. Set the sky sphere mesh in the blueprint:

   Open BP_FastStylizedProceduralSky and find SkyMesh component.  
   Change StaticMesh=SM_Skysphere or SM_SkysphereFlat (Flat is deformed but looks better with height fog).

3.  Change world layer texture used on the sky to the sky sphere:
   Select BP_FastStylizedProceduralSky
   Change WorldLayerTexture=T_SkysphereMoon

Additional material effects

There are few features in Fast Stylized Procedural Sky that are disabled in default material. It is because not all users need these advanced options and hitches on efficiency are not good enough to enable all of them by default.

To change these parameters you can create your own instance of sky material from M_BaseSky as well as modify SkyData/IM_DefaultSky. Reference to sky material instance can be set in sky blueprint parameter: External->SkydomeMaterial.

Moon movement

Shading of the Moon is always calculated based on the position relative to the  Sun it is hard to set up at first but results are very realistic. This is automatic so there is no need to care about the direction of shading on the Moon. There are a few important parameters that allow setting the moon movement:

Questions & Answers