How to make glow shader to mimic the Car led's animation happening nowadays

Questions
1

So here’s the example https://youtu.be/uT2drw7r61w?si=aRSDQXf4I0DxjutI in this you can see how led have an animation, How can I achieve this?

2

Glow material with a mask, input variable that could be animated. Since what you require is linear it shouldn’t be too difficult. You can animate UV offset/percent of masking. Note it would be best to make sure your UV is linear/not stretched so you can accurately change your animation curve to suit.

Have a look at the bottom of the page for the guide on a custom glow node material.

https://doc.babylonjs.com/features/featuresDeepDive/mesh/glowLayer

3

One of the simplest examples with animated texture offset - https://playground.babylonjs.com/#YCY2IL#1935
One may find more snippets searching the forum for “animate UV” or “animate texture”.

5 Likes
4

I thought only one can do this by shaders, attaching a mesh on which i want to mimic this.
MEsh.zip (12.7 KB)
is it still possible to do this via your method?

5

Could use your some help @sebavan

6

Can i similarly move the glow layer? also

7

You simply need to have some emissive areas in your glb.

An emissive material is enough to activate the glow layer.

1 Like
8

Ive done a lot of glow effects and animation lately. As stated above, you just need to have something emissive.
If you want stuff to move/blink like above take a look at this helper function. For the target you can pass in anything eg: yourmaterial.emissive or another you want . Its a super cool little helper.

https://doc.babylonjs.com/typedoc/classes/BABYLON.Animation#CreateAndStartAnimation

https://doc.babylonjs.com/features/featuresDeepDive/animation/advanced_animations

1 Like
9

Thank you guys, here’s the playground https://playground.babylonjs.com/#YCY2IL#1981

1 Like
10

In rectangle plane it’s easy to know the the coordinates which need to be changed, so if a mesh is curved sometime i would be required to change wangle or might some combination, is there some easier way to do this?

11

w won t work here it is only for 3d textures.

12

i have some doubts how these texture offset and uscale,wang works. Right now i am doing hit and trial,


would be great if you could share some material for this or maybe a playground

13

It is all model dependent so nothing really shareable without the particular model and It heavily depends how it has been authored.

1 Like
14

curved mesh does not mean curved UV alignment. Also , normally this is handled with more than one UV set. So the emissive/albedo color UV island would be axis aligned, probably using the full bound range of the X or Y - 0-1 , or 50% range 0-0.5( for easy repeat animation cycles ), and would probably have stretching , which doesnt matter because its filled with a flat color texture.

Any other channels using detailing would be using another UV set , that is not bound , axis aligned or stretched.

Then animating the texture simply requires translating the Axis aligned UV set along a single axis , like the x or y.