JSON2VIDEO Documentation 12. Expressions
Variables resolve as raw strings. Expressions resolve as computed values: math, ternary conditions, string operations, and a handful of built-in functions. This chapter swaps the static price label for a dynamic "Luxury Home" / "Family Home" tag and computes scene durations from a base value.
Prerequisites: chapter 11. Expressions and variables share the {{ ... }} delimiter.
Step 1 — Expression syntax
An expression is any {{ ... }} block that contains an operator, a function call, or a literal that is not a bare variable name. Whitespace inside the braces is allowed and recommended.
{{ price_number * 1.2 }}
{{ bedrooms >= 4 ? "Family Home" : "Cozy Home" }}
{{ ceil(base_duration / 2) }}
The renderer detects the operator characters (+ - * / ? : and friends) and evaluates the expression. A bare {{ address }} stays a plain variable reference.
Step 2 — A computed "Luxury / Family" tag
The current price is stored as a number price_number for arithmetic. The visible string price is generated separately for the voice-over.
{
"variables": {
"address": "123 Oak Street",
"price": "$849,000",
"price_number": 849000,
"bedrooms": 4
}
}
Use a ternary expression to choose the tag:
{
"type": "text",
"text": "{{ price_number >= 1000000 ? 'Luxury Home' : 'Family Home' }}",
"position": "top-right",
"x": -60,
"y": 60,
"settings": { "font-family": "Inter", "font-size": "48px", "font-color": "#FFFFFF", "font-weight": "700" }
}
Note — single quotes are the recommended string delimiter inside expressions to avoid escaping JSON's double quotes.
Step 3 — Compute scene durations
Pull the scene duration from a base variable so changing one value changes the pacing of every room scene:
{
"variables": { "base_duration": 4 }
}
{
"duration": "{{ base_duration }}",
"transition": { "style": "fade", "duration": "{{ base_duration / 8 }}" }
}
A base_duration of 4 produces 4-second scenes with 0.5-second fades. Bump it to 6 and everything scales.
Step 4 — Use a built-in function
JSON2Video exposes a small library of math, string, and date functions. Common ones: ceil, floor, round, min, max, length, upper, lower, concat. Compute a budget cap that rounds up to the nearest whole second:
{
"type": "voice",
"text": "Welcome to {{ address }}. {{ price_number >= 1000000 ? 'Luxury' : 'Family' }} home, available now.",
"voice": "en-US-EmmaMultilingualNeural",
"start": "{{ ceil(base_duration / 3) }}"
}
The complete final JSON
{
"resolution": "full-hd",
"variables": {
"address": "123 Oak Street",
"price": "$849,000",
"price_number": 849000,
"bedrooms": 4,
"base_duration": 4
},
"elements": [
{
"type": "audio",
"src": "https://cdn.json2video.com/assets/audios/uplifting-corporate.mp3",
"volume": 0.4
},
{
"type": "voice",
"text": "Welcome to {{ address }}. {{ price_number >= 1000000 ? 'Luxury' : 'Family' }} home, available now.",
"voice": "en-US-EmmaMultilingualNeural",
"start": "{{ ceil(base_duration / 3) }}"
},
{
"type": "subtitles",
"language": "en",
"settings": {
"style": "boxed-word",
"font-family": "Inter",
"font-size": 90,
"font-color": "#FFFFFF",
"position": "bottom-center",
"all-caps": true,
"box-color": "#0E7C66"
}
},
{
"type": "html",
"tailwind": true,
"wait": 0.5,
"html": "<div class='inline-flex items-center gap-2 px-6 py-4 rounded-xl bg-emerald-700 text-white text-5xl font-bold shadow-lg'>💰 {{price}}</div>",
"position": "bottom-right",
"x": -60,
"y": -60,
"start": "{{ base_duration }}",
"duration": "{{ base_duration * 3 }}"
}
],
"scenes": [
{
"duration": "{{ base_duration }}",
"elements": [
{
"type": "component",
"component": "basic/000",
"settings": { "headline": "FOR SALE", "subline": "{{address}}" }
},
{
"type": "text",
"text": "{{ price_number >= 1000000 ? 'Luxury Home' : 'Family Home' }}",
"position": "top-right",
"x": -60,
"y": 60,
"settings": { "font-family": "Inter", "font-size": "48px", "font-color": "#FFFFFF", "font-weight": "700" }
}
]
},
{
"duration": "{{ base_duration }}",
"transition": { "style": "fade", "duration": "{{ base_duration / 8 }}" },
"elements": [
{ "type": "image", "src": "https://cdn.json2video.com/assets/images/sample-house-front.jpg" },
{ "type": "text", "text": "Exterior", "position": "top-left", "x": 60, "y": 60 }
]
},
{
"duration": "{{ base_duration }}",
"transition": { "style": "fade", "duration": "{{ base_duration / 8 }}" },
"elements": [
{ "type": "image", "src": "https://cdn.json2video.com/assets/images/sample-house-kitchen.jpg" },
{ "type": "text", "text": "Chef's Kitchen", "position": "top-left", "x": 60, "y": 60 }
]
},
{
"duration": "{{ base_duration }}",
"transition": { "style": "fade", "duration": "{{ base_duration / 8 }}" },
"elements": [
{ "type": "image", "src": "https://cdn.json2video.com/assets/images/sample-house-bedroom.jpg" },
{ "type": "text", "text": "Master Bedroom", "position": "top-left", "x": 60, "y": 60 }
]
}
]
}
Expected output
Same listing as chapter 11, plus:
- A "Family Home" tag in the top-right of the title card (would say "Luxury Home" for a
price_number >= 1000000). - Scene durations now derived from
base_duration. Bump that variable to instantly retime the whole video.
Sample render: tutorial-12.mp4 (placeholder).
What you learned
- Expressions live inside
{{ ... }}and are detected by the presence of operators or function calls. - Ternary syntax:
condition ? value_if_true : value_if_false. - Built-in functions:
ceil,floor,round,min,max,length,upper,lower,concat, plus arithmetic and string operators. - Use single quotes inside expressions to keep the surrounding JSON valid.