🏠 📚 🔍 📧

***Secret FSR Fender guitars? Yes, they exist, and they're right here

As an Amazon Associate I earn from qualifying purchases. (What does this mean?)

Recent Posts
How to get a safety razor blade out of a plastic caseA very weird '90s Fender color, Blueburst
Still the best cheap semi-hollow, Squier StarcasterProbably the best stereo flanger guitar pedal

How to create an animated WEBP with Kdenlive and FFMPEG


WEBP animations are great once you know how to use them.

Kdenlive is a free video editor. I'm using Linux (Kubuntu, specifically), but since this software can be run on Linux, Windows or Intel Macs, these instructions should work regardless of OS you're using.

The version of Kdenlive I'm using is 21.12.3. The current version is 23.08.4 but the instructions here should still work.

FFMPEG is a free command line utility for recording/converting/streaming audio and video. Like Kdenlive, it works on Linux, Windows or Mac.

The sample footage used here is from Popeye the Sailor Meets Sindbad the Sailor, a public domain video in MP4 format I downloaded from the Library of Congress.

Step 1. Drag the MP4 directly on to the timeline

You can drag to V1 or V2, it doesn't matter. Kdenlive should look similar to this once you do that:


Step 2. Go to the specific time you want your animation to start

There are several ways to do this. Here are two of them:

Click the Project Monitor, which by default should be on right (see screenshot below). The video clip will start playing. Click it again to stop. Use the mouse to click and drag the pointer to your desired start point.


Click the Project Monitor. The clip will start playing. Click it again to stop. Move forward or reverse using your keyboard left and right arrow keys. Or, if you know EXACTLY where you want your clip to begin, press the equals key on your keyboard then type the exact time you want and press Enter. You can move between time fields with the left and right keyboard arrow keys.


Once you have your start point set, continue to the next step.

Step 3. Set the In Point of your clip

In and Out Points may confuse you at first, so here is a basic rundown: Since we are using just one video clip, there is no need to cut/paste or set keyframes or do anything like that. All we need to do is set IN and OUT, as in "START HERE" and "END HERE". This greatly simplifies things.

In the last step, you specified your "START HERE" point. Now we instruct Kdenlive to set this as the In Point. Kdenlive refers to this as a "zone".

Click Monitor and then Set Zone In.


Step 4. Play the clip again until it comes to where you want your animation to end

Click the Project Monitor window to continue playing the video clip. When it comes to the point where you want your animation to end, click it again to stop.

For a precise spot you want the clip to end, stop the clip first, then use your keyboard left and right arrow keys to get exactly where you want the animation to end.

Once you have your desired finish position set, continue to the next step.

Step 5. Set the Out Point of your clip

This is exactly the same as setting the In Point, except now we're setting the Out Point. You have already played the clip to where you want "END HERE" to be specified, so now we instruct Kdenlive to set this as the Out Point.

Click Monitor and then Set Zone Out.

Step 6. Render the project

Click Project and then Render.

There are several things to do here:


Click MP4-H264/AAC (at left). This will render an MP4 video file.

Click Selected Zone (near bottom) - and yes, this means what you think it does. Only the ZONE you specified with setting In and Out Points will be rendered and not the entire clip, which is exactly what you want.

Check the box More options (near bottom). We need to do this so we can access the Rescale option.

Click Rescale and set width to 300 (on right). Height will adjust automatically.

At top, look at Output file. This is where you choose the location of the MP4 and can name it whatever you want.

When ready, click the Render to File button at bottom left. Kdenlive will render the MP4. Since this is a very short clip, rendering will be quick.

Additional notes on dimensions

300 pixels, generally speaking, is a good width to use for an animated WEBP if the image is more wide than tall. If the image is more tall than wide, then set height to 300 and the width will auto-adjust.

While true modern computer screens have very high resolutions, what you have to worry about here is WEBP file size. The larger the dimensions, the larger the size, the longer it takes to load when uploaded elsewhere. This being true, 300 pixels wide usually works anywhere. I wouldn't use a height or width exceeding 500 pixels at most.

We're almost done, just one more step to go.

Next Page ▶

Published 2024 Jan 4

Best ZOOM R8 tutorial book
highly rated, get recording quick!

Popular Posts

Casio F-91W cheat sheet

How much future tech of Total Recall 1990 became reality?

Help with guitar setup (it's more than just adjustments)

I drank 3 liters of water a day for a week, and here's what happened

List of 24.75" scale length guitars and other shorter models

Is a fat Telecaster right for you?

On becoming a watch wearer

EMF radiation danger in quartz watches - time to switch to automatic?

The easiest-to-read analog watch is a pilot Type B

Saving the Casio F-28W