Ren'Py Making a series of images as webm

GrayTShirt

Well-Known Member
Game Developer
Nov 27, 2019
1,085
5,283
So, I was able to animate a 60 frame scene and rendered it as 60 separate images instead of a movie. (Used ManFriday's RenderQueue.)
What program would I use to turn that series of images into a webm video for Ren'Py?
I don't know what keywords to use to search myself, I couldn't find anything beyond "How to play a movie in Rem'Py".

Thank you,
-GTS
 

MissFortune

I Was Once, Possibly, Maybe, Perhaps… A Harem King
Respected User
Game Developer
Aug 17, 2019
4,708
7,755
Is it an animation? I'll be writing this under the assumption that it is.

1. Video editing software: There's a ton of command line software out there, but I honestly prefer video editing software for GUI. Makes life a lot easier. Openshot is a good free one. So is DaVinci, though I'm not sure if they take image sequences. I personally use Premiere Pro or After Effects, depending on my needs for said animation.

1b. If you're using After Effects/Premiere, then you're going to download Media Encoder. Once you have all those, you'll want to download Fnord. Make sure you install Fnord while AE/PP are closed. Once you have that, you'll open AE/PP.

1.png

2.png

Select the first image in the sequence (notice all of the images are in order? 0, 1, 2, 3, etc. That's pretty necessary, hence sequence.), and then select the "Image Sequence" box, then click open. This is where Fnord comes into play. Sort of, at least. The rest should be pretty easy to follow via video:


To pull up "Export Settings", just right-click on the black space like I did in the video. After it's exported/rendered, slap it somewhere in your Renpy game directory. What you're going to do after that is define the video as an image, like so:

Code:
image aniname = Movie(play="images/ani/ani1.webm", loop=True, start_image="images/ani/aniname_060.png", image="images/ani/aniname_119.png")
Some notes for the above code. If it's not a looping animation, change loop=True to False. "start_image" should be the first image of the animation and "image=" should be the last. This prevents the black/checkerboard background from appearing. So, now that you have your animation defined as an image, you can play it as if it were a regular render. Like so:

Python:
scene render 3 with dissolve
mc "blah blah blah!"
li "blah blee blah!!"
#animation starts here
scene aniname with dissolve
pause
scene render 4 with dissolve
mc "blahhhh!!!!!!!!"
I think that about covers the process? Could be missing something, but I don't think I am. Openshot should work similarly to AE/PP, sans the need for Fnord. If there's anything that isn't quite clear, I'll try to help if I can.

Edit: Replaced the temporary Streamable link with a YouTube link. More permanent and higher quality.
 
Last edited:

osanaiko

Engaged Member
Modder
Jul 4, 2017
2,180
3,622
BTW GrayTShirt, you can also go the ghetto route as follows:

1. grab "makeavi" from sourceforge. ( ) it's an old and super-bare-bones tool to combine still images into an AVI container, but it does the job.
2. Select your images, sort them in order if needed, and then hit Begin. Select output format as "full uncompressed" (it asks the format as the last step of the "Begin")
3. Grab Handbrake for re-encoding ( )
4. Drag the AVI file onto Handbrake
5. Choose Format "webm" container on the summary tab, and Video Encoder "vp9" on the Video tab
6. Set the output filename at the bottom of the UI
7. hit the start encode button.

The preferred video format for Renpy is VP9 in a WEBM container. This gives excellent compression with good image quality and is widely supported.

NOTE: video encoding adds a whole new world of complexity. You'll need to consider framerates as well - 60 frames of images is only 2 seconds of 30fps video...
 

GrayTShirt

Well-Known Member
Game Developer
Nov 27, 2019
1,085
5,283
That did it! Thank you so much Miss Fortune!!!
I was worried about it looking complicated, but it only took a minute to do!
I used Premier Pro and followed the instruction exactly.
 
  • Like
Reactions: MissFortune

MissFortune

I Was Once, Possibly, Maybe, Perhaps… A Harem King
Respected User
Game Developer
Aug 17, 2019
4,708
7,755
That did it! Thank you so much Miss Fortune!!!
I was worried about it looking complicated, but it only took a minute to do!
I used Premier Pro and followed the instruction exactly.
Glad it could help. It's definitely one of those things that look more complicated than they really are just based on the potential number of steps, but ends up being pretty easy (and fast) once you get a solid grasp on what's actually happening.
 
  • Like
Reactions: GrayTShirt

JakaiD

Newbie
Dec 26, 2018
43
25
is a free tool you can use to encode video or a series of images into webm. Also usefull for other things, like making Gifs, or recording screen when you want to make quick vids or gifs from that.
 
  • Like
Reactions: GrayTShirt

GrayTShirt

Well-Known Member
Game Developer
Nov 27, 2019
1,085
5,283
You don't have permission to view the spoiler content. Log in or register now.

Obviously I have some things to fix on the animation itself. But the process only took like 30 seconds!

Thank you again!
 
  • Like
Reactions: MissFortune