Speed up and slow down videos using the Edit API

Video speed control helps you create different effects and enhance the overall impact of your video. It gives you the ability to control the pace, rhythm, and mood of your videos, making it an essential skill for any video editor.

Speeding up a video can create a sense of urgency, excitement, or intensity. It is commonly used in action sequences, time-lapse videos, or to condense lengthy footage.

On the other hand, slowing down a video can evoke emotions, highlight details, and create a dreamy or dramatic effect. Slow motion is often used to emphasise crucial moments, add elegance to a scene, or create suspense.

In this article, we will dive into how you can speed up or slow down your videos for maximum impact using Shotstack's video editing API.

Prerequisites

To follow along this tutorial, you will need:

• A Shotstack API key. Sign up for your free account to get your unique API key.
• A cURL client. You can use any command-line or graphical tool that supports HTTP requests, such as Postman.
• A video file that you want to speed up or slow down. You can use any video file that is accessible via a public URL, or upload your own video to the Shotstack Ingest API. For this blog, we will be using this video asset:

Note that this video is 25.85 seconds long. If we increase or decrease the speed of this video the duration will change. You will see why that is important later on.

Prepare the JSON edit

The Shotstack Edit API uses JSON to describe the arrangement of a video edit. The first step to speed up or slow down a video using the API is to prepare the JSON edit. The JSON edit consists of two main parts: the timeline and the output.

The timeline defines the structure and content of your video, such as the tracks, clips, assets, transitions, effects, etc... The output defines the format and quality of your rendered video, such as the resolution, aspect ratio, fps, etc...

For this tutorial, we will use a simple JSON edit that has one track with one clip that contains our video asset. We will use the speed property of the video asset to adjust the playback speed of the video. The speed property is a decimal number (float) that represents the multiplier of the original speed. For example, a speed of 2 means twice as fast, and a speed of 0.5 means half speed.

Speed up video using the Edit API

Create a file names fast.json and copy and paste the JSON below:

{
    "timeline": {
        "tracks": [
            {
                "clips": [
                    {
                        "asset": {
                            "type": "video",
                            "src": "https://github.com/shotstack/test-media/raw/main/captioning/scott-ko.mp4",
                            "speed": 1.5
                        },
                        "start": 0,
                        "length": 17.23
                    }
                ]
            }
        ]
    },
    "output": {
        "format": "mp4",
        "resolution": "hd"
    }
}

Notice that the speed is set to 1.5, this will create a video that is 1.5 times faster then the original video. Because the video is sped up, the duration will be shorter, therefor the length of the clip is set to 17.23. This is calculated using the original length / speed, i.e. 25.85 / 1.5 = 17.23.

Send the sped-up video JSON to the Edit API

To render the sped-up video we need to send the JSON to the API for rendering. This can be done using the cURL command below, from your terminal, which sets your API key and POSTs the fast.json file to the render endpoint:

curl -X POST \
  -H "Content-Type: application/json" \
  -H "x-api-key: YOUR_API_KEY" \
  -d @fast.json \
  https://api.shotstack.io/edit/stage/render

Make sure you replace YOUR_API_KEY with your sandbox key which you can lookup in the dashboard.

If successful you will see a response similar to below which includes the render ID of the render task:

{
    "success": true,
    "message": "Created",
    "response": {
        "message": "Render Successfully Queued",
        "id": "ad4782ab-ddb4-4830-b408-12f22e4e1441"
    }
}

Take a note of the response.id as you will need it in the next step.

Checking the render progress of the sped-up video

The next step is to check the status of the render and to see if the video is ready to be downloaded. The render will take a few seconds to complete and the status will be queued or rendering at first, and then done when the rendering has finished.

Use the following cURL command to get the status. Replace YOUR_API_KEY with your sandbox key and RENDER_ID with the ID from the previous step:

curl -X GET \
  -H "Content-Type: application/json" \
  -H "x-api-key: YOUR_API_KEY" \
  https://api.shotstack.io/edit/stage/render/RENDER_ID

The response will look something like below:

{
    "success": true,
    "message": "OK",
    "response": {
        "id": "0abb501f-c5d6-44ca-96aa-4f38bc22e3f9",
        "owner": "7okmvmdcv8",
        "plan": "sandbox",
        "status": "done",
        "error": "",
        "duration": 17.23,
        "billable": 17.23,
        "renderTime": 6.38,
        "url": "https://shotstack-api-stage-output.s3-ap-southeast-2.amazonaws.com/msgtwx8iw6/0abb501f-c5d6-44ca-96aa-4f38bc22e3f9.mp4",
        "poster": null,
        "thumbnail": null,
        "created": "2023-08-29T12:49:38.486Z",
        "updated": "2023-08-29T12:49:46.559Z"
    }
}

The response above includes the repsonse.status of done, and a temporary URL of the rendered video against the parameter response.url.

If you go ahead and copy the URL and open it in your browser you will see the sped-up fast video, just like this one:

When using the Edit API, both the video and audio are sped up, this means the pitch of the audio is also increased, i.e. the audio is high pitched. When a video is slowed down the audio slowed down too resulting in low pitch audio.

Slow down video (slow motion) using the Edit API

You can also slow down video to create a slow motion effect using the same process. This time create a file named slow.json and copy and paste the following JSON:

{
    "timeline": {
        "tracks": [
            {
                "clips": [
                    {
                        "asset": {
                            "type": "video",
                            "src": "https://github.com/shotstack/test-media/raw/main/captioning/scott-ko.mp4",
                            "speed": 0.75
                        },
                        "start": 0,
                        "length": 34.46
                    }
                ]
            }
        ]
    },
    "output": {
        "format": "mp4",
        "resolution": "hd"
    }
}

This is the same JSON as before with two differences; the speed has been set to 0.75, slower than the original speed and the length is set to 34.46, using the same formula as before; 25.85 / 0.75

Follow the steps above to send the JSON in the slow.json file file to the API, get the render ID, check the render status and receive the final video URL.

The final slowed down, slow motion video should look like the one below:

And you're done! You now have a way to automate the speeding up and slowing down of videos using an API and the programming language of your choice.

There's a lot more you can do with Shotstack from trimming, merging to resizing and cropping videos. To learn more, visit our documentation or explore our getting started guides.