greenlight-motion 0.3.4 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/NOTICE +4 -0
- package/README.md +43 -10
- package/THIRD_PARTY_LICENSES.md +1 -1
- package/cli/index.mjs +118 -13
- package/cli/plugin3d.mjs +202 -0
- package/dist/assets/rigWorker-CGpWyn_f.js +1 -0
- package/dist/bundle-inputs.json +59 -1
- package/dist/greenlight-motion-script.mjs +17146 -355
- package/dist/greenlight-motion.js +1104 -763
- package/dist/greenlight-motion.mjs +79577 -73213
- package/dist/script-inputs.json +8 -1
- package/package.json +9 -1
- package/schema/capabilities.json +1 -1
- package/skill/SKILL.md +22 -11
- package/skill/references/scene-script.md +88 -2
- package/skill/references/video-3d.md +323 -101
- package/skill/references/video-backgrounds.md +89 -41
- package/skill/references/video-camera.md +159 -83
- package/skill/references/video-design.md +39 -7
- package/skill/references/video-effects.md +969 -641
- package/skill/references/video-grid.md +24 -24
- package/skill/references/video-keyframes.md +151 -52
- package/skill/references/video-particles.md +42 -29
- package/skill/references/video-paths.md +70 -65
- package/skill/references/video-projects.md +175 -98
- package/skill/references/video-shapes.md +95 -31
- package/skill/references/video-text-kinetic.md +78 -27
- package/skill/references/video-text-presets.md +738 -17
- package/skill/references/video-text.md +209 -81
- package/skill/references/video-transitions.md +72 -17
- package/skill/references/video-world3d.md +1548 -0
- package/skill/references/world3d-schema.json +15118 -0
package/skill/SKILL.md
CHANGED
|
@@ -18,7 +18,7 @@ You never write UI or animation code. If something is not in the format, it is n
|
|
|
18
18
|
## Setup (once per machine)
|
|
19
19
|
|
|
20
20
|
```
|
|
21
|
-
npx greenlight-motion@0.
|
|
21
|
+
npx greenlight-motion@0.5.0 doctor
|
|
22
22
|
```
|
|
23
23
|
|
|
24
24
|
It checks Node 18+, Chrome or Edge, WebGPU and H.264 encoding, and prints a fix for anything missing. Do not install
|
|
@@ -39,7 +39,7 @@ animation presets (the same converter the GreenLight Motion connector uses in Cl
|
|
|
39
39
|
keyframes rarely look as good. The format, the design rules and the catalogues: `skill/references/scene-script.md`.
|
|
40
40
|
|
|
41
41
|
```
|
|
42
|
-
npx greenlight-motion@0.
|
|
42
|
+
npx greenlight-motion@0.5.0 script <folder> --from scenes.json # or write <folder>/script.json, then: script <folder>
|
|
43
43
|
```
|
|
44
44
|
|
|
45
45
|
Then `check` and `stills` (below), fix the SCRIPT and run `script` again — it rewrites `project.json`. A scene's
|
|
@@ -47,6 +47,16 @@ Then `check` and `stills` (below), fix the SCRIPT and run `script` again — it
|
|
|
47
47
|
`z`). For what a script can't say (3D models, particles, motion paths, masks, text animators by hand), go on from `project.json` with the
|
|
48
48
|
workflow below and stop running `script` (it refuses to overwrite a project edited since, unless `--force`).
|
|
49
49
|
|
|
50
|
+
**A real 3D shot** (a product on a table, glass and liquids, studio light, a camera move): the script's `world`, GreenLight
|
|
51
|
+
Dash's own 3D Scene JSON — objects built from ops, materials, lights, `scene.camera` or a ready move, Draft as it plays and
|
|
52
|
+
Final (path traced) for the render. `script` checks it strictly: a field the 3D engine would ignore fails with its path and
|
|
53
|
+
the right name. Format and example: `skill/references/scene-script.md` (A 3D Scene); every field, op and material:
|
|
54
|
+
`references/video-world3d.md` and `references/world3d-schema.json`. A folder with a Scene plays from a local server
|
|
55
|
+
(`review`), not by double-click; `check`, `stills` and `render` open it that way themselves. Keep Final short (seconds per
|
|
56
|
+
frame) and judge glass and liquids in a Final still: Draft shows no liquid inside glass. The 3D engine is a plugin,
|
|
57
|
+
`greenlight-motion-3d`: the CLI downloads it by itself the first time a folder has a `world` (once, into the user's cache);
|
|
58
|
+
`npx greenlight-motion@0.5.0 add-3d` gets it ahead, `doctor` shows it. Never tell the user to install it.
|
|
59
|
+
|
|
50
60
|
## Beyond the script: the signature visual
|
|
51
61
|
|
|
52
62
|
The script gives structure; the picture that makes the video THIS product's usually needs the engine's full format.
|
|
@@ -85,14 +95,14 @@ What the engine does there, so you don't learn it from a broken frame:
|
|
|
85
95
|
|
|
86
96
|
## Workflow
|
|
87
97
|
|
|
88
|
-
1. `npx greenlight-motion@0.
|
|
98
|
+
1. `npx greenlight-motion@0.5.0 init <folder>` — starts from a working example (title, subtitle, accent line, four
|
|
89
99
|
options). `--from file.json` starts from a project you have (for example one exported from GreenLight Dash).
|
|
90
100
|
2. Edit `<folder>/project.json` — for changes to an EXISTING project prefer `apply` (below): it checks every edit and
|
|
91
101
|
applies all or nothing. Put pictures, video, sound and fonts in `<folder>/assets/` and refer to them as
|
|
92
102
|
`"asset:<file>"` (e.g. `"url": "asset:product.png"`).
|
|
93
|
-
3. `npx greenlight-motion@0.
|
|
103
|
+
3. `npx greenlight-motion@0.5.0 check <folder>` — fix everything it lists (missing files, template mistakes, blank
|
|
94
104
|
frames, page errors), and read its notes: text the engine wraps where you did not break it. `--json` for machine output.
|
|
95
|
-
4. `npx greenlight-motion@0.
|
|
105
|
+
4. `npx greenlight-motion@0.5.0 stills <folder>` — renders frames and **a labelled contact sheet**. Open and look at
|
|
96
106
|
it before you go on: layout, readability, timing. Fix and repeat. `--at 0.5,1.2,3` for exact times.
|
|
97
107
|
5. Hand it over: tell the user to open `<folder>/index.html` (Chrome or Edge), or `pack` it into one file, or
|
|
98
108
|
`render` the MP4 yourself (`--fps 60 --motion-blur` for fast motion).
|
|
@@ -156,8 +166,9 @@ editor's own normalizer), so write only what you mean.
|
|
|
156
166
|
|
|
157
167
|
Full references (generated from the editor's own docs; ignore the `/api/` routes they mention):
|
|
158
168
|
`skill/references/` — video-design, scene-script, video-projects, video-text, video-text-kinetic, video-text-presets, video-shapes, video-keyframes,
|
|
159
|
-
video-camera, video-3d, video-effects, video-transitions, video-particles, video-paths, video-backgrounds, video-grid
|
|
160
|
-
|
|
169
|
+
video-camera, video-3d, video-effects, video-transitions, video-particles, video-paths, video-backgrounds, video-grid,
|
|
170
|
+
video-world3d (the 3D Scene, with world3d-schema.json).
|
|
171
|
+
Machine-readable lists: `npx greenlight-motion@0.5.0 schema effects | transitions | easings | paths | expressions`.
|
|
161
172
|
|
|
162
173
|
## Template
|
|
163
174
|
|
|
@@ -204,7 +215,7 @@ an absolute moment; `align` `sync` (default) / `start` / `end`; `offset` seconds
|
|
|
204
215
|
|
|
205
216
|
The library is 77 hand-picked sounds in categories (whooshes and swooshes, transitions, clicks, pop-ups and
|
|
206
217
|
notifications, data blips, typing and writing, foley, bubbles, impacts and bass drops, camera, gears, voice clips).
|
|
207
|
-
`npx greenlight-motion@0.
|
|
218
|
+
`npx greenlight-motion@0.5.0 schema sounds` lists every one with its `category`, `use` (what it is for), `duration`
|
|
208
219
|
and `sync`. Pick by `category` and `use`, then by name.
|
|
209
220
|
|
|
210
221
|
- **Where the files come from:** the GreenLight sound CDN. `build` downloads each sound a cue uses into
|
|
@@ -220,7 +231,7 @@ The page has **Notes**: the user marks what should change right on the frame (a
|
|
|
220
231
|
and writes a note for each mark. Every note carries the moment (seconds and frame), the mark in composition pixels
|
|
221
232
|
and the layers under it (item ids in project.json), so you change exactly that and nothing else.
|
|
222
233
|
|
|
223
|
-
- **They review on this computer:** run `npx greenlight-motion@0.
|
|
234
|
+
- **They review on this computer:** run `npx greenlight-motion@0.5.0 review <folder>` and give them the URL it prints
|
|
224
235
|
(it keeps running; `--open` opens their browser, only when they ask). Their notes land in `<folder>/review/`: read
|
|
225
236
|
`review/NOTES.md`, look at the `at-<t>s.png` pictures (the marks are numbered), make the changes (`apply`), `build`
|
|
226
237
|
again and tell them to reload the page.
|
|
@@ -249,11 +260,11 @@ that fails (`plugin`); look at `stills` for the look. A package that carries its
|
|
|
249
260
|
|
|
250
261
|
The same project opens in GreenLight Dash (the desktop editor this engine comes from) for full editing: the page's
|
|
251
262
|
edit note offers **Open in GreenLight Dash** (it imports the folder as a new project on the open board; a page with
|
|
252
|
-
changes saves a `.glvideo`). `npx greenlight-motion@0.
|
|
263
|
+
changes saves a `.glvideo`). `npx greenlight-motion@0.5.0 pack <folder> --glvideo` writes that file yourself: ONE
|
|
253
264
|
`.glvideo` (the project + its files) that opens in GreenLight Dash on a double-click, or dropped on its board. Hand it
|
|
254
265
|
over when the user wants to keep editing in the app. A
|
|
255
266
|
GreenLight Dash project comes the other way through the app's **Export for agents** — a ready folder like the one
|
|
256
|
-
`init` makes, with the options the author ticked. `npx greenlight-motion@0.
|
|
267
|
+
`init` makes, with the options the author ticked. `npx greenlight-motion@0.5.0 init <folder> --from <its project.json>`
|
|
257
268
|
starts from one too. Never tell the user they must install it: the page plays, changes options and renders on its own.
|
|
258
269
|
|
|
259
270
|
## Files
|
|
@@ -105,6 +105,92 @@ matte, masks, particles, 3D) goes on from `project.json`: SKILL.md, "Beyond the
|
|
|
105
105
|
- **music** (script level): `"music": { "src": file, "volume": 80, "fadeIn": 0.3, "fadeOut": 1.2, "startAt": 0 }` — one track under the video.
|
|
106
106
|
The file must exist when you run `script` (it reads its length): write a sound you make in code before the first run.
|
|
107
107
|
|
|
108
|
+
## A 3D Scene: `world`
|
|
109
|
+
|
|
110
|
+
For a real 3D shot — a product on a table, a bottle with liquid, a gadget turning under studio light — give the script a
|
|
111
|
+
`world`: GreenLight Dash's own 3D Scene (the same `rig.scene` JSON its editor stores), drawn in Draft as it plays and
|
|
112
|
+
path traced in Final. Keep it SIMPLE: objects built from ops (box, cylinder, lathe, extrude, bevel…), materials (glass,
|
|
113
|
+
liquids, metals, wood and other procedural patterns), up to a few lights, a bundled HDR environment. No files of your own
|
|
114
|
+
in a 3D Scene here (big scenes with meshes and textures belong in GreenLight Dash or a local run with the npm package).
|
|
115
|
+
`scenes` become optional: 2D titles over the world, see-through unless a scene sets its own `background`.
|
|
116
|
+
|
|
117
|
+
```json
|
|
118
|
+
{ "format": "16:9", "title": "Éclat", "world": {
|
|
119
|
+
"duration": 4,
|
|
120
|
+
"camera": { "move": "orbit", "amount": 30 },
|
|
121
|
+
"render": { "mode": "draft" },
|
|
122
|
+
"look": { "contrast": 1.15, "bloom": 0.06, "vignette": 0.2 },
|
|
123
|
+
"scene": {
|
|
124
|
+
"camera": { "at": [0, 0.2, 0.75], "target": [0, 0.1, 0], "fov": 30 },
|
|
125
|
+
"env": { "intensity": 0.3, "opaque": true },
|
|
126
|
+
"lights": [{ "id": "key", "type": "area", "at": [-0.5, 0.6, 0.5], "target": [0, 0.1, 0], "width": 0.5, "height": 0.5, "intensity": 6 },
|
|
127
|
+
{ "id": "rim", "type": "spot", "at": [0.3, 0.5, -0.4], "target": [0, 0.1, 0], "angle": 25, "penumbra": 0.4, "intensity": 4 }],
|
|
128
|
+
"materials": {
|
|
129
|
+
"wood": { "procedural": { "pattern": "wood", "planks": 3 }, "uvScale": [2, 2] },
|
|
130
|
+
"glass": { "roughness": 0.02, "transmission": 1, "ior": 1.5, "priority": 1 },
|
|
131
|
+
"perfume": { "transmission": 1, "ior": 1.36, "attenuationColor": "#e8a440", "attenuationDistance": 0.3, "priority": 2 },
|
|
132
|
+
"gold": { "metal": "gold", "roughness": 0.2 } },
|
|
133
|
+
"objects": [
|
|
134
|
+
{ "id": "table", "material": "wood", "at": [0, -0.02, 0], "graph": [{ "op": "box", "size": [1.2, 0.04, 0.7], "bevel": 0.004 }, { "op": "uvBox" }] },
|
|
135
|
+
{ "id": "bottle", "material": "glass", "at": [0, 0.001, 0], "graph": [{ "op": "cylinder", "radiusTop": 0.045, "radiusBottom": 0.045, "height": 0.16, "bevel": 0.006 }, { "op": "transform", "at": [0, 0.08, 0] }] },
|
|
136
|
+
{ "id": "liquid", "material": "perfume", "at": [0, 0.001, 0], "graph": [{ "op": "cylinder", "radiusTop": 0.0395, "radiusBottom": 0.0395, "height": 0.11 }, { "op": "transform", "at": [0, 0.06, 0] }] },
|
|
137
|
+
{ "id": "cap", "material": "gold", "at": [0, 0.177, 0], "graph": [{ "op": "cylinder", "radiusTop": 0.02, "radiusBottom": 0.02, "height": 0.03, "bevel": 0.003 }] } ] } },
|
|
138
|
+
"scenes": [{ "duration": 4, "elements": [{ "type": "text", "text": "ÉCLAT", "role": "headline", "at": "top" }] }] }
|
|
139
|
+
```
|
|
140
|
+
|
|
141
|
+
- `world` takes `scene`, `render`, `look`, `exposure`, `camera`, `duration`. `scene`, `render` and `look` are GreenLight Dash's
|
|
142
|
+
`rig.scene`, `rig.render` and `rig.look`: every field, op and material is in references/world3d.md and world3d-schema.json. Units are metres (model things at their
|
|
143
|
+
real size: the perfume bottle above is 16 cm tall), Y is up.
|
|
144
|
+
- **What `world` sets for you:** no Rig lights and no Rig backdrop (it writes `renderer: "world"`, `lights: []`,
|
|
145
|
+
`cyclorama: none`): the light is `scene.lights` plus `scene.env` (a bundled HDRI, `studio_small_03_1k` unless
|
|
146
|
+
`env.hdri` names another `/hdr/<name>.hdr` of the ten presets), and a floor, table or studio sweep is an object you model
|
|
147
|
+
(a box; a sweep is an `extrude` of an L-shaped profile with a rounded corner).
|
|
148
|
+
- **Checked strictly.** A field the 3D engine would ignore (a typo, a three.js name such as `emissive`, `position`, `color` on a
|
|
149
|
+
liquid) fails the build with its path and the right name (`world.scene.materials.glass.transmision: … did you mean
|
|
150
|
+
`transmission`?`), as does an unknown op or parameter, a material or parent that is not there, a broken lathe profile.
|
|
151
|
+
An op that fails only when the geometry is built (a boolean that cannot be made) shows in look_at_video's critique:
|
|
152
|
+
"the scene did not build: …".
|
|
153
|
+
- **The camera:** `scene.camera` (`at`, `target`, `fov`, `keys` for your own moves) or a ready move in `world.camera`: one
|
|
154
|
+
smooth in-out move over the whole clip, always looking at `target`. `push-in` starts at `scene.camera.at` and ends
|
|
155
|
+
`amount` of the way to the target (0–0.9 [0.25]); `pull-out` is the same backwards. `orbit` turns around the target by
|
|
156
|
+
`amount` degrees in all [40]; `rise` goes up by `amount` of the distance [0.25]; `slide-left` / `slide-right` move
|
|
157
|
+
sideways by `amount` of the distance [0.25], the target with them. These three are centred on `scene.camera.at`: half
|
|
158
|
+
the amount before it, half after, so frame the middle of the clip there. A scene's own 2D `camera` defaults to `none`
|
|
159
|
+
over a world (titles hold still).
|
|
160
|
+
- **Camera moves, worked.** Frame the subject with room to spare: the critique samples the whole move (every key and evenly
|
|
161
|
+
between them) and names an object the move takes out of the frame, and when.
|
|
162
|
+
- *Orbit* around a product: `"camera": { "move": "orbit", "amount": 40 }` with `"scene": { "camera": { "at": [0, 0.22, 0.8],
|
|
163
|
+
"target": [0, 0.09, 0], "fov": 30 } }`. The middle of the clip is shot from `at`; the turn goes 20° to each side, so a
|
|
164
|
+
framing that is tight from the front clips a wide object at the ends: step back (a longer `at`) or turn less.
|
|
165
|
+
- *Push-in* to a detail: `"camera": { "move": "push-in", "amount": 0.35 }` starts at `scene.camera.at` and ends 35 % of the
|
|
166
|
+
way to `target`, so the last frame is the tightest: aim `target` at the detail (the label, the cap). Your own keys do the
|
|
167
|
+
same with a lens change: `"keys": { "at": [{ "t": 0, "v": [0, 0.2, 1], "ease": "inOut" }, { "t": 4, "v": [0, 0.14, 0.5] }],
|
|
168
|
+
"fov": [{ "t": 0, "v": 30, "ease": "inOut" }, { "t": 4, "v": 24 }] }`.
|
|
169
|
+
- *Rack focus* (depth of field): `"camera": { "at": [0.25, 0.12, 0.55], "target": [0, 0.08, 0], "fov": 28, "fStop": 2,
|
|
170
|
+
"keys": { "focus": [{ "t": 0.8, "v": 0.42, "ease": "inOut" }, { "t": 2.2, "v": 0.78 }] } }`: sharp on what stands 0.42 m from
|
|
171
|
+
the camera, then on what stands 0.78 m away. `focus` is a distance in metres along the view (for an object at p:
|
|
172
|
+
(p − at)·(target − at) / |target − at|); `"@id"` holds the focus on an object, but keys from one `"@id"` to another jump
|
|
173
|
+
instead of racking, so key distances. A low `fStop` (1.4–2.8) makes the blur strong; leave `fStop` out for all sharp.
|
|
174
|
+
Draft blurs roughly; judge it in Final. Focus keys go with a ready move too: a push-in with `"focus": "@bottle"` stays sharp on the bottle.
|
|
175
|
+
- **Titles over it:** `scenes` are 2D layers over the world, see-through unless a scene sets its own `background`
|
|
176
|
+
(`style.background` does not cover the world). Keep a title clear of the objects: a 2D layer stands in the world's depth
|
|
177
|
+
(about 2.2 m from the camera at 1080 px high), so an object nearer the camera that overlaps it hides its letters. Put it where
|
|
178
|
+
the frame is calm and has the contrast its colour needs: a light title on a light set vanishes. The critique below gives each
|
|
179
|
+
object's span in % of the frame and checks every 2D layer: how much of it the objects hide, its contrast against what is
|
|
180
|
+
under it, whether it leaves the frame or the title-safe area (5 % in from each edge), and texts that overlap. The video is as long as the scenes and the world
|
|
181
|
+
lasts all of it (`world.duration` counts only for a world with no scenes).
|
|
182
|
+
- **Draft and Final.** `render.mode` `"draft"` (default) plays live; `"final"` path traces every frame (`spp` 16–64 here):
|
|
183
|
+
seconds per frame, so render Final only for the finished version, and short. Judge glass and liquids in Final: Draft shows no
|
|
184
|
+
liquid inside glass and no refraction, and only a rough depth of field.
|
|
185
|
+
- **No length limit here** (the chat caps a Final MP4 at 10 s at 64 samples; locally the only limit is your GPU's time).
|
|
186
|
+
- **The 3D plugin.** The 3D engine is a separate package, `greenlight-motion-3d`: `script`, `build`, `check`, `stills`
|
|
187
|
+
and `render` get it by themselves the first time a folder has a `world` (into the user's cache, once per version);
|
|
188
|
+
`npx greenlight-motion add-3d` gets it now, `doctor` says which version is there. Offline, point
|
|
189
|
+
`GREENLIGHT_MOTION_3D` at an unpacked copy or its .tgz.
|
|
190
|
+
- **Its critique.** look_at_video on a build with a world adds a critique of the middle frame: what the shot shows object by
|
|
191
|
+
object (its share of the frame, where it stands, what hides it, what is out of the camera), where each light stands against
|
|
192
|
+
the subject, the picture's numbers, and hints naming the field to change. Fix what it names, then build again.
|
|
193
|
+
|
|
108
194
|
## What makes it look made, not generated
|
|
109
195
|
|
|
110
196
|
references/video-design.md — the same design rules GreenLight Dash's agents and the chat connector use. Read it before
|
|
@@ -112,7 +198,7 @@ the first version and check every version against it.
|
|
|
112
198
|
|
|
113
199
|
## Catalogues
|
|
114
200
|
|
|
115
|
-
**Text animations** (`textAnimation`; ★ = preferred): ★ `glide-text` Glide Text · `glide-continuous` Glide Continuous · `smart-overshoot` Smart Overshoot · `glide-soft-stop` Glide Soft Stop · ★ `ember-type` Ember Type · `molten-edge` Molten Edge · `focus-type` Focus Type · `tumble-type` Tumble Type · `flap-down` Flap Down · `drop-swell` Drop Swell · `rain-type` Rain Type · `counter-sweep` Counter Sweep · `sunset-shrink` Sunset Shrink · `boomerang` Boomerang · ★ `swing-pop` Swing Pop · ★ `word-swing` Word Swing · ★ `letter-vortex` Letter Vortex · `center-burst` Center Burst · ★ `pendulum` Pendulum · `spin-pop` Spin Pop · `domino` Domino · `flip-pop` Flip Pop · `card-turn` Card Turn · `slam-zoom` Slam Zoom · `orbit` Orbit · ★ `fan-deal` Fan Deal · ★ `whip` Whip · `rubber-letters` Rubber Letters · `pop-letters` Pop Letters · `drop-swing` Drop Swing · `coin-spin` Coin Spin · `converge` Converge · `roll-in` Roll In · `door-swing` Door Swing · `pill-type` Pill Type · `card-type` Card Type · `word-bars` Word Bars · `line-stack` Word Stack · `marker-type` Marker Type · `card-erase` Card Erase · `colour-sweep` Colour Sweep · `glow-pass` Glow Pass · `wave-pass` Wave Pass · `pop-through` Pop Through · `shine` Shine · ★ `marker` Marker · ★ `outline-pass` Outline Pass · ★ `neon-flow` Neon Flow · `rainbow` Rainbow · `gradient-flow` Gradient Flow · `jitter` Jitter · `float` Float · `flicker` Flicker · `breathe` Breathing Wave · `shimmer` Shimmer · `decode` Decode · `binary` Binary Decode · `alphabet-roll` Alphabet Roll · ★ `glitch` Glitch · `classic-fade-up` Fade Up · `classic-fade-down` Fade Down · `classic-rise-mask` Rise (Mask) · `classic-blur-in` Blur In · `classic-slide-in` Slide In · `classic-side-mask` Side Mask · `classic-tilt-drop` Tilt Drop · `classic-flip-up` Flip Up · `classic-typewriter` Typewriter · `classic-wave-rise` Wave Rise · `classic-bounce-letters` Bounce Letters · `classic-materialize` Materialize · `classic-neon-runner` Neon Runner · `classic-ink-highlight` Ink Highlight · `classic-flash-type` Flash Type · `classic-karaoke-sweep` Karaoke Sweep · `classic-chase-loop` Chase Loop · `classic-sung-words` Sung Words · `classic-marker-lines` Marker Words · `classic-pill-grow` Pill Grow · `classic-lower-third` Lower Third · `classic-drop-bar` Drop Bar · `classic-outline-tag` Outline Tag · `classic-prompt-field` Prompt Field · `classic-random-pop` Random Pop · `classic-chaos-letters` Chaos Letters · `classic-random-rise` Random Rise · `classic-ransom-note` Ransom Note · `classic-editorial-typer` Editorial Typer
|
|
201
|
+
**Text animations** (`textAnimation`; ★ = preferred): ★ `glide-text` Glide Text · `glide-continuous` Glide Continuous · `smart-overshoot` Smart Overshoot · `glide-soft-stop` Glide Soft Stop · ★ `ember-type` Ember Type · `molten-edge` Molten Edge · `focus-type` Focus Type · `tumble-type` Tumble Type · `flap-down` Flap Down · `drop-swell` Drop Swell · `rain-type` Rain Type · `counter-sweep` Counter Sweep · `sunset-shrink` Sunset Shrink · `boomerang` Boomerang · ★ `swing-pop` Swing Pop · ★ `word-swing` Word Swing · ★ `letter-vortex` Letter Vortex · `center-burst` Center Burst · ★ `pendulum` Pendulum · `spin-pop` Spin Pop · `domino` Domino · `flip-pop` Flip Pop · `card-turn` Card Turn · `slam-zoom` Slam Zoom · `orbit` Orbit · ★ `fan-deal` Fan Deal · ★ `whip` Whip · `rubber-letters` Rubber Letters · `pop-letters` Pop Letters · `drop-swing` Drop Swing · `coin-spin` Coin Spin · `converge` Converge · `roll-in` Roll In · `door-swing` Door Swing · `title-push-3d` Title Push 3D · `perspective-type` Perspective Type · `rack-focus` Rack Focus · `stand-up` Stand Up · `strata` Strata · `spotlight` Spotlight · `ripple` Ripple · `pill-type` Pill Type · `card-type` Card Type · `word-bars` Word Bars · `line-stack` Word Stack · `marker-type` Marker Type · `card-erase` Card Erase · `colour-sweep` Colour Sweep · `glow-pass` Glow Pass · `wave-pass` Wave Pass · `pop-through` Pop Through · `shine` Shine · ★ `marker` Marker · ★ `outline-pass` Outline Pass · ★ `neon-flow` Neon Flow · `rainbow` Rainbow · `gradient-flow` Gradient Flow · `jitter` Jitter · `float` Float · `flicker` Flicker · `breathe` Breathing Wave · `shimmer` Shimmer · `decode` Decode · `binary` Binary Decode · `alphabet-roll` Alphabet Roll · ★ `glitch` Glitch · `classic-fade-up` Fade Up · `classic-fade-down` Fade Down · `classic-rise-mask` Rise (Mask) · `classic-blur-in` Blur In · `classic-slide-in` Slide In · `classic-side-mask` Side Mask · `classic-tilt-drop` Tilt Drop · `classic-flip-up` Flip Up · `classic-typewriter` Typewriter · `classic-wave-rise` Wave Rise · `classic-bounce-letters` Bounce Letters · `classic-materialize` Materialize · `classic-neon-runner` Neon Runner · `classic-ink-highlight` Ink Highlight · `classic-flash-type` Flash Type · `classic-karaoke-sweep` Karaoke Sweep · `classic-chase-loop` Chase Loop · `classic-sung-words` Sung Words · `classic-marker-lines` Marker Words · `classic-pill-grow` Pill Grow · `classic-lower-third` Lower Third · `classic-drop-bar` Drop Bar · `classic-outline-tag` Outline Tag · `classic-prompt-field` Prompt Field · `classic-random-pop` Random Pop · `classic-chaos-letters` Chaos Letters · `classic-random-rise` Random Rise · `classic-ransom-note` Ransom Note · `classic-editorial-typer` Editorial Typer
|
|
116
202
|
|
|
117
203
|
**Entrances** (`enter`): `slide` Slide · direction · `glide` Glide (in and out) · direction · `glide-stop` Glide Stop (in and out) · direction · `glide-floaty` Glide Floaty (in and out) · direction · `glide-endless` Glide Endless (in and out) · direction · `glide-diagonal` Glide Diagonal (in and out) · direction · `glide-arc` Glide Arc (in and out) · direction · `glide-close-pass` Glide Close Pass (in and out) · direction · `glide-fade-drift` Glide Fade Drift (in and out) · direction · `glide-bank` Glide Bank (in and out) · direction · `glide-swing-3d` Glide Swing 3D (in and out) · direction · `glide-linger` Glide Linger (in and out) · direction · `glide-soft-entry` Glide Soft Entry (in and out) · direction · `glide-blur` Glide Blur (in and out) · direction · `glide-spin-through` Glide Spin Through (in and out) · direction · `glide-depth-pass` Glide Depth Pass (in and out) · direction · `glide-tilt` Glide Tilt (in and out) · direction · `zoom-in` Zoom In · `mockup-close-up` Mockup Close-Up · `mockup-orbit-left` Orbit Left · `deck-drift` Deck Drift · `hero-punch` Hero Punch · `dark-spotlight` Dark Spotlight · `phone-app-swipe` Phone Swipe Reveal · `phone-app-punch` Phone App Punch In · `phone-app-tilt-drift` Phone Tilt Drift · `phone-app-cta-hold` CTA Hold Focus · `button-press` Button Press · `button-tap-flash` Tap Flash · `pop-overshoot` Pop Overshoot · `spring-in` Spring In · `rubber-wobble` Rubber Wobble · `tap-nudge` Tap Nudge · `whip-swing` Whip Swing · `flick-drop` Flick Drop · `jelly-shake` Jelly Shake · `heartbeat` Heartbeat · `impact-punch` Impact Punch · `pendulum-swing` Pendulum Swing · `loose-wiggle` Loose Wiggle · `shiver` Shiver · `float` Float · `flicker-in` Flicker In · `earthquake` Earthquake · `tumble-drop` Tumble Drop · `rubber-band` Rubber Band · `spring-twist` Spring Twist · `slingshot` Slingshot · `pendulum-in` Pendulum In · `smooth-overshoot-rise` Smooth Overshoot Rise · `spin-in` Spin In · `twist-in` Twist In · `roll-in` Roll In · `tilt-settle` Tilt Settle · `wind-up-spin` Wind-Up Spin
|
|
118
204
|
|
|
@@ -126,7 +212,7 @@ the first version and check every version against it.
|
|
|
126
212
|
|
|
127
213
|
**Zoom feels** (`camera.feel`): `studio` Studio · `calm` Calm · `precise` Precise · `lively` Lively · `follow` Follow. Full camera layers (paths, Smart Zoom on a recording's clicks, the drawn cursor): references/video-camera.md.
|
|
128
214
|
|
|
129
|
-
**Overlay effects** (`effects`): `glow`, ★ `bloom`, `auraBlur`, `gradientBeam`, ★ `gradientSweep`, `gradientGlow`, `fractalNoise`, ★ `rgbSplit`, `glitch`, `scanlines`, `flashBlink`, `vhs`, `fisheye`, `opticsCompensation`, `vignette`, ★ `echo`, `timeshift`, `radialBlur`, ★ `radialFastBlur`, `sharpen`, `mirror`, `waveWarp`, `warpStyles`, `shockwave`, `waveLines`, `waveRipple`, `fill`, `shapeRulers`, `copyColor`, `curves`, `turbulentDisplace`, `alphaChoker`, `extract`, ★ `colorama`, `posterize`, ★ `halftone`, ★ `fastCameraWiggle`, ★ `lightRays`, `longShadow`, `outlineBands`, `kaleidoscope`, `crtMatrix`, `pixelate`, `vectorFieldWarp`, `pixelStretch`, `neonGlow`, `edgeDetect`, `doubleExposure`, ★ `filmStock`, `fastBlur`, `gridLines`, `strip`, `ascii`, `objectDither`, `objectIsolines`, `objectWindow`, `objectSlitScan`, `objectCurtain`, `objectGrid`, `objectContour`, `objectNodes`, `objectLinks`, `objectFacets`, `objectMeasure`
|
|
215
|
+
**Overlay effects** (`effects`): `glow`, ★ `bloom`, `auraBlur`, `gradientBeam`, ★ `gradientSweep`, `gradientGlow`, `fractalNoise`, ★ `rgbSplit`, `glitch`, `scanlines`, `flashBlink`, `vhs`, `fisheye`, `opticsCompensation`, `vignette`, ★ `echo`, `timeshift`, `radialBlur`, ★ `radialFastBlur`, `sharpen`, `mirror`, `waveWarp`, `warpStyles`, `shockwave`, `waveLines`, `waveRipple`, `fill`, `shapeRulers`, `copyColor`, `curves`, `turbulentDisplace`, `alphaChoker`, `gooey`, `extract`, ★ `colorama`, `posterize`, ★ `halftone`, ★ `fastCameraWiggle`, ★ `lightRays`, `lightSweep`, `longShadow`, `outlineBands`, `kaleidoscope`, `crtMatrix`, `pixelate`, `vectorFieldWarp`, `pixelStretch`, `neonGlow`, `edgeDetect`, `doubleExposure`, ★ `filmStock`, `fastBlur`, `gridLines`, `strip`, `ascii`, `objectDither`, `objectIsolines`, `objectWindow`, `objectSlitScan`, `objectCurtain`, `objectGrid`, `objectContour`, `objectNodes`, `objectLinks`, `objectFacets`, `objectMeasure`
|
|
130
216
|
|
|
131
217
|
**Layer effects** (`effects`): `mockupFrame`, ★ `runningGlow`, `depthMap`, `depth3d`, `depthScan`, `fresnelRim`, ★ `motionBlur`, `posterizeTime`, ★ `motionTrail`, `autoFill`, ★ `repetile`, `regionDistort`, `bend`, `cornerPin`, `meshWarp`, `bezierWarp`, `rig`, ★ `droste`, `pryzm`, ★ `glass`, `chromaKey`, `layerMask`
|
|
132
218
|
|