Expand installation instructions

This commit is contained in:
Florine W. Dekker 2022-05-26 21:52:30 +02:00
parent 05d4005482
commit d5bf6b0752
Signed by: FWDekker
GPG Key ID: D3DCFAA8A4560BE0
3 changed files with 50 additions and 31 deletions

BIN
package-lock.json generated

Binary file not shown.

View File

@ -1,6 +1,6 @@
{
"name": "blog",
"version": "1.3.0",
"version": "1.3.1",
"description": "Florine's personal blog.",
"author": "Florine W. Dekker",
"browser": "dist/bundle.js",
@ -16,8 +16,8 @@
"deploy": "grunt deploy"
},
"devDependencies": {
"@11ty/eleventy": "^1.0.0",
"grunt": "^1.5.2",
"@11ty/eleventy": "^1.0.1",
"grunt": "^1.5.3",
"grunt-cli": "^1.4.3",
"grunt-contrib-clean": "^2.0.1",
"grunt-contrib-copy": "^1.0.0",

View File

@ -41,16 +41,26 @@ I've seen some people who wrote that they used
I don't have any experience with RimworldRender, but I suppose the advantage of FFmpeg is that you can easily combine it
in a whole pipeline of tools and libraries to add music, scaling, zooming, panning, and much more.
You can download [⎋ FFmpeg for Windows from gyan.dev](https://www.gyan.dev/ffmpeg/builds/ffmpeg-git-full.7z),
or you can check the [⎋ FFmpeg download page](https://ffmpeg.org/download.html) for more download options.
Simply extract the downloaded archive anywhere you want;
let's say you extracted it to `C:\Users\FWDekker\Downloads\ffmpeg\` so you have the executable
`C:\Users\FWDekker\Downloads\ffmpeg\ffmpeg.exe`.
### 2.1 Installing FFmpeg
* **Windows:**
You can download
[⎋ FFmpeg for Windows from gyan.dev](https://www.gyan.dev/ffmpeg/builds/ffmpeg-git-full.7z),
or you can check the [⎋ FFmpeg download page](https://ffmpeg.org/download.html) for more download options.
Simply extract the downloaded archive anywhere you want;
let's say you extracted it to `C:\Users\FWDekker\Downloads\ffmpeg\` so you have the executable
`C:\Users\FWDekker\Downloads\ffmpeg\ffmpeg.exe`.
* **Linux/macOS:**
Follow the download instructions on the [⎋ FFmpeg download page](https://ffmpeg.org/download.html).
If you're running a Debian-based distro (including Ubuntu) you can just run `sudo apt install ffmpeg`.
In the instruction below you should replace `C:\Users\FWDekker\Downloads\ffmpeg\ffmpeg.exe` with a simple `ffmpeg`.
### 2.1 Renaming the files
### 2.2 Renaming the files
Before you can use FFmpeg to create a video from your screenshots, you have to (temporarily) rename the images.
FFmpeg expects the images to have names like `001.png`, `002.png`, etc.
You can easily do that using [⎋ Ant Renamer](http://www.antp.be/software/renamer).
FFmpeg expects the images to have names like `1.png`, `2.png`, etc.
The best way to rename your files depends on your operating system.
#### 2.2.1 Windows
The easiest option on Windows is probably to use [⎋ Ant Renamer](http://www.antp.be/software/renamer).
Let's say that your screenshots from Progress Renderer are stored in `C:\Users\FWDekker\Rimworld\`.
1. [⎋ Download](http://www.antp.be/software/renamer/download) and run Ant Renamer.
2. Click the `Add folders...` button, and select the screenshot folder.
@ -64,13 +74,22 @@ Let's say that your screenshots from Progress Renderer are stored in `C:\Users\F
These settings are fine even if you have more than 1000 screenshots.
6. Press `Go` at the top.
The files have been renamed, but do not close Ant Renamer yet!
The files have been renamed.
Once you've completed this whole guide, you can press the arrow to the right of `Go` to undo the renaming if you
want.
If you close Ant Renamer, you will not be able to undo the renaming.
Now you're ready to run FFmpeg.
After you're done with FFmpeg, you can press the arrow to the right of `Go` to undo the renaming.
If you close Ant Renamer, you will not be able to undo the renaming.
#### 2.2.2 Linux/macOS
1. Open up a terminal and navigate to the directory containing the images.
2. Check you're in the right directory using `lv -a`.
Make sure you see _no_ files other than the images you want to rename.
3. Double check you're in the right directory.
4. Run the following command to rename all files in the current directory:
```shell
ls -v | cat -n | while read n f; do mv -n "$f" "$n.png"; done
```
### 2.2 Creating the video
### 2.3 Creating the video
With the files properly renamed, you can run FFmpeg to create the video for you.
1. Open the Windows command prompt.
2. Navigate to the directory of screenshots using `cd /d "C:\Users\FWDekker\Rimworld"`.
@ -86,18 +105,18 @@ With the files properly renamed, you can run FFmpeg to create the video for you.
* `-crf 24` is the quality of the video. A lower value means higher quality. Typical values are between 18 and 28.
* `-pix_fmt yuv420p` is the way pixels are encoded.
* `-vf [...]` applies filters to the images, like cropping and scaling.
* `crop=5120:3680:2384:3296` extracts a rectangle from the images, basically zooming in on your images.
The format is `width:height:x:y`, creating a rectangle of size `width` by `height`, with the top-left corner at
`x, y` measured from the top-left corner.
For some reason, you have to make sure all values are multiples of 8, or else you will get a bunch of warnings.
* `scale=1280:920` resizes the video to the given dimensions.
* `tpad=stop_mode=clone:stop_duration=3` freezes the last frame for 3 seconds, to allow people to enjoy the end of
the video.
* `out.mp4` is the file to store the output in.
* `crop=5120:3680:2384:3296` extracts a rectangle from the images, basically zooming in on your images.
The format is `width:height:x:y`, creating a rectangle of size `width` by `height`, with the top-left corner at
`x, y` measured from the top-left corner.
For some reason, you have to make sure all values are multiples of 8, or else you will get a bunch of warnings.
* `scale=1280:920` resizes the video to the given dimensions.
* `tpad=stop_mode=clone:stop_duration=3` freezes the last frame for 3 seconds, to allow people to enjoy the end of
the video.
* `out.mp4` is the file to store the output in, relative to the `"C:\Users\FWDekker\Rimworld"` directory.
FFmpeg will show you a nice process indicator with some additional stats, and should be done within a few minutes.
### 2.3 Lowering the quality
### 2.4 Lowering the quality
If you find that the video is too large, you can repeat the previous step with a higher value for `-crf` or with a
different output size.
However, this means that FFmpeg will have to process all your screenshots again, which takes a while.
@ -112,19 +131,19 @@ seconds.
"C:\Users\FWDekker\Downloads\ffmpeg\ffmpeg.exe" -i out.mp4 -vf "scale=640:460" out2.mp4
```
### 2.4 Adding sound
### 2.5 Adding sound
To spice up your video, you can add music.
Store the music file, say `audio.mp3`, in the same folder as `out.mp4`, and then you can use FFmpeg for this step as
Store the music file, say in `audio.mp3`, in the same folder as `out.mp4`, and then you can use FFmpeg for this step as
well:
```shell
"C:\Users\FWDekker\Downloads\ffmpeg\ffmpeg.exe" -i out.mp4 -i audio.mp3 -af "afade=t=out:st=50:d=3" -c:v copy -shortest out-with-audio.mp4
```
* `-i out.mp4` and `-i audio.mp3` show which files you want to process.
* `-af [...]` applies filters to the audio.
* `t=out:st=50:d=3` means that you're applying the _fade out_ filter, with start time at 50 seconds (`st=50`), and a
duration of 3 seconds (`d=3`).
I chose these values because my video `out.mp4` is 53 seconds long, of which the last 3 seconds are a frozen frame.
If you don't want a fade out, then replace the `-af [...]` with `-a:v copy`.
* `t=out:st=50:d=3` means that you're applying the _fade out_ filter, with start time at 50 seconds (`st=50`), and a
duration of 3 seconds (`d=3`).
I chose these values because my video `out.mp4` is 53 seconds long, of which the last 3 seconds are a frozen frame.
If you don't want a fade out, then replace the `-af [...]` with `-a:v copy`.
* `-c:v copy` means that you just want to copy the video without any adjustments.
* `-shortest` takes the shortest of all your input files, and makes the output as long as that file.
So if `audio.mp3` is longer than `out.mp4`, then `audio.mp3` is cut off.