[Tutorial] Animated Cutscenes

View previous topic View next topic Go down

[Tutorial] Animated Cutscenes

Post  Benny26 on Thu Jan 10, 2013 4:11 pm

Here's a tutorial if you want to jazz up your cutscenes. I'll admit they're not easy to do, but sometimes a single image just doesn't cut it when you're trying to get a story across.

By now you should know how to make simple one image cutscenes using FPG edit. If you don't then i suggest you learn that first. Anyways, let's get started:

Firstly, the frame on screen gets cut off for about 20 pixels at the top, this is very important. And, 240 height is no good, 210 is much better in cutscenes.

They're not that hard once you've done your first one or two. I followed this sort of principle:

A very basic example

[Picture (frame) of Adam and Axel talking in a corridor]

Text: I don't like the look of this dude, we better go find Blaze. (Axel) (240 fps, 4 seconds)
Text: I agree, 3 heads are better than one on this. Let's go. (Adam) (240 fps, 4 seconds)

[Picture (frame) of Adam, Axel and Blaze talking outside in the street]

Text: Hi guys, you need a hand? (Blaze) (240 fps, 4 seconds)
Text: You read our minds, let's go kick some ass! (Adam) (240 fps, 4 seconds)

6.69 frames per second in FPG is round about correct...and also a pain in the arse for timing. But i just stick to 7 fps at the start, then tweak later on. Like this:

Text timing is constant, so that's what you work with. It's also what you sync your audio to (if you have any sound effects in the cutscene). Here's my code for the basic example above:


[Picture (frame) of Adam and Axel talking in a corridor] = "Frame 1"

Text: I don't like the look of this dude, we better go find Blaze. (Axel) (240 fps, 4 seconds) = Add 28 frames (7 frames = 1 second) of "Frame 1" to FPG (001,002,003, ect...)
Text: I agree, 3 heads are better than one on this. Let's go. (Adam) (240 fps, 4 seconds) = Add another 28 frames of "frame 1" to FPG.

[Picture (frame) of Adam, Axel and Blaze talking outside in the street] = "Frame 2"

Text: Hi guys, you need a hand? (Blaze) (240 fps, 4 seconds) = Add 28 Frames of "frame 2"
Text: You read our minds, let's go kick some ass! (Adam) (240 fps, 4 seconds) = Add 28 Frames of "frame 2".

Total = 56 frames of "frame 1", and 56 frames of "frame 2" (112 Frames total, for 16 total seconds of cutscene)


Because the fps in FPG is around 6.69, the transition between pictures will be delayed by a short time. What you do now is watch your cutscene and estimate how many "Frame 1" to take out to make the transition quicker and appear on time...When you have the frame timing set perfect, you can then make your audio (in say Audacity) to the timing of the script text..and it should match up without problem.

Key things for me are: Always work with the script text timing, know that the maximum length a cutscene can be is around 2 minutes 10 seconds (999 frames in FPG)...and don't settle for crap cutscenes if you know how to make better ones Razz

Animated cutscenes from live action video

1. Make a video, adding fancy stuff to it or whatever using a program like Camtasia (also used for the SoRR recording in my video). The options needed for Camtasia are kinda like this: Record the vid at a frame rate of around the 12 -15 mark (This is a BIG area where I'm trying to perfect. The higher the recorded frame-rate the slower the playback will be in FPG, and the lower the frame-rate the more jerky the vid will be)... Export the vid to AVI format in 640x480 dimensions. (should be 640x480 if you've been recording SoRR)

