FORUMS: list search recent posts

How to make my own "live spokesperson" with transparent background and add to my website?

COW Forums : Apple Final Cut Pro Legacy

<< PREVIOUS   •   FAQ   •   VIEW ALL   •   PRINT   •   NEXT >>
Jonathan Carroll
How to make my own "live spokesperson" with transparent background and add to my website?
on Sep 21, 2011 at 9:30:06 pm

First off, visit http://www.openvision.com/Services/Video-Production/default.aspx if you don't know what I'm talking about. The girl that comes on in the bottom right corner is what I'm trying to do.

I'm kind of new at this, in that I don't know the lingo, so I'm just going to describe what I've done and what I need help with in simple terms.

I filmed myself in front of a green screen and used the Chroma Keyer setting in Final Cut Pro 7. I wasn't sure how to make a transparent background (I think it's called alpha channel? Maybe?) and I don't remember what I did but to test my video, I moved it above another clip in the timeline and the transparent background was working. So I figured it was ready to export.

*I made the mistake of rendering before exporting, which some forums say not to do and some say to do it. I exported using Animation and Millions of Colors +. Now with my .mov file, I opened Adobe Media Encoder to convert the .mov to .flv format--and before starting I went under Settings>Video>Checked encode alpha background or whatever it was. Once it was finished, I opened the .flv in Flash because that's where I was told to get rid of the actual video frame. This is where I got lost. An error message came up saying "code.netstream.play.streamnotfound". I am completely unfamiliar with flash. If I don't even have to use flash, that would be awesome. But if there is anyone willing to help me, I need step by step instructions please.

I'm wanting to put this video on my website. I have website done in iWeb so if there's a way to put the video there, that'd be awesome. If not I also have an account with trendyflash.com which is, obviously, flash based so I'm sure it'd work there. Any help would be greatly appreciated.

Thanks!

Jon

(Oh, and I've also tried this in Final Cut Pro X but I couldn't find the alpha whatever to save my life. If you know how to do it in FCPX then I would actually prefer that cause the chroma keying works better!)


Return to posts index

Jeff Meyer
Re: How to make my own "live spokesperson" with transparent background and add to my website?
on Sep 22, 2011 at 5:44:48 am

I can't give you a clear answer - you'll need someone with a more extensive web development experience than I can offer. That said I may be able to clear you up on a few questions you have.

First, you'll need to make an alpha channel. The alpha channel is just like the red, green, and blue channels on images/videos, but instead of carrying colour information it carries transparency information. A chroma keyer will make an alpha channel.

Second, you'll need to open the Sequence Settings and select a codec that accepts an alpha channel. Your options are Animation or ProRes4444. Both will need to be set to "Millions of colors+" where the + signifies the presence of an alpha channel. If you're leaving Final Cut Studio I would say Animation, or if you're staying inside FCS go for ProRes as Final Cut can play it back in real time. In this case you'll have to go to an Adobe app, so go for Animation. Export your video at Current Settings.

As for rendering before exporting here's the skinny. When you render the timeline FCP creates a file in the Render Files folder. When Final Cut is playing something with a blue render bar it plays the render file. When you export by default it simply pulls info from the render file and writes it to the movie you're exporting so it doesn't have to recalculate the filters applied. If there isn't a render file FCP will have to calculate the effects. Long story short, if you are going to be exporting more than one time you can save a lot of time by rendering your timeline.

Third, this video will need to be transcoded to some sort of web format that has alpha. Your options will be Adobe Flash or Adobe Flash. If you're feeling adventurous you might try Adobe's Flash.

HTML5 video isn't anywhere near primetime, and this is a perfect example. Even if you didn't want alpha channel there are two camps, the H.264 camp (IE, Safari, iOS) and the WebM camp (Chrome, Firefox, Android). Pick H.264 or WebM H.264 video and you alienate 3 major browser groups. Pick Adobe Flash and you alienate 1 major browser group. There's been some speculation about the possibility of adding alpha to WebM, but no results, and the workarounds to make it happen don't sound promising. H.264 simply can not support alpha. HTML5 video - more bag of hurt than HD-DVD.


Return to posts index

Jonathan Carroll
Re: How to make my own "live spokesperson" with transparent background and add to my website?
on Sep 22, 2011 at 7:05:39 am

Wow thank you so much for breaking it down for me. I ended up exporting Animation with Millions of colors+ and after reinstalling Lion (for some reason) I was finally able to import my exported .mov into Adobe Media Encoder. Which then I converted the .mov to .flv. I figured there wad no way around Flash, and I hate that. I wish they made a version for people like me! I finally was able to actually view my video in Flash (after hours of googling) and I used the Transparent/Windowless effect to get rid of the frame. And guess what...now I'm stuck again...

I have an iWeb site that I put online through dropbox (so it's free) but I'm not thinking iWeb will support flash.
I have also purchased my own personal domain with Wix.com (biggest mistake) which is a flash-based website. I figured the only thing to do was upload the .swf file onto my Wix but it said the file wad too large. And rookie me doesn't know how to change settings in flash to get a smaller size file. I tried everything (that I thought would work) and it was always the same size. And advice here?

Again thanks for your response.


Return to posts index


Jeff Meyer
Re: How to make my own "live spokesperson" with transparent background and add to my website?
on Sep 22, 2011 at 1:10:50 pm

Only advice I've got is to export the video with fewer pixels out of Final Cut. Perhaps at a non-standard frame size that's taller than it is wide to better accommodate your deliverable.


Return to posts index

Mark Suszko
Re: How to make my own "live spokesperson" with transparent background and add to my website?
on Sep 22, 2011 at 2:42:59 pm

This live action chromakey walk-in effect on web pages is kind of played-out already; I think most folks find it annoying, ( I KNOW I do-) because it's just like another pop-up that distracts and doesn't really add any value, but if you're doing it more as a tech demo, go for it, I guess. First thing it makes me think of is those obnoxious animated lower-third TV promo bugs on broadcast shows.


Return to posts index

Jonathan Carroll
Re: How to make my own
on Sep 22, 2011 at 3:27:33 pm

I'm actually applying for a videography internship and after giving the Marketing Manager my portfolio and resume online, I asked what I could do to improve it. He actually suggest that as like a narrator of my resume (since it's online). I'll have controls to where they cam shut me up. I also like to make it where they could download my resume in .PDF but I'm not sure how. I'm using iWeb and/or Wix. Any suggestions?

(This thread can just be all about me haha)

Jon


Return to posts index


Samuel Rodriguez
Re: How to make my own "live spokesperson" with transparent background and add to my website?
on Jan 3, 2014 at 3:04:32 am

Hi I found a video tutorial that clearly answers your question.

Feel free to watch it here:






I hope this was helpful.

Best luck,
Alex


Return to posts index

<< PREVIOUS   •   VIEW ALL   •   PRINT   •   NEXT >>
© 2018 CreativeCOW.net All Rights Reserved
[TOP]