Notification

A phone or desktop notification slides in: the app's icon and name, the time, a bold title and the message.

  • social/notification
  • Social
  • social
  • Overlay with alpha
  • 4.5 s (2–30 s)
Live in your browser
Notification at 16:9
0.00 / 4.50 s
Playing live with volito/browser, the engine a render uses. Each tab lays the item out again for that shape, not a crop. The graphic is transparent; the grey stands in for your footage.

Render it

npx volito render social/notification --prop app="MONARC" --prop title="Your cut is ready" --out notification.mov

That writes ProRes 4444 with alpha, ready to drop over footage. The same item in another shape, brand or format:

volito render social/notification --aspect 9:16 --style cobalt --out notification-9x16.mov
volito render social/notification --format mp4 --out notification.mp4
volito still social/notification --t 2.25 --out notification.png
volito info social/notification     # every prop and part
volito add social/notification      # copy its source into ./motion to edit

From Node:

import { findItem, renderVideo } from "volito";

await renderVideo(findItem("social/notification"), { props: { app: "MONARC", title: "Your cut is ready" }, out: "notification.mov" });

Or ask an agent with the MCP server connected: “Render the Volito notification (social/notification) in 9:16, in our brand.”

Props

Set each with --prop name=value, or all at once with --props and a JSON object.

PropTypeDefaultTakes
apptextMONARC≤ 18 chars
iconiconsparkle—
titletextYour cut is ready≤ 40 chars
messagetextThree versions exported in 4K. Tap to review before you post.≤ 110 chars
timetextnow≤ 10 chars
lookchoicephonephone | desktop

Parts

Each part takes any move, ease or idle: --motion banner.in=pop.

PartWhat it is
bannerthe notification

Tags: notification, phone, ui, overlay, alert

More in Social