Heart Ripple

In this tutorial, you'll learn how to use Material Graph to create a heart ripple effect.

How to Use This Template

Open Effect House, go to Templates, click the Screen tab, and select the Heart Ripple template.

Hierarchy

In the Hierarchy panel, there are two main render groups. The 2D Foreground Effects render group contains an editable Bloom Camera object, with two heart image options, rainbow and single color. The 2D Bloom Effects render group contains a 2D Camera object, with corresponding Bloom image.

Edit Bloom Effect

To tweak the bloom effect:

1. Select the Bloom Camera [EDIT BLOOM] object under the 2D Foreground Effects render group in the Hierarchy panel
2. Go to the Inspector panel
3. Navigate to the Post Process section
4. Tweak the Bloom parameters to your desired specifications

Modify Materials

This effect uses Material Editor to generate a heart ripple effect.

There are two materials for you to choose from: RainbowHeart_Mat and SingleColorHeart_Mat.

RainbowHeart_Mat

To customize the rainbow heart material,

1. Go to the Assets panel
2. Select the RainbowHeart_Mat [EDIT] material
3. Head to the Inspector panel
4. Customize the Material Properties. The available properties are:

Base Property

Property	Description
Saturation	Controls the saturation of the rainbow color
Opacity	Controls the opacity of the rainbow color
Opacity Range	Controls the opacity range throughout the whole screen. Lower value will result in more fade out.
Color Loop	How frequently the rainbow color will repeat among the heart ripples. Increasing this value will make the heart ripple more colorful.

Transform

Property	Description
Pos	Controls the heart ripple position on the screen
Scale	Controls the scale of the whole heart ripple effect
Density	When the scale is fixed, increasing the value will create more layers
Stroke Weight	Controls the thickness of the heart ripple lines
Edge Blur	Controls the blur of the heart ripple lines
Depth Refactor	Increasing this value will create more depth impact on the heart ripple
Speed	Controls how fast the heart ripple moves

SingleColorHeart_Mat

To customize the single color heart material,

1. Go to the Assets panel
2. Select the SingleColorHeart_Mat [EDIT] material
3. Head to the Inspector panel
4. Customize the Material Properties. The available properties are:

Base Property

Property	Description
Base Color	Controls the color of the heart ripple
Opacity	Controls the opacity of the color
Opacity Range	Controls the opacity range throughout the whole screen. Lower value will result in more fade out.

Transform

Property	Description
Pos	Controls the heart ripple position on the screen
Scale	Controls the scale of the whole heart ripple effect
Density	When the scale is fixed, increasing the value will create more layers
Stroke Weight	Controls the thickness of the heart ripple lines
Edge Blur	Controls the blur of the heart ripple lines
Depth Refactor	Increasing this value will create more depth impact on the heart ripple
Speed	Controls how fast the heart ripple moves