Samples of various VFX and technical asset recreations.

The samples below are based on a “style transfer” workflow where:

  • A reference work is analyzed for art style, rendering style, and technical features for implementation

  • The specific effect or asset is recreated

  • The process is documented to demonstrate the results are deliberate, intentional, and repeatable across a wide range of styles

Risk of rain 2:

Blue portal

Context Analysis:

  • Risk of Rain 2 (RoR2) has a portals that allows players to move from level to level

  • Portals are few in number

    • -> Performance/Optimization is lower concern

  • Portals have different variations that slightly differ in color, style, and construction

    • -> Easy parametric construction was likely desirable

  • RoR2 has a cell shaded lighting/rendering style

    • -> High technical flexibility

  • RoR2 makes subtle use of the post-processing stack, specifically a bloom effect

    • -> HDR colors can drive glow

  • RoR2 does not use any volumetric fog

    • -> Point light source can be used for a light source without breaking illusion of GI-affecting emissive portal materials

Asset Analysis:

  • Portal asset is made up of multiple meshes (which is visible when viewed in profile), the aperture (middle portal), and the border

  • The border has the appearance of depth, which could either be achieved with a billboarded line mesh, or using stacking and vertex deformation, or both

  • The behavior of the portal’s waves seems to be driven by procedural noise with the border’s noise pattern rotating and the aperture’s panning upward like a flame

  • The use of noise means that same data could be used to drive shader behaviors like clipping, transparency, color ramping (interpolation), and deformations

  • The portals also have a particle emitter, and the movement suggests velocity based damping and some sort of secondary particle force after initial emission

  • The glowing behavior could be replicated using HDR values as an input into post-processing-based bloom effects

Construction Step 1: Portal Border Mesh

  • Create custom tool to construct shapes in Line Renderer

    • Allows for circles and ellipses, but other shapes could be easily added

    • Allows for tuning of path point count for tuning and optimization

  • Configure Line Renderer to create loop, and apply billboard to camera

  • Adjust other parameters like thickness, spatial reference frame, etc.

Construction Step 2: Portal Border Shader - Clipping

  • Construct noise based opacity clipping behavior using world space vertex position

    • Vertex or fragment position could have been interchanged

    • UV coordinates not used to prevent side-by-side portals looking identical and to allow for subtle differentiation between portal border stacks

  • Used path UV to create soft falloff near path edges (feathering)

    • Edges intended to make clipping near periphery more pronounced and to help boost border contiguity through clipping effect

  • After combining the two, testing and tuning revealed that a usable shape could be created

Construction Step 3: Portal Border Shader - Albedo Ramping

  • Internal and external color interpolation was driven using the edge feathering and noise data as a mask

  • A simple linear tuning parameter was added to allow for the tuning of the “thickness” of the outer color region

  • Additionally, the same mask was used to drive opacity to permit feathering near the border edges

  • The albedo, opacity, and opacity clipping effects were all applied, tuned, and tested for suitability

Construction Step 4: Border Shader - Finishing Touches

  • A second noise octave was applied

  • Tuning controls to adjust between the independent octaves were added

  • Additional tuning parameters were added to account for control over explicit control over previous static values like feathering width, feathering intensity, etc.

Construction Step 5: Aperture Construction

  • Since the aperture was static, a simple quad was used

  • The border shader was modified to create a variant

  • The variant:

    • Had vertically panning noise instead of rotating

    • Replaced the edge feathering for a texture input so a circular standard particle texture could be used as a round reference with a soft falloff instead

  • After changing colors, tuning, and testing, a similar effect to the original was achieved

  • The final asset had a point light and particle emitter added