Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Knockout text templates #32

Open
fgraux opened this issue Jun 17, 2019 · 2 comments
Open

Knockout text templates #32

fgraux opened this issue Jun 17, 2019 · 2 comments
Labels
Section: Content Status: Solved

Comments

@fgraux
Copy link

fgraux commented Jun 17, 2019

Hi there
did anybody ever create a Knockout text template, wether using flash, html or photoshop producer?
Adobe flash/animate allows to create those while turning a shape into a Movie Clip, setting the blending mode of the newly created Movie Clip to Layer and creating another Movie Clip inside of the first one and setting the blending mode of this second Movie Clip to Erase. But casparCG doesn't recognize the double embedding of the text.

I also tried while using html template, but the css properties directly renders the effect while using the backgroud, which is not what we re looking for here.

The photoshop producer (which has desappeared in caspar 2.2, gloups!!!) does'nt render the mask effect properly.

If anyone has a brilliant idea ?
@niklaspandersson
Copy link
Member

In flash, you can simple use one display object as mask for another and in that way create a knockout effect. This can be done either in the Adobe Animate timeline or with code. When using dynamic textfield in flash, always make sure your fonts are embedded.

Another way is to use the native masking functionality in CasparCG and use one videolayer as mask for another. You can get the details in the wiki, under the MIXER KEYER section https://github.com/CasparCG/help/wiki/AMCP-Protocol#mixer-keyer

@hreinnbeck
Copy link

hreinnbeck commented Jun 18, 2019 •
edited
Loading

Here's one way, save this as knockout.html:

<html><head><style>
html, body {
	background: #000;
	width: 100vw;
	height: 100vh;
	padding: 0;
	margin: 0;
}
div {
	width: 100vw;
	height: 100vh;
	display: flex;
	justify-content: center;
	flex-direction: column;
	text-align: center;
}
h1 {
	font-size: 300px;
	color: rgba(255,0,0,1);
}
</style><body>
<div><h1>KNOCKOUT</h1></div>
</body></html>

Then run these commands:

CG 1-10 ADD 1 KNOCKOUT 1
PLAY 1-11 GO1080P25 LOOP
MIXER 1-10 KEYER 1

knockout

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Section: Content Status: Solved
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@hreinnbeck @niklaspandersson @mint-dewit @fgraux