Forum Discussion

JohnJohnson-6a8's avatar
JohnJohnson-6a8
Community Member
25 days ago
Solved

Apply Multiply blend mode to video?

I have a feeling the answer is, "no," but thought I'd ask.

I am working on a fire safety course. In one scene, we tell the learner that a fire can double in size every  minute. My graphic elements are: a still photo of an office room, and a video of flames. The flames were rendered in a black environment, which blocks the image of the room.

I'm hoping to set the video to "Multiply" to enable the room photo to be seen through the flames - which, in rt, are transparent anyway.

Does Storyline enable video to have the blend mode multiply applied to it?

Thank you in advance!

  • Nathan_Hilliard's avatar
    Nathan_Hilliard
    25 days ago

    You could try Davinci Resolve. Even the free version provides access to the chroma-key effect with control over strength. It can also be applied as multiple filters which might give better results on your video. 

    If you remove the black but it leaves flames that are too transparent, you could always re-render an output video by stacking multiple copies of the your keyed version in Resolve or Premiere, making them appear more opaque.

  • Thank you for the idea, Nathan. Unfortunately, I can not share any of what I'm working on..proprietary, plus liability reasons.

     

    😉

  • Possibly with some JS. Any chance you can share the media files so I could experiment? 

     

    • Nathan_Hilliard's avatar
      Nathan_Hilliard
      Community Member

      OK. If I understand, you have an image of a room and a video of flames rendered over a solid black background. Essentially, you want the black (and potentially, the flames) made transparent so the room is visible. Correct?

      You might be able to do something like that on the fly with svg filters and masking. I made a post about that a little while ago that demostrated some potential uses, including some video elements. You could get some ideas there.

      Another, probably easier approach would be to have your flame video re-rendered as a transparent video (either from go, or chroma-key the black, which would definitely leave the flames somewhat transparent). Since SL doesn't support transparent video directly, you could swap out the sources at runtime, replacing the original with the transparent version. Overlay that onto your room image. I made another post about that here

      If I get a chance to mock-up something simple this weekend with some stock media, I'll post it here.

      • Nathan_Hilliard's avatar
        Nathan_Hilliard
        Community Member

        Have a look at this example project. It uses an SVG filter to key out the black in the video on the fly. Starts with the original video. Click the button to key out the black. I think it works quite well.

        https://360.articulate.com/review/content/d71dcc95-f970-4a66-ac09-2353d62d6265/review

        Essentially, assemble your scene, with the video over the room image. Set a variable called tag with the accesibility text from the video in the timeline. Run the script.

        It looks for the video, builds a custom SVG container that includes the filter, inserts the original video, and then inserts the SVG where the video used to be. The filter is applied and the black is now transparent.

        Pretty sraightforward.

        You can consult the reference links (top of script) and tweak the filter settings if desired. Try increasing the value 3 in the following line to something like 15 to see the difference in the flames.

        filterName.setAttribute("values", "1 0 0 0 0   0 1 0 0 0   0 0 1 0 0  3 -1 -1 0 0");