Can we use a black and white video as the alpha channel for a material exported through Needle?

Same as title here, I see usually the Unity transparent materials use alpha from the base RGB map channel

Original Post on Discord

by user 103054507105067008

Theoretically yes, problem is that in browsers transparent video isn’t universally supported

So the recommendation for now is to have e.g. a side-by-side or over-under video where you have color and black/white info separated, if you want good cross-platform support.

Other than that, if your video has an alpha channel and your browser supports that this will “just work”

In this case I’m trying to use a black and white video for the alpha, the color of the material just needs to be a plain colour we can set (no texture map)

by user 103054507105067008

But I am also going to try using a .webm video with alpha to see if I can save myself the hassle of doing that as I know .webm alpha videos work on ‘most’ devices

by user 103054507105067008

I see, yeah then you can just use a simple script to assign your black/white texture to .alphaMap of the material in three (instead of .map)

.webm+alpha most notably is not supported on Quest, if you don’t care about that for this project then it’s a good option

Done it :slightly_smiling_face: using a black and white texture that is assigned as the alphamap on the MeshBasicMaterial, I then set the main map slot to null, you can use colour or a different texture for the albedo then. Saves on hefty .webm video sizes for this use case

by user 103054507105067008

by user 103054507105067008

nice
can you remove the comment sections / update method from the code sample for brevity?

All sorted, just wanted to share as I see others asking about alpha videos in Three.js, this might help with platform compatibility over webm
AlphaVideo.ts

by user 103054507105067008