"Animating" emissive texture elements discretely - how ?

[motorsep]

Basically I am after doing something like this:

https://s28.postimg.org/npuz89aa5/fillable_material_elements.png

Imagine symbols (runes) on the walls / rocks, or elevator floor indicator, or sci-fi power panels, etc. When triggered / activated, timeline (or somehow else) would “drive” those lit elements to be revealed one by one, either discretely or continuously.

For example:

(this isn’t my concept art, found it on Pinterest)

imagine that the bottom strip would fill up (or drain down) continuously and then top lights will turn on (or off) row by row. Those “glowing” elements can be either separate meshes with unlit material with emissive texture (and aligned close to the surface of the pylon) or can be just drawn on the main diffuse/base texture as unlit and material would have emissive texture. Whichever way is less performance taxing (I need this for mobile) and most suitable for the task.

How can I achieve that kind of “animation” of glowing elements?

Thanks

P.S. This is something I’d like to achieve (without using flipbook):

Knight Rider Scanner Light LED ebay

[redbox]

there is material function called ValueStep, check it.
This “stepping” technique used for similar effects.
The meaning of it, that you can create texture mask with areas filled with some different scalar values, and draw this areas one by one.
In your case it may be 0.1 for 1st rune, 0.2 for 2nd and so on.
Then using some growing 0 to 1 animated value (like frac of time) and If node, you can compare current growing value with that texture mask and output 0 if value < mask and 1 if value >= mask.

[motorsep]

@redbox;697975

there is material function called ValueStep, check it.
This “stepping” technique used for similar effects.
The meaning of it, that you can create texture mask with areas filled with some different scalar values, and draw this areas one by one.
In your case it may be 0.1 for 1st rune, 0.2 for 2nd and so on.
Then using some growing 0 to 1 animated value (like frac of time) and If node, you can compare current growing value with that texture mask and output 0 if value < mask and 1 if value >= mask.

I just added a video at the end of my post. Would ValueStep function work for this case ?

[redbox]

this function works exactly like you show on first picture.

to get behavior like on video you need additional instructions, like moving mask multiplied on stepping function

[motorsep]

@<a href=“https://forums.unrealengine.com/member.php?u=754” target=“_blank”>redbox</a>

I am trying to get smooth filling of the bars first. Here is what I am getting and I’ve had these issues when using transparency way back then (uneven rate of “filling” the bars; sharp/torn edges instead of smooth gradient of the mask):

2017 04 26 20 03 08

Any idea how to fix those issues ? Thanks

EDIT: and here goes Value Step - same exact look as IF node:

2017 04 26 21 55 34

[redbox]

As I said, value step takes value and compares it with mask.
there are steps on your video, but you use gradient, so it stepping by one pixel.

The meaning of it, that you can create texture mask with areas filled with some different scalar values, and draw this areas one by one.
In your case it may be 0.1 for 1st rune, 0.2 for 2nd and so on.

Use one value for all area.

[motorsep]

@redbox

I see. Unfortunately that doesn’t work for my case

This is what I came up with for now (I am driving it with Time for the purpose of the video):

2017 04 27 11 11 52

[motorsep]

Final product (WiP):

com Supranormal GVR PhC Titan 05 20170427 171655

[Deathrey (DeathreyCG)]

I see. Unfortunately that doesn’t work for my case

There is nothing special enough about your case. The method redbox mentioned gives you the result you want.

[motorsep]

@Deathrey;700917

There is nothing special enough about your case. The method redbox mentioned gives you the result you want.

https://i.gyazo.com/ad3087fe6eb991a162e0ee05c4508cd6.gif

Except it does not - I have smooth gradient (glare/halo) on the mask. “IF” method butchers it. Also “IF” node creates non-linear transition - it starts off fast and the closer it gets to the end of the range the slower it fills in.

[Deathrey (DeathreyCG)]

Except it does not

It does.

I have smooth gradient (glare/halo) on the mask. “IF” method butchers it.

Nothing stops you from multiplying the result by your mask.

Also “IF” node creates non-linear transition - it starts off fast and the closer it gets to the end of the range the slower it fills in.

Nah, each step takes the same time.

If you are using texture, this effect can occur due to texture being in sRGB rather than linear color.
You do not even need to use a texture to create unique value for each cell. You have a perfect candiate for this- your UVs. Even If your unwraps do not leave you an option, you still have world space Z position. This is enough to create a stepping gradient for all cells.

[motorsep]

@Deathrey;700947

It does.

Nothing stops you from multiplying the result by your mask.

https://i.gyazo.com/605d5e724da3277c06f2333d438d02b9.gif

Look my video please - I show my setup and I am multiplying and it get torn up sharp edges instead of smooth gradients. If I am doing something wrong, somehow no one cares to correct me.

@Deathrey;700947

If you are using texture, this effect can occur due to texture being in sRGB rather than linear color.

Hmm… I use GIMP to create and save my textures. I am not sure if it supports linear colors.

@Deathrey;700947

You do not even need to use a texture to create unique value for each cell. You have a perfect candiate for this- your UVs. Even If your unwraps do not leave you an option, you still have world space Z position. This is enough to create a stepping gradient for all cells.

This is really over my head, sorry I guess I’ll just stick with the method I came up with.

[Deathrey (DeathreyCG)]

This is really over my head, sorry :

In the essence it as simple as this:

http://image.prntscr.com/image/b3c3c70013eb4575aabb4315feb8f2f3.png

imagine that the bottom strip would fill up (or drain down) continuously and then top lights will turn on (or off) row by row.

Reference effect is easily reproducible with this approach.

[anonymous_user_8336d162]

@Deathrey;701108

Reference effect is easily reproducible with this approach.

Great work!

Can you please describe what are nodes ‘frac’
and ‘sin’ used for?

[motorsep]

Thanks @Deathrey

Although it does look quite complex to me (programmer’s approach vs artist approach). I’ll test it out!