Motion

Turn a clip in 3D

The clip swings in around its vertical axis and settles at a slight angle. rotateX tips it, rotateY turns it, and perspective sets how strong the depth reads.

Shown on A motorcycle on an empty road, on a studio backdrop

Renders up to 1080p at 30 fps on every self-serve plan.

Before · the same request without it
After · rendered from the request below

The entry

Put it on the clip's transform, beside its size and position.

{
"transform": {
"scale": 0.62,
"rotateY": [
{
"time": 0,
"value": -80,
"easing": "easeOutCubic"
},
{
"time": 1.4,
"value": -18
}
],
"perspective": 900
}
}

Every setting and default is in the docs

Run it

The whole request behind the render above. Paste it as it is, or swap the file for your own.

job.ts
import { createClient, outputUrl } from "@rendobar/sdk";
const rb = createClient({ apiKey: process.env.RENDOBAR_API_KEY });
const job = await rb.jobs.run({
type: "compose",
params: {
schemaVersion: 1,
output: {
format: "mp4",
resolution: {
width: 960,
height: 540
}
},
timeline: {
tracks: [
{
clips: [
{
asset: {
type: "shape",
shape: "rect",
color: [
"#1B2A26",
"#070D0B"
],
gradient: "radial"
},
start: 0,
length: 6
}
]
},
{
clips: [
{
asset: {
type: "video",
src: "https://cdn.rendobar.com/compose/showcase/media/ride.mp4"
},
start: 0,
transform: {
scale: 0.62,
rotateY: [
{
time: 0,
value: -80,
easing: "easeOutCubic"
},
{
time: 1.4,
value: -18
}
],
perspective: 900
}
}
]
}
]
}
},
});
console.log(outputUrl(job));

Install with npm i @rendobar/sdk. jobs.run() submits and waits, so it returns the finished job in one call.

terminal
curl https://api.rendobar.com/jobs \
-H "Authorization: Bearer $RENDOBAR_API_KEY" \
-H "Content-Type: application/json" \
-d '{"type":"compose","params":{"schemaVersion":1,"output":{"format":"mp4","resolution":{"width":960,"height":540}},"timeline":{"tracks":[{"clips":[{"asset":{"type":"shape","shape":"rect","color":["#1B2A26","#070D0B"],"gradient":"radial"},"start":0,"length":6}]},{"clips":[{"asset":{"type":"video","src":"https://cdn.rendobar.com/compose/showcase/media/ride.mp4"},"start":0,"transform":{"scale":0.62,"rotateY":[{"time":0,"value":-80,"easing":"easeOutCubic"},{"time":1.4,"value":-18}],"perspective":900}}]}]}}}'

Returns immediately with a job id. Poll GET /jobs/{id} or register a webhook rather than blocking on the request.

Questions

What does the 3D turn effect do in compose?

The clip swings in around its vertical axis and settles at a slight angle. rotateX tips it, rotateY turns it, and perspective sets how strong the depth reads.

How do I add 3D turn to a video with an API?

Send a compose job to the Rendobar API with this entry in the timeline: {"transform":{"scale":0.62,"rotateY":[{"time":0,"value":-80,"easing":"easeOutCubic"},{"time":1.4,"value":-18}],"perspective":900}}. Put it on the clip's transform, beside its size and position. The request on this page is complete and renders as shown.

Footage and sound