# Source Blending Modes



## jw0z (Sep 21, 2021)

Hi All,

I've had an attempt at implementing blending modes for sources, which has been previously requested in these two threads:





						Blend modes for sources
					

I searched around the web and these forums a bit but couldn't find any mentions of this. Seems like something that might've been mentioned or requested before, but I don't see anything.  For anyone who uses Photoshop, blend modes will probably be familiar. The wikipedia page for it explains it...




					obsproject.com
				











						Add blend modes for dynamic sources · OBS Studio Ideas and Suggestions
					

Adding this option will give a lot of new creative possibilities to OBS users. Although such an option already exists as an Image Mask Filter (it has




					ideas.obsproject.com
				




I've implemented it in a way that makes use of the existing blending state set up for compositing a source texture onto the scene, so unfortunately it's not a 'plugin', but is effectively 'free' from a performance point of view (for sources that were already being rendered to their own texture). As such, I was somewhat limited to implementing blending modes which are representable by specific combinations of src/dst blend factors & blend ops - the list of implemented blending modes is:

Normal
Additive
Subtractive
Screen
Multiply
Lighten
Darken (works incorrectly for transparent images - but a workaround could be to re-export the transparent image with a white background.)
I've skipped some of the more esoteric ones that are possible with the blend factors / blend ops, such as difference/reverse-subtract and divide, but I can add them if they are of use to anyone. Some of the more complex blending modes such as 'soft-light', 'hard-light', and 'overlay', could only be implemented if this feature were to be implemented as a final shader pass on the source (similar to how scale filtering is handled currently?)

Here are some examples (for comparison to the blending modes defined here: https://www.w3.org/TR/compositing/#blendingseparable):



So far I've only tested this on macOS, so I've been unable to test the d3d11 changes I've made. If anyone is willing to test, then I've put the changes here:
https://github.com/jw0z96/obs-studio/tree/source-blending-modes

If anyone has any advice for how these changes could be implemented as a plugin, rather than as changes to obs-studio's rendering backend, then I'm open to suggestions :)

Thanks!


----------



## Archon816 (Sep 26, 2021)

Hello! I'm new user, but i really need this functionality :D How can I test it on windows?


----------



## jw0z (Sep 26, 2021)

Archon816 said:


> Hello! I'm new user, but i really need this functionality :D How can I test it on windows?



Hello!

Unfortunately, since this is not a plugin, you'll need to recompile obs-studio from source - the instructions for doing so are here: https://github.com/obsproject/obs-studio/wiki/Install-Instructions#windows-build-directions

You'll also need to make sure you compile from the fork & branch I've listed in the original post - you can do this by replacing the `git clone` step with:
git clone --recursive https://github.com/jw0z96/obs-studio.git

...and then checkout the branch with:
git checkout source-blending-modes

Please note that I've not tested these changes on Windows, as I don't have access to a d3d11 capable machine currently.

Good luck!


----------



## Archon816 (Sep 28, 2021)

jw0z said:


> Hello!
> 
> Unfortunately, since this is not a plugin, you'll need to recompile obs-studio from source - the instructions for doing so are here: https://github.com/obsproject/obs-studio/wiki/Install-Instructions#windows-build-directions
> 
> ...


Hmm, can someone do it for me?


----------



## tripletopper (Oct 13, 2021)

Hello.  I got brought here because I suggested ideas that would help make Anaglyph 3D easier.

Am I correct to assume that if I use a screen blending mode or additive blending mode that any pixel where red plus Cyan are together in the same physical space in an overlay would result in white?  Because if it is, then that's exactly what I want.  I got a black and red video as the left eye and a black and cyan video as the right eye.

Is that a setting on obs currently for the current obs?

By the way you said it works on Macintosh versions which I just so happen to have.

May I have instructions on how to "turn on" screen blend mode / additive blend mode on OBS for Mac?

By the way, do you know of a cheap VGA "screen blend curcuit" which takes 2 very slightly out of sync eyes and syncs then live (with a less than 1ms delay, I'm planning on streaming Virtual Boy, and the closest I got is with a passive Y cable of one screen slightly scrolling while the other is stable.

I don't have much money, and my video starts in VGA, which I though would be easiest to blend the red of left with the green and blue of the right.  What should I search for on Ebay?


----------



## jw0z (Oct 13, 2021)

tripletopper said:


> Hello.  I got brought here because I suggested ideas that would help make Anaglyph 3D easier.
> 
> Am I correct to assume that if I use a screen blending mode or additive blending mode that any pixel where red plus Cyan are together in the same physical space in an overlay would result in white?  Because if it is, then that's exactly what I want.  I got a black and red video as the left eye and a black and cyan video as the right eye.
> 
> ...



Yes - with an additive blending mode, the red and cyan pixels in your scenario would equal white once blended. (Red (1,0,0) + Cyan (0,1,1) = White (1,1,1))

Since this is not a plugin, you'll need to recompile OBS from source in order to test the changes I've implemented - a guide on doing so is here: https://github.com/obsproject/obs-studio/wiki/Install-Instructions#macos-build-directions

...and as above, you'll need to recompile from the branch with my changes:
git clone --recursive https://github.com/jw0z96/obs-studio.git;
git checkout source-blending-modes

If you've not compiled software from source before, this may be more effort than it's worth, but good luck! Perhaps if this feature is deemed useful enough / suitable for integrating into OBS, I could submit a pull request.


----------



## ReadyPlayerEmma (Oct 23, 2021)

Can I help fund an effort to get this merged into the main project? It would be great to have this feature!


----------



## jw0z (Oct 24, 2021)

ReadyPlayerEmma said:


> Can I help fund an effort to get this merged into the main project? It would be great to have this feature!


I've just cleaned up these changes and have raised a pull request here


----------



## Mario Mey (Oct 25, 2021)

I will try this branch. But, as I compile OBS, I had to do:


```
mkdir obs-studio-source-blending-modes
cd obs-studio-source-blending-modes
git clone --recursive https://github.com/jw0z96/obs-studio.git .
git checkout source-blending-modes
```

The point at the end of "git clone" is important.


----------



## jw0z (Oct 25, 2021)

Mario Mey said:


> I will try this branch. But, as I compile OBS, I had to do:
> 
> 
> ```
> ...


Hey - there are prebuilt binaries available on the pull request: https://github.com/obsproject/obs-studio/pull/5448#issuecomment-950413459

(I'll remove the instructions as they're incorrect, and that branch is out of date)


----------



## Mario Mey (Oct 26, 2021)

Thanks to WizardCM for those builts... but I'm on Linux, as you, @jw0z .
Oh, I had not find this patch as a PR. Now, I'll install it as a PR. I'll tell you later how it was.


----------



## Mario Mey (Oct 26, 2021)

Yap, done. I installed PR and built. Everything works fine! (for the moment)

I was thinking... as you wrote this PR, then you may know how to make some kind of "Additive transition", as Premiere has. I don't use Premiere, but I remember that there it is and it is nice. You can check it in https://www.youtube.com/watch?v=YuAWStHSR7I. I don't really know how it works, but maybe it is a double transition: the base one (Normal blending) and some kind of curve that rise and goes down of the second video with Add blending. I tried to reproduce it in Blender and I got this:




First, fire (B-video) appears with ADD blending and then the A-video starts fading to B-video.

As you can see, "CROSS" is "Normal" blending. Look at the curves. *Everything is unaccurate*, huh... I didn't make any math. I tried not to go beyond limits (when ADD layer is at its max +-80%, CROSS layer is at +-20%).

[EDIT]: I rendered this transition in Blender:








						additive blending0001 0444
					






					www.youtube.com


----------



## jw0z (Oct 26, 2021)

Mario Mey said:


> Yap, done. I installed PR and built. Everything works fine! (for the moment)
> 
> I was thinking... as you wrote this PR, then you may know how to make some kind of "Additive transition", as Premiere has. I don't use Premiere, but I remember that there it is and it is nice. You can check it in https://www.youtube.com/watch?v=YuAWStHSR7I. I don't really know how it works, but maybe it is a double transition: the base one (Normal blending) and some kind of curve that rise and goes down of the second video with Add blending. I tried to reproduce it in Blender and I got this:
> View attachment 76491
> ...



I think it should be relatively simple to add an "additive dissolve" as a transition plugin, but that's outside the scope of my changes. Take a look at obs-studio/plugins/obs-transitions/transition-fade.c for the regular fade - it should be possible to modify it's shader to achieve the effect you want.


----------



## tripletopper (Oct 28, 2021)

jw0z said:


> Yes - with an additive blending mode, the red and cyan pixels in your scenario would equal white once blended. (Red (1,0,0) + Cyan (0,1,1) = White (1,1,1))
> 
> Since this is not a plugin, you'll need to recompile OBS from source in order to test the changes I've implemented - a guide on doing so is here: https://github.com/obsproject/obs-studio/wiki/Install-Instructions#macos-build-directions
> 
> ...



I read somewhere that this mode currently does work on the Macintosh version of the latest OBS revision.  If so that should be the easiest way to go.  I don't know how to use it though.  If it's already there may have instructions on how to access it?


Otherwise is there a way I can have two versions of OBS one that's more battle tested for most things and one that's more experimental for my anaglyph project?

By the way I don't know how to do compiling of anything or how to use terminal mode.  I know how to get there but I don't do anything without professionals help cuz everyone says you should not touch terminal mode unless you know what you're doing.


----------



## tripletopper (Oct 28, 2021)

Tho





jw0z said:


> Yes - with an additive blending mode, the red and cyan pixels in your scenario would equal white once blended. (Red (1,0,0) + Cyan (0,1,1) = White (1,1,1))
> 
> Since this is not a plugin, you'll need to recompile OBS from source in order to test the changes I've implemented - a guide on doing so is here: https://github.com/obsproject/obs-studio/wiki/Install-Instructions#macos-build-directions
> 
> ...


My brother said Dune would be heavy reading.  Frankly these instructions make Dune look like Dr Seuss.  And yes I understand there's a different mentality in reading fiction vs coding instructions.  I feel like Doug Funnie reading "A Critique of 'Pure Reason' ."


----------



## jw0z (Oct 28, 2021)

tripletopper said:


> I read somewhere that this mode currently does work on the Macintosh version of the latest OBS revision.  If so that should be the easiest way to go.  I don't know how to use it though.  If it's already there may have instructions on how to access it?
> 
> 
> Otherwise is there a way I can have two versions of OBS one that's more battle tested for most things and one that's more experimental for my anaglyph project?
> ...



This should work fine on macOS - I've developed these changes on macOS (11.6) based on OBS 27.1(?), and it has been tested by others on both Windows & Linux.

Prebuilt versions of OBS that include this change are now available here:
macOS
Windows x64
Windows x86
Linux (Flatpak)
Linux (deb)


----------



## Mario Mey (Oct 28, 2021)

jw0z said:


> I think it should be relatively simple to add an "additive dissolve" as a transition plugin, but that's outside the scope of my changes. Take a look at obs-studio/plugins/obs-transitions/transition-fade.c for the regular fade - it should be possible to modify it's shader to achieve the effect you want.



I found out that the file is already in OBS compiled path, here: data/obs-plugins/obs-transitions/fade_transition.effect and if you change it, you modify it, you change the transition effect . Here is the new magic: where it says:

```
float4 PSFade(VertData v_in) : TARGET
{
    float4 a_val = tex_a.Sample(textureSampler, v_in.uv);
    float4 b_val = tex_b.Sample(textureSampler, v_in.uv);
    float4 rgba = lerp(a_val, b_val, fade_val);
    rgba.rgb = srgb_nonlinear_to_linear(rgba.rgb);
    return rgba;
}
```
Modified:

```
float4 PSFade(VertData v_in) : TARGET
{
    float4 a_val = tex_a.Sample(textureSampler, v_in.uv);
    float4 b_val = tex_b.Sample(textureSampler, v_in.uv);
    // Modified line (cuadratic ecuation)
    float4 rgba = lerp(a_val, b_val, fade_val * fade_val);
    rgba.rgb = srgb_nonlinear_to_linear(rgba.rgb);
   
    // Abreviation and the function
    float f = 2 * fade_val - 1;
    float fade_val_add = - 0.8 * ( f * f - 1 );
    // Creation of a vec4
    float4 b_val_f4 = vec4(b_val.rgb, 1);
    // Transformation to linear
    b_val_f4.rgb = srgb_nonlinear_to_linear(b_val_f4.rgb);
    // The addition
    rgba = vec4(rgba + b_val_f4 * fade_val_add);

    return rgba;
}
```

With help of a online functions/graphics calculator, I use these 2 functions: red for the mix, blue for the new addition.





And here is how it works:





Now, I think there's more to change to have another fade transition. Here, I think I have to change some C code and compile it.


----------



## Suslik V (Jun 5, 2022)

I filled issue about mentioned Darken blending behavior (transparency turns solid black):








						Blending mode Darken makes transparency solid black · Issue #6591 · obsproject/obs-studio
					

Operating System Info Other Other OS Any OS OBS Studio Version Git OBS Studio Version (Other) 29782cd OBS Studio Log URL about:blank OBS Studio Crash Log URL No response Expected Behavior Blending ...




					github.com


----------



## tripletopper (Jun 9, 2022)

I just wanted to tell you that the additive option is working great for red and cyan anaglyphs.  

Also I got a question about twitch and using a capture direct broadcast app.  I have a program called USB Dual Camera Pro App.  And it seems like there's a way I could broadcast just my direct camera feed straight to Twitch as a 3D stereo broadcast.  They have something called rtmp servers that you can use and I don't know the exact syntax of how to make it work.

I know you need an rtmp server name and a twitch username and a twitch user key which I assume authorizes your use.


----------