2. Drop the vid into a program like VirtualDub (It's a free small download from VirtualDub.org). Then using --File > Export > Image Sequence (PNG)-- It will save every frame of the vid to PNG format in a folder of your choosing.

3. Load up a program like Irfanview (again, free) and use the program to do a mass batch conversion of the frames from their 640x480 format to 320x240. Why do this here? Because Irfanview has special codecs that enable the pics to be made smaller without losing any quality. Using Camtasia to export the vid in 320x240 makes the quality terrible.

4. Now all you have to do is open up FPG and drop all the vid frames in a new FPG and save. Simples.

But like i say, there's a big issue in the fps department thanks to FPG's 6.7 fps playback rate...But I'm looking at it 😉 Also, FPG can only handle 1000 frames maximum, so you can't go overboard with the video length, sadly.


_________________
I don't suffer from insanity. I enjoy every minute of it.
avatar
Benny26
Admin

Posts : 452
Join date : 2013-01-09
Location : Leeds, UK

http://www.sorrcommunity.com

Back to top Go down

Re: [Tutorial] Animated Cutscenes

Post  BigDarsh on Wed Mar 05, 2014 10:31 pm

This is a very good tutorial Benny, however, I chose to procede the "other way" to make animated cutscene because of that 6.69fps which is pretty uncomfortable.

I based all my cutscene on a audio file then adjust my frame animation in order it match sound. Working the opposite way (doing the cutscene first, then adjusting audio) can't work if your animated custscene feature music (since it will ruins music tempo, rythm and harmony).

This said, your tutorial is very good, and I studied a lot SoR at the movies (which the best mod regarding cutscene quality) to create my cutscene. Thank you very much Benny!

_________________
Streets of Rage : Game vs Lore Analysis avaible here
http://brawlersavenue.forumotion.com/f9-brawler-analysis
"Back in our day, even real life didn't have graphics this good.
Back in our day, you had one sound effect for 20 things, and you came to love that sound effect.
Back in our day... Streets of Rage - the Classic - the Original - was the best damn game out there."

-CajNatalie-
avatar
BigDarsh
Hakuyo

Posts : 336
Join date : 2013-03-14

Back to top Go down

Re: [Tutorial] Animated Cutscenes

Post  Benny26 on Wed Mar 05, 2014 10:59 pm

Thanks BigDarsh Smile

Yeah, as far as i can remember (been awhile since i played my own mod) nearly all of my cutscenes that involved music were either ambient looped or easily editable to match the frames. I did fall into a similar situation as you for my MGS epilogue cutscene though where i had to adjust the frames to the audio track, "other way" as you nicely put it.

I don't say anything about that in the tutorial, I think mostly because i wrote it as a sort of beginner's/easier way or something. But yeah, glad my tutorial helped you out.

_________________
I don't suffer from insanity. I enjoy every minute of it.
avatar
Benny26
Admin

Posts : 452
Join date : 2013-01-09
Location : Leeds, UK

http://www.sorrcommunity.com

Back to top Go down

Re: [Tutorial] Animated Cutscenes

Post  graylandertagger on Sat Mar 19, 2016 11:04 pm

Benny26 wrote:Also, FPG can only handle 1000 frames maximum, so you can't go overboard with the video length, sadly.

Such a shame. While better than nothing I was going to plan on eventually making a Streets of Rage Russel Crow mod based on the South Park episode The New Terrace and Phillip Trailer once I can figure out how to add new character(Which I figured that I could learn from Mr.Din). The idea of the mod was taken from one of the worse trolls of all time in the original forums(HIMANSHUNATOR), but after watching the South Park episode that it was based on I can't help, but laugh my ass off.
http://www.watchcartoononline.com/south-park-season-6-episode-4-the-new-terrance-phillip-movie-trailer-2

I was going to use scenes from the episode for the cutscenes, the problem was that the opening cutscene was too long. The frames for the opening cutscene(along with a video of all the scenes I was going to use in the mod is right here:
mediafire.com download/4a747ob68mt3sgb/russel+crow.zip

As for the gameplay part of what was holding me back was the lack of inspiration I had for building a stage. If I did know a way around the 1000 frame limit I was going to get inspiration for drawning stages by looking at pictures for the themes of each stage. I was also going to ask Klares for advice.

Being a South Park mod, I was going to have to figure out how to replace the graphics for the enemies by looking at Mr.Din's work once it gets released. I am aware that adding new characters and enemies is a complex process, since attempting to replace the sprites for characters causes pixel glitches. I figured that I could ask around(aside from the cutscenes, I was going to work on the enemies along with the new character, Russel Crow first).
http://www.sorrcommunity.com/t391-the-lab-of-dr-sidd-and-mr-din

If anyone can find away around the 1000 frame limit i'm willing to make use of it. Let me know. I figure a Russel Crow joke mod would cause a hell of a laugh.
avatar
graylandertagger
Signal

Posts : 135
Join date : 2013-02-11

Back to top Go down

Re: [Tutorial] Animated Cutscenes

Post  Don Vecta on Fri Dec 30, 2016 10:09 am

I know this is embarrassing but... is there anyone willing to share their knowledge in mounting animated cutscenes without putting all the frames in the FPG like the one described earlier? I know v5.1 allows now to put static images in scenes where the frame isn't changing and only the transitions and the new frames can be added.

_________________

Withering Surface Entertainment presents: H.U.N.T.E.R. with its DLC Stories: Subway Mayhem & A Cold Quest for Peace. Adam's Story (main designer), Rushing Beat Remake, Final Fight CD Mini-mod(e), Double Dragon II The Revenge Megamix.
avatar
Don Vecta
Moderator

Posts : 1526
Join date : 2013-01-10

Back to top Go down

Re: [Tutorial] Animated Cutscenes

Post  Saven on Fri Dec 30, 2016 6:25 pm

I've been meaning to make one for a long time, but just never found the time to do it. I've redone all of my cutscenes this way and its better on space and time.

_________________
avatar
Saven
Forum Elder

Posts : 1292
Join date : 2013-01-09
Location : Streets of Rage

Back to top Go down

Re: [Tutorial] Animated Cutscenes

Post  Sponsored content


Sponsored content


Back to top Go down

View previous topic View next topic Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum