creator-editing-studio 1.3.5 → 1.3.7
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/bin/init.mjs +18 -1
- package/bin/update.mjs +146 -0
- package/history.json +1 -0
- package/package.json +2 -1
- package/template/CLAUDE.md +292 -236
- package/template/STYLE.md +179 -179
- package/template/package.json +8 -3
- package/template/preview/README.md +34 -0
- package/template/preview/lib.mjs +177 -0
- package/template/preview/player.html +255 -0
- package/template/preview/server.mjs +161 -0
- package/template/preview/use.mjs +22 -0
- package/template/requirements.txt +27 -23
- package/template/scripts/align-script.py +138 -0
- package/template/scripts/check_pair.py +90 -90
- package/template/scripts/doctor.mjs +167 -141
- package/template/scripts/find_cuts.py +45 -45
- package/template/scripts/lib/languages.py +68 -0
- package/template/scripts/lib/media.mjs +228 -228
- package/template/scripts/refmotion.mjs +349 -0
- package/template/scripts/setup_models.py +89 -0
- package/template/scripts/stills.mjs +1 -1
- package/template/scripts/takes.mjs +424 -424
- package/template/scripts/track_head.py +157 -0
- package/template/scripts/transcribe.py +172 -103
- package/template/src/components/CommandCard.tsx +12 -11
- package/template/src/components/Cursor.tsx +153 -153
- package/template/src/components/HeadPin.tsx +42 -0
- package/template/src/compositions/BeatTest.tsx +16 -15
- package/template/src/lib/track.ts +67 -0
- package/template/src/lib/tweaks.tsx +98 -0
- package/template/templates/BRIEF.md +97 -97
- package/template/templates/STYLE.md +179 -179
|
@@ -1,97 +1,97 @@
|
|
|
1
|
-
# Brief: {{name}}
|
|
2
|
-
|
|
3
|
-
Fill in what you can. Plain words are fine. Leave a line blank if you don't care.
|
|
4
|
-
When done: drop your files in this folder's `footage/` (and `screenshots/`), then run
|
|
5
|
-
`npm run prep -- {{name}}` and start the session with "start {{name}}".
|
|
6
|
-
|
|
7
|
-
## Basics
|
|
8
|
-
Format: 16:9 <!-- 16:9, 9:16, or both -->
|
|
9
|
-
Language: en <!-- en, hi, ar ... the language you speak in the video -->
|
|
10
|
-
Talking head file: <!-- file name in footage/, e.g. —.mp4. Leave blank if there's only one clip. -->
|
|
11
|
-
Background-free copy: <!-- Optional. Leave blank. Only fill this in if you already export a
|
|
12
|
-
version with the background removed or replaced by flat green; the
|
|
13
|
-
cutout is built automatically from your normal footage otherwise. -->
|
|
14
|
-
Length target: <!-- e.g. 25s, 90s -->
|
|
15
|
-
|
|
16
|
-
## Script
|
|
17
|
-
<!-- Paste the script exactly as you read it. Numbers as digits: $99, 11 minutes, 3 days. -->
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
## The one thing viewers must remember
|
|
21
|
-
<!-- One sentence. Everything in the edit serves this. -->
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
## Must-have moments
|
|
25
|
-
<!-- By the words you say, not by time. Plain words are fine.
|
|
26
|
-
- When I say "look at this" → my clip shrinks and other creators' clips appear
|
|
27
|
-
- "millions of views" → a counter racing up to 1M+ -->
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
## Moments from references
|
|
31
|
-
<!-- READ FIRST, BEFORE ANY DESIGN DECISION. These, and the ones saved in references/references.md,
|
|
32
|
-
beat the house defaults wherever the two disagree. -->
|
|
33
|
-
<!-- You DON'T need the name of the effect. Clip + time + what you like about it.
|
|
34
|
-
Format: - clip-file.mp4 mm:ss-mm:ss — what you like (feel words are fine: snappy, floaty, punchy)
|
|
35
|
-
- a-reel-you-like.mp4 00:02-00:04 — the colour screens flipping with each phrase, feels punchy -->
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
## Effects from the library
|
|
39
|
-
<!-- Optional: pick any by name (see the list at the bottom), and say where.
|
|
40
|
-
- colour flip → "different person, different story" -->
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
## B-roll
|
|
44
|
-
<!-- Which clip where, by the words you say. Mark clips you DON'T want used.
|
|
45
|
-
- creators' clips → "all of these people" -->
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
## Screenshots / things to blur
|
|
49
|
-
<!-- Names, emails, prices, logos that must not be readable. -->
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
## CTA / ending
|
|
53
|
-
<!-- What the viewer should do, and what the last frame shows. -->
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
## Sound
|
|
57
|
-
SFX library: audio/ <!-- put sound effects in this folder's audio/, or say "none" -->
|
|
58
|
-
Music: added by me in Premiere / Instagram <!-- or a file name in audio/ -->
|
|
59
|
-
|
|
60
|
-
## Don't want
|
|
61
|
-
<!-- Anything you dislike: e.g. boxes over my footage, huge text, bouncy motion. -->
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
---
|
|
65
|
-
|
|
66
|
-
### Effects library (names you can use)
|
|
67
|
-
| Name | What it looks like |
|
|
68
|
-
|---|---|
|
|
69
|
-
| Text behind me | Big headline sits behind your head (works from normal footage) |
|
|
70
|
-
| Card swap | You shrink into a rounded card, turn into another clip mid-shrink, a row of cards slides in and drifts |
|
|
71
|
-
| Colour flip | Hard cuts to solid accent / ink screens on each phrase; a word rolls into the next and the colours swap |
|
|
72
|
-
| Counter race | A number races up from 0 and lands on a value (e.g. 1,000,000+) |
|
|
73
|
-
| Zoom-through cut | A jump cut hidden by a quick push-in that eases back — used on every cut by default |
|
|
74
|
-
| Gradient CTA | Dark gradient rises from the bottom, small label + big word typed on the VO, then ticked pointers |
|
|
75
|
-
| Browser mockup | Screenshots inside a clean browser window that pans and zooms to the detail |
|
|
76
|
-
| Pointer click | An arrow glides to a spot and clicks, with a ripple |
|
|
77
|
-
| Rolling number | Digits roll from one value to another (e.g. $26.50 → $48.94) |
|
|
78
|
-
| Highlight marker | Accent marker wipes behind a key phrase |
|
|
79
|
-
| Side card | You move into a card beside the graphics (16:9) or below them (9:16) |
|
|
80
|
-
| Headline to pill | A big headline shrinks into a small corner tag that stays on screen |
|
|
81
|
-
| Word-by-word captions | On by default (looks: clean, block, highlight, pop) |
|
|
82
|
-
| Whip pan | Fast blurred pan between two unrelated shots |
|
|
83
|
-
| Push | The next scene pushes the last one out |
|
|
84
|
-
| Mask wipe | A soft-edged wipe reveals the next scene |
|
|
85
|
-
| Match cut | Cut hidden inside a shared shape or movement |
|
|
86
|
-
| Dip | Quick dip through the background colour |
|
|
87
|
-
| Speed ramp | Glide into slow-mo (or speed-up) and back out |
|
|
88
|
-
| Beat cut | Cuts land on the beat of your music |
|
|
89
|
-
| Tighten it | Silence and filler words removed, every join hidden as a punch-in |
|
|
90
|
-
| Cut to the music | Whole edit built off the track: slow intro, faster build, hardest on the drop |
|
|
91
|
-
| Film look | Grain, halation, light leak, gate weave (looks: clean, film, super8, cinema) |
|
|
92
|
-
| Sound pass | Whooshes, impacts and risers placed off the cut list, ducked under the voice |
|
|
93
|
-
| Morph into state | An element becomes its next state in place — the row you click turns into the confirmation, instead of one thing fading out and another in |
|
|
94
|
-
| Directional blur | Anything moving fast smears and only resolves as it slows, including rolling digits and redrawing lines |
|
|
95
|
-
| Overshoot and settle | Arrivals come in slightly too big, or just past the mark, and ease back |
|
|
96
|
-
| Live data morph | A chart or list updates in place: only the data moves, the panel never re-enters |
|
|
97
|
-
| Ghosted type-ahead | Text types itself into a pill that grows with it, the words still to come already there in pale grey |
|
|
1
|
+
# Brief: {{name}}
|
|
2
|
+
|
|
3
|
+
Fill in what you can. Plain words are fine. Leave a line blank if you don't care.
|
|
4
|
+
When done: drop your files in this folder's `footage/` (and `screenshots/`), then run
|
|
5
|
+
`npm run prep -- {{name}}` and start the session with "start {{name}}".
|
|
6
|
+
|
|
7
|
+
## Basics
|
|
8
|
+
Format: 16:9 <!-- 16:9, 9:16, or both -->
|
|
9
|
+
Language: en <!-- en, hi, ar ... the language you speak in the video -->
|
|
10
|
+
Talking head file: <!-- file name in footage/, e.g. —.mp4. Leave blank if there's only one clip. -->
|
|
11
|
+
Background-free copy: <!-- Optional. Leave blank. Only fill this in if you already export a
|
|
12
|
+
version with the background removed or replaced by flat green; the
|
|
13
|
+
cutout is built automatically from your normal footage otherwise. -->
|
|
14
|
+
Length target: <!-- e.g. 25s, 90s -->
|
|
15
|
+
|
|
16
|
+
## Script
|
|
17
|
+
<!-- Paste the script exactly as you read it. Numbers as digits: $99, 11 minutes, 3 days. -->
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
## The one thing viewers must remember
|
|
21
|
+
<!-- One sentence. Everything in the edit serves this. -->
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
## Must-have moments
|
|
25
|
+
<!-- By the words you say, not by time. Plain words are fine.
|
|
26
|
+
- When I say "look at this" → my clip shrinks and other creators' clips appear
|
|
27
|
+
- "millions of views" → a counter racing up to 1M+ -->
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
## Moments from references
|
|
31
|
+
<!-- READ FIRST, BEFORE ANY DESIGN DECISION. These, and the ones saved in references/references.md,
|
|
32
|
+
beat the house defaults wherever the two disagree. -->
|
|
33
|
+
<!-- You DON'T need the name of the effect. Clip + time + what you like about it.
|
|
34
|
+
Format: - clip-file.mp4 mm:ss-mm:ss — what you like (feel words are fine: snappy, floaty, punchy)
|
|
35
|
+
- a-reel-you-like.mp4 00:02-00:04 — the colour screens flipping with each phrase, feels punchy -->
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
## Effects from the library
|
|
39
|
+
<!-- Optional: pick any by name (see the list at the bottom), and say where.
|
|
40
|
+
- colour flip → "different person, different story" -->
|
|
41
|
+
|
|
42
|
+
|
|
43
|
+
## B-roll
|
|
44
|
+
<!-- Which clip where, by the words you say. Mark clips you DON'T want used.
|
|
45
|
+
- creators' clips → "all of these people" -->
|
|
46
|
+
|
|
47
|
+
|
|
48
|
+
## Screenshots / things to blur
|
|
49
|
+
<!-- Names, emails, prices, logos that must not be readable. -->
|
|
50
|
+
|
|
51
|
+
|
|
52
|
+
## CTA / ending
|
|
53
|
+
<!-- What the viewer should do, and what the last frame shows. -->
|
|
54
|
+
|
|
55
|
+
|
|
56
|
+
## Sound
|
|
57
|
+
SFX library: audio/ <!-- put sound effects in this folder's audio/, or say "none" -->
|
|
58
|
+
Music: added by me in Premiere / Instagram <!-- or a file name in audio/ -->
|
|
59
|
+
|
|
60
|
+
## Don't want
|
|
61
|
+
<!-- Anything you dislike: e.g. boxes over my footage, huge text, bouncy motion. -->
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
---
|
|
65
|
+
|
|
66
|
+
### Effects library (names you can use)
|
|
67
|
+
| Name | What it looks like |
|
|
68
|
+
|---|---|
|
|
69
|
+
| Text behind me | Big headline sits behind your head (works from normal footage) |
|
|
70
|
+
| Card swap | You shrink into a rounded card, turn into another clip mid-shrink, a row of cards slides in and drifts |
|
|
71
|
+
| Colour flip | Hard cuts to solid accent / ink screens on each phrase; a word rolls into the next and the colours swap |
|
|
72
|
+
| Counter race | A number races up from 0 and lands on a value (e.g. 1,000,000+) |
|
|
73
|
+
| Zoom-through cut | A jump cut hidden by a quick push-in that eases back — used on every cut by default |
|
|
74
|
+
| Gradient CTA | Dark gradient rises from the bottom, small label + big word typed on the VO, then ticked pointers |
|
|
75
|
+
| Browser mockup | Screenshots inside a clean browser window that pans and zooms to the detail |
|
|
76
|
+
| Pointer click | An arrow glides to a spot and clicks, with a ripple |
|
|
77
|
+
| Rolling number | Digits roll from one value to another (e.g. $26.50 → $48.94) |
|
|
78
|
+
| Highlight marker | Accent marker wipes behind a key phrase |
|
|
79
|
+
| Side card | You move into a card beside the graphics (16:9) or below them (9:16) |
|
|
80
|
+
| Headline to pill | A big headline shrinks into a small corner tag that stays on screen |
|
|
81
|
+
| Word-by-word captions | On by default (looks: clean, block, highlight, pop) |
|
|
82
|
+
| Whip pan | Fast blurred pan between two unrelated shots |
|
|
83
|
+
| Push | The next scene pushes the last one out |
|
|
84
|
+
| Mask wipe | A soft-edged wipe reveals the next scene |
|
|
85
|
+
| Match cut | Cut hidden inside a shared shape or movement |
|
|
86
|
+
| Dip | Quick dip through the background colour |
|
|
87
|
+
| Speed ramp | Glide into slow-mo (or speed-up) and back out |
|
|
88
|
+
| Beat cut | Cuts land on the beat of your music |
|
|
89
|
+
| Tighten it | Silence and filler words removed, every join hidden as a punch-in |
|
|
90
|
+
| Cut to the music | Whole edit built off the track: slow intro, faster build, hardest on the drop |
|
|
91
|
+
| Film look | Grain, halation, light leak, gate weave (looks: clean, film, super8, cinema) |
|
|
92
|
+
| Sound pass | Whooshes, impacts and risers placed off the cut list, ducked under the voice |
|
|
93
|
+
| Morph into state | An element becomes its next state in place — the row you click turns into the confirmation, instead of one thing fading out and another in |
|
|
94
|
+
| Directional blur | Anything moving fast smears and only resolves as it slows, including rolling digits and redrawing lines |
|
|
95
|
+
| Overshoot and settle | Arrivals come in slightly too big, or just past the mark, and ease back |
|
|
96
|
+
| Live data morph | A chart or list updates in place: only the data moves, the panel never re-enters |
|
|
97
|
+
| Ghosted type-ahead | Text types itself into a pill that grows with it, the words still to come already there in pale grey |
|
|
@@ -1,179 +1,179 @@
|
|
|
1
|
-
<!-- This is YOUR style guide, and it starts deliberately half-empty.
|
|
2
|
-
|
|
3
|
-
Parts 1 to 6 are craft standards: things that hold for any brand, most of them
|
|
4
|
-
measured rather than argued. Leave them alone until you have a reason not to, and
|
|
5
|
-
your edits will come out clean rather than random.
|
|
6
|
-
|
|
7
|
-
Parts 7 and 8 are yours and begin blank. Every time you approve or reject something,
|
|
8
|
-
write it down there. That is the half that makes edits look like YOURS instead of
|
|
9
|
-
merely competent, and it is the half nobody can hand you. -->
|
|
10
|
-
|
|
11
|
-
# House style
|
|
12
|
-
|
|
13
|
-
What every edit must look, move and sound like. `CLAUDE.md` says *how* to build; this
|
|
14
|
-
file says *what it must come out like*.
|
|
15
|
-
|
|
16
|
-
When this file and a reference disagree, this file wins unless you say otherwise.
|
|
17
|
-
|
|
18
|
-
---
|
|
19
|
-
|
|
20
|
-
## 1. Your identity
|
|
21
|
-
|
|
22
|
-
Everything visual comes from `src/design/tokens.ts`. That file is the single source of
|
|
23
|
-
your typeface, your colours, your spacing and your type scale — change it there and every
|
|
24
|
-
video changes with it. Never hard-code a colour or a font family into a composition.
|
|
25
|
-
|
|
26
|
-
- **Type:** one display typeface. Heavy weights for headlines, numbers and hero words;
|
|
27
|
-
medium for labels and pointers.
|
|
28
|
-
- **Colour:** one accent, plus ink and a light ground. Resist a second accent — two
|
|
29
|
-
accents read as a template, one reads as a brand.
|
|
30
|
-
- On footage: accent text, with a soft glow so it survives a busy frame.
|
|
31
|
-
- On a light ground: ink text, with the accent used only to mark the word that matters.
|
|
32
|
-
|
|
33
|
-
## 2. Type scale
|
|
34
|
-
|
|
35
|
-
Sizes are a starting ladder, not a law. What matters is that you keep to *a* ladder.
|
|
36
|
-
|
|
37
|
-
| Role | 16:9 (1920x1080) | 9:16 (1080x1920) | Notes |
|
|
38
|
-
|---|---|---|---|
|
|
39
|
-
| Hero word | 200–320px | 130–220px | One on screen at a time, never two |
|
|
40
|
-
| Headline | ~116px | ~100px | Tight tracking, around -0.03em |
|
|
41
|
-
| Big number | ~170px | ~150px | Tabular digits while a counter runs |
|
|
42
|
-
| Label / eyebrow | ~40px | ~32px | Uppercase, open tracking, ~0.14em |
|
|
43
|
-
| Pointer / list item | ~42px | ~36px | |
|
|
44
|
-
| Captions | 46px | 42px | Crisp white, bold, soft dark shadow |
|
|
45
|
-
|
|
46
|
-
**If a word needs to be bigger than the ladder to feel important, the layout is wrong,
|
|
47
|
-
not the size.** Oversized type is the most common way an edit starts looking amateur.
|
|
48
|
-
|
|
49
|
-
## 3. Layout
|
|
50
|
-
|
|
51
|
-
- **The speaker stays full screen by default.** Rounded cards and frames around a talking
|
|
52
|
-
head make the edit look assembled rather than shot. A card is fine as a *transition*,
|
|
53
|
-
not as a container.
|
|
54
|
-
- Put text in the clear space the shot already gives you: sky, a wall, out-of-focus
|
|
55
|
-
background. Check where the head lands on every cut before committing a position.
|
|
56
|
-
- Captions live in one consistent zone per layout, over a dark area. They hide while the
|
|
57
|
-
same words are on screen as a graphic, and never linger into the next scene.
|
|
58
|
-
- Graphics are built from type, numbers, real screenshots and real footage. Decorative
|
|
59
|
-
shapes that mean nothing age badly and read as filler.
|
|
60
|
-
|
|
61
|
-
## 4. Motion
|
|
62
|
-
|
|
63
|
-
- The motion laws in `CLAUDE.md`, always. Eased, motion-blurred, nothing pops into place.
|
|
64
|
-
- **Zoom through jump cuts.** A small push on the cut hides the join; a hard snap exposes it.
|
|
65
|
-
- **Hard cuts only as a deliberate burst** — a few beats of solid colour synced to the
|
|
66
|
-
words, then back to smooth. Everything else morphs from one state to the next.
|
|
67
|
-
- Cover anything off-camera — reading, looking away, a fumble — with a graphic or a cut.
|
|
68
|
-
- Counters start at zero and only go up. No grey placeholder digits.
|
|
69
|
-
- Vary your shot lengths. Cutting everything to the same duration is the clearest sign
|
|
70
|
-
an edit was made by a machine rather than by someone making decisions.
|
|
71
|
-
|
|
72
|
-
## 5. Sound (half the reel)
|
|
73
|
-
|
|
74
|
-
- **The voice is never processed.** No reverb, no heavy compression, no "enhancement".
|
|
75
|
-
- Sound effects are short — whooshes 0.4–0.8s, hits 0.3–0.6s — faded, and placed in the
|
|
76
|
-
gaps between words rather than under them.
|
|
77
|
-
- Every new visual gets its own fitting sound. Reusing a sound that belonged to a
|
|
78
|
-
different look is the audio version of a template.
|
|
79
|
-
- **Subtle beats loud.** Big cinematic impacts on text almost always read as too much.
|
|
80
|
-
- Hand over voice and SFX stems plus a timecoded cue sheet with every delivery.
|
|
81
|
-
|
|
82
|
-
## 6. Colour, film looks and presets
|
|
83
|
-
|
|
84
|
-
**Most of a look comes from the shoot, not the grade.** Golden hour or one good window,
|
|
85
|
-
light behind or beside the subject, background well behind the subject, white balance
|
|
86
|
-
fixed rather than auto. Automated grading is a starting point and only when the footage's
|
|
87
|
-
light already resembles the reference — on mismatched light it will look wrong, and you
|
|
88
|
-
should trust your eye over any automatic match.
|
|
89
|
-
|
|
90
|
-
| Transition | When |
|
|
91
|
-
|---|---|
|
|
92
|
-
| whipPan | Between unrelated shots. Never twice in a row. |
|
|
93
|
-
| push | Moving forward through a list or a sequence. |
|
|
94
|
-
| maskWipe | A calm reveal. Pairs with a soft sound. |
|
|
95
|
-
| colourFlip | A burst on a phrase. Two or three, then back to smooth. |
|
|
96
|
-
| matchCut | Only when both shots share a shape or a direction. |
|
|
97
|
-
| dip | Changing subject without drama. |
|
|
98
|
-
|
|
99
|
-
| Caption look | When |
|
|
100
|
-
|---|---|
|
|
101
|
-
| clean | Default. Works over almost anything. |
|
|
102
|
-
| block | Busy or bright footage, where white alone gets lost. |
|
|
103
|
-
| highlight | Keeps the eye on the word being spoken. |
|
|
104
|
-
| pop | Fast edits. Not over heavy motion. |
|
|
105
|
-
|
|
106
|
-
| Film look | When |
|
|
107
|
-
|---|---|
|
|
108
|
-
| none | Graphics, screen recordings, anything where text is the subject. |
|
|
109
|
-
| clean | Default for a talking head. Enough grain to stop flat areas banding. |
|
|
110
|
-
| film | B-roll and travel. The one to reach for first. |
|
|
111
|
-
| super8 | Memory and nostalgia moments only. Never a whole video. |
|
|
112
|
-
| cinema | A held, wide, quiet shot. |
|
|
113
|
-
|
|
114
|
-
**Three things here were measured, not guessed. Do not quietly undo them:**
|
|
115
|
-
|
|
116
|
-
- Grain composites **normally**, not with `overlay`. On flat cream or flat ink there are
|
|
117
|
-
no midtones, and overlay grain measures 0.000 stddev — the layer does nothing at all.
|
|
118
|
-
- Grain is paid for in black level — blacks lift measurably at medium strength. Raise it
|
|
119
|
-
per shot when a nostalgia moment is worth milkier blacks; never raise the default.
|
|
120
|
-
- Halation blooms **highlights only**. The plate is crushed to black before it is blurred
|
|
121
|
-
and screened back. Without that crush, a bright frame blooms end to end and the blacks
|
|
122
|
-
go brown.
|
|
123
|
-
|
|
124
|
-
Speed ramps are eased, never a hard speed switch. Below 0.4x needs 50fps or higher source
|
|
125
|
-
footage — you cannot rescue slow motion that was not shot for it.
|
|
126
|
-
|
|
127
|
-
---
|
|
128
|
-
|
|
129
|
-
## 7. Where these defaults end and you begin
|
|
130
|
-
|
|
131
|
-
The sections above are **defaults**: a starting point tuned so that a video made on day one,
|
|
132
|
-
before you have told the system anything, comes out clean rather than embarrassing. Captions
|
|
133
|
-
sit at a readable size with a measured shadow, cuts are eased, grain is restrained, the voice
|
|
134
|
-
is untouched.
|
|
135
|
-
|
|
136
|
-
Defaults are also the reason an edit can come out *anonymous*. They are what everybody gets.
|
|
137
|
-
Three things move an edit from the default toward yours, in increasing order of power:
|
|
138
|
-
|
|
139
|
-
**1. Your tokens.** `src/design/tokens.ts` carries your typeface, your colours, your scale.
|
|
140
|
-
This makes an edit *yours to look at* immediately.
|
|
141
|
-
|
|
142
|
-
**2. Your references.** Saved moments from edits you admire, each with a timecode and a note
|
|
143
|
-
on what you like about that exact moment. These are read before the plan for every video, and
|
|
144
|
-
they beat the defaults wherever the two disagree — a default is a guess that suits everyone,
|
|
145
|
-
a reference is a fact about you.
|
|
146
|
-
|
|
147
|
-
Roughly: **none** gives you clean and forgettable. **Three** is enough to spot a pattern.
|
|
148
|
-
**Seven or eight** is enough to tell a preference from a coincidence, and it is where edits
|
|
149
|
-
start looking authored.
|
|
150
|
-
|
|
151
|
-
**3. This file, as it fills up.** Sections 8 and 9 are the part no default can supply and no
|
|
152
|
-
competitor can copy, because they are a record of decisions only you have made. Every entry
|
|
153
|
-
narrows the next edit toward what you actually want.
|
|
154
|
-
|
|
155
|
-
Nothing here learns on its own. It gets better because the brief gets richer — so the ten
|
|
156
|
-
minutes spent writing down why you rejected something is the highest-return ten minutes
|
|
157
|
-
available to you.
|
|
158
|
-
|
|
159
|
-
---
|
|
160
|
-
|
|
161
|
-
## 8. Approved (your effects library)
|
|
162
|
-
|
|
163
|
-
<!-- Empty on purpose. When something works, write it down here: what it is, and where
|
|
164
|
-
you approved it. Next time you can ask for it by name instead of describing it
|
|
165
|
-
again, and every future video inherits the decision. -->
|
|
166
|
-
|
|
167
|
-
| Beat | What it is | Where you approved it |
|
|
168
|
-
|---|---|---|
|
|
169
|
-
| | | |
|
|
170
|
-
|
|
171
|
-
## 9. Rejected (don't do these again)
|
|
172
|
-
|
|
173
|
-
<!-- This table is worth more than the one above. A list of things you have ruled out is
|
|
174
|
-
the fastest way to stop an edit drifting back toward generic, because it removes
|
|
175
|
-
options rather than adding them. Add a line every time you say "not that". -->
|
|
176
|
-
|
|
177
|
-
| What | Why | Where |
|
|
178
|
-
|---|---|---|
|
|
179
|
-
| | | |
|
|
1
|
+
<!-- This is YOUR style guide, and it starts deliberately half-empty.
|
|
2
|
+
|
|
3
|
+
Parts 1 to 6 are craft standards: things that hold for any brand, most of them
|
|
4
|
+
measured rather than argued. Leave them alone until you have a reason not to, and
|
|
5
|
+
your edits will come out clean rather than random.
|
|
6
|
+
|
|
7
|
+
Parts 7 and 8 are yours and begin blank. Every time you approve or reject something,
|
|
8
|
+
write it down there. That is the half that makes edits look like YOURS instead of
|
|
9
|
+
merely competent, and it is the half nobody can hand you. -->
|
|
10
|
+
|
|
11
|
+
# House style
|
|
12
|
+
|
|
13
|
+
What every edit must look, move and sound like. `CLAUDE.md` says *how* to build; this
|
|
14
|
+
file says *what it must come out like*.
|
|
15
|
+
|
|
16
|
+
When this file and a reference disagree, this file wins unless you say otherwise.
|
|
17
|
+
|
|
18
|
+
---
|
|
19
|
+
|
|
20
|
+
## 1. Your identity
|
|
21
|
+
|
|
22
|
+
Everything visual comes from `src/design/tokens.ts`. That file is the single source of
|
|
23
|
+
your typeface, your colours, your spacing and your type scale — change it there and every
|
|
24
|
+
video changes with it. Never hard-code a colour or a font family into a composition.
|
|
25
|
+
|
|
26
|
+
- **Type:** one display typeface. Heavy weights for headlines, numbers and hero words;
|
|
27
|
+
medium for labels and pointers.
|
|
28
|
+
- **Colour:** one accent, plus ink and a light ground. Resist a second accent — two
|
|
29
|
+
accents read as a template, one reads as a brand.
|
|
30
|
+
- On footage: accent text, with a soft glow so it survives a busy frame.
|
|
31
|
+
- On a light ground: ink text, with the accent used only to mark the word that matters.
|
|
32
|
+
|
|
33
|
+
## 2. Type scale
|
|
34
|
+
|
|
35
|
+
Sizes are a starting ladder, not a law. What matters is that you keep to *a* ladder.
|
|
36
|
+
|
|
37
|
+
| Role | 16:9 (1920x1080) | 9:16 (1080x1920) | Notes |
|
|
38
|
+
|---|---|---|---|
|
|
39
|
+
| Hero word | 200–320px | 130–220px | One on screen at a time, never two |
|
|
40
|
+
| Headline | ~116px | ~100px | Tight tracking, around -0.03em |
|
|
41
|
+
| Big number | ~170px | ~150px | Tabular digits while a counter runs |
|
|
42
|
+
| Label / eyebrow | ~40px | ~32px | Uppercase, open tracking, ~0.14em |
|
|
43
|
+
| Pointer / list item | ~42px | ~36px | |
|
|
44
|
+
| Captions | 46px | 42px | Crisp white, bold, soft dark shadow |
|
|
45
|
+
|
|
46
|
+
**If a word needs to be bigger than the ladder to feel important, the layout is wrong,
|
|
47
|
+
not the size.** Oversized type is the most common way an edit starts looking amateur.
|
|
48
|
+
|
|
49
|
+
## 3. Layout
|
|
50
|
+
|
|
51
|
+
- **The speaker stays full screen by default.** Rounded cards and frames around a talking
|
|
52
|
+
head make the edit look assembled rather than shot. A card is fine as a *transition*,
|
|
53
|
+
not as a container.
|
|
54
|
+
- Put text in the clear space the shot already gives you: sky, a wall, out-of-focus
|
|
55
|
+
background. Check where the head lands on every cut before committing a position.
|
|
56
|
+
- Captions live in one consistent zone per layout, over a dark area. They hide while the
|
|
57
|
+
same words are on screen as a graphic, and never linger into the next scene.
|
|
58
|
+
- Graphics are built from type, numbers, real screenshots and real footage. Decorative
|
|
59
|
+
shapes that mean nothing age badly and read as filler.
|
|
60
|
+
|
|
61
|
+
## 4. Motion
|
|
62
|
+
|
|
63
|
+
- The motion laws in `CLAUDE.md`, always. Eased, motion-blurred, nothing pops into place.
|
|
64
|
+
- **Zoom through jump cuts.** A small push on the cut hides the join; a hard snap exposes it.
|
|
65
|
+
- **Hard cuts only as a deliberate burst** — a few beats of solid colour synced to the
|
|
66
|
+
words, then back to smooth. Everything else morphs from one state to the next.
|
|
67
|
+
- Cover anything off-camera — reading, looking away, a fumble — with a graphic or a cut.
|
|
68
|
+
- Counters start at zero and only go up. No grey placeholder digits.
|
|
69
|
+
- Vary your shot lengths. Cutting everything to the same duration is the clearest sign
|
|
70
|
+
an edit was made by a machine rather than by someone making decisions.
|
|
71
|
+
|
|
72
|
+
## 5. Sound (half the reel)
|
|
73
|
+
|
|
74
|
+
- **The voice is never processed.** No reverb, no heavy compression, no "enhancement".
|
|
75
|
+
- Sound effects are short — whooshes 0.4–0.8s, hits 0.3–0.6s — faded, and placed in the
|
|
76
|
+
gaps between words rather than under them.
|
|
77
|
+
- Every new visual gets its own fitting sound. Reusing a sound that belonged to a
|
|
78
|
+
different look is the audio version of a template.
|
|
79
|
+
- **Subtle beats loud.** Big cinematic impacts on text almost always read as too much.
|
|
80
|
+
- Hand over voice and SFX stems plus a timecoded cue sheet with every delivery.
|
|
81
|
+
|
|
82
|
+
## 6. Colour, film looks and presets
|
|
83
|
+
|
|
84
|
+
**Most of a look comes from the shoot, not the grade.** Golden hour or one good window,
|
|
85
|
+
light behind or beside the subject, background well behind the subject, white balance
|
|
86
|
+
fixed rather than auto. Automated grading is a starting point and only when the footage's
|
|
87
|
+
light already resembles the reference — on mismatched light it will look wrong, and you
|
|
88
|
+
should trust your eye over any automatic match.
|
|
89
|
+
|
|
90
|
+
| Transition | When |
|
|
91
|
+
|---|---|
|
|
92
|
+
| whipPan | Between unrelated shots. Never twice in a row. |
|
|
93
|
+
| push | Moving forward through a list or a sequence. |
|
|
94
|
+
| maskWipe | A calm reveal. Pairs with a soft sound. |
|
|
95
|
+
| colourFlip | A burst on a phrase. Two or three, then back to smooth. |
|
|
96
|
+
| matchCut | Only when both shots share a shape or a direction. |
|
|
97
|
+
| dip | Changing subject without drama. |
|
|
98
|
+
|
|
99
|
+
| Caption look | When |
|
|
100
|
+
|---|---|
|
|
101
|
+
| clean | Default. Works over almost anything. |
|
|
102
|
+
| block | Busy or bright footage, where white alone gets lost. |
|
|
103
|
+
| highlight | Keeps the eye on the word being spoken. |
|
|
104
|
+
| pop | Fast edits. Not over heavy motion. |
|
|
105
|
+
|
|
106
|
+
| Film look | When |
|
|
107
|
+
|---|---|
|
|
108
|
+
| none | Graphics, screen recordings, anything where text is the subject. |
|
|
109
|
+
| clean | Default for a talking head. Enough grain to stop flat areas banding. |
|
|
110
|
+
| film | B-roll and travel. The one to reach for first. |
|
|
111
|
+
| super8 | Memory and nostalgia moments only. Never a whole video. |
|
|
112
|
+
| cinema | A held, wide, quiet shot. |
|
|
113
|
+
|
|
114
|
+
**Three things here were measured, not guessed. Do not quietly undo them:**
|
|
115
|
+
|
|
116
|
+
- Grain composites **normally**, not with `overlay`. On flat cream or flat ink there are
|
|
117
|
+
no midtones, and overlay grain measures 0.000 stddev — the layer does nothing at all.
|
|
118
|
+
- Grain is paid for in black level — blacks lift measurably at medium strength. Raise it
|
|
119
|
+
per shot when a nostalgia moment is worth milkier blacks; never raise the default.
|
|
120
|
+
- Halation blooms **highlights only**. The plate is crushed to black before it is blurred
|
|
121
|
+
and screened back. Without that crush, a bright frame blooms end to end and the blacks
|
|
122
|
+
go brown.
|
|
123
|
+
|
|
124
|
+
Speed ramps are eased, never a hard speed switch. Below 0.4x needs 50fps or higher source
|
|
125
|
+
footage — you cannot rescue slow motion that was not shot for it.
|
|
126
|
+
|
|
127
|
+
---
|
|
128
|
+
|
|
129
|
+
## 7. Where these defaults end and you begin
|
|
130
|
+
|
|
131
|
+
The sections above are **defaults**: a starting point tuned so that a video made on day one,
|
|
132
|
+
before you have told the system anything, comes out clean rather than embarrassing. Captions
|
|
133
|
+
sit at a readable size with a measured shadow, cuts are eased, grain is restrained, the voice
|
|
134
|
+
is untouched.
|
|
135
|
+
|
|
136
|
+
Defaults are also the reason an edit can come out *anonymous*. They are what everybody gets.
|
|
137
|
+
Three things move an edit from the default toward yours, in increasing order of power:
|
|
138
|
+
|
|
139
|
+
**1. Your tokens.** `src/design/tokens.ts` carries your typeface, your colours, your scale.
|
|
140
|
+
This makes an edit *yours to look at* immediately.
|
|
141
|
+
|
|
142
|
+
**2. Your references.** Saved moments from edits you admire, each with a timecode and a note
|
|
143
|
+
on what you like about that exact moment. These are read before the plan for every video, and
|
|
144
|
+
they beat the defaults wherever the two disagree — a default is a guess that suits everyone,
|
|
145
|
+
a reference is a fact about you.
|
|
146
|
+
|
|
147
|
+
Roughly: **none** gives you clean and forgettable. **Three** is enough to spot a pattern.
|
|
148
|
+
**Seven or eight** is enough to tell a preference from a coincidence, and it is where edits
|
|
149
|
+
start looking authored.
|
|
150
|
+
|
|
151
|
+
**3. This file, as it fills up.** Sections 8 and 9 are the part no default can supply and no
|
|
152
|
+
competitor can copy, because they are a record of decisions only you have made. Every entry
|
|
153
|
+
narrows the next edit toward what you actually want.
|
|
154
|
+
|
|
155
|
+
Nothing here learns on its own. It gets better because the brief gets richer — so the ten
|
|
156
|
+
minutes spent writing down why you rejected something is the highest-return ten minutes
|
|
157
|
+
available to you.
|
|
158
|
+
|
|
159
|
+
---
|
|
160
|
+
|
|
161
|
+
## 8. Approved (your effects library)
|
|
162
|
+
|
|
163
|
+
<!-- Empty on purpose. When something works, write it down here: what it is, and where
|
|
164
|
+
you approved it. Next time you can ask for it by name instead of describing it
|
|
165
|
+
again, and every future video inherits the decision. -->
|
|
166
|
+
|
|
167
|
+
| Beat | What it is | Where you approved it |
|
|
168
|
+
|---|---|---|
|
|
169
|
+
| | | |
|
|
170
|
+
|
|
171
|
+
## 9. Rejected (don't do these again)
|
|
172
|
+
|
|
173
|
+
<!-- This table is worth more than the one above. A list of things you have ruled out is
|
|
174
|
+
the fastest way to stop an edit drifting back toward generic, because it removes
|
|
175
|
+
options rather than adding them. Add a line every time you say "not that". -->
|
|
176
|
+
|
|
177
|
+
| What | Why | Where |
|
|
178
|
+
|---|---|---|
|
|
179
|
+
| | | |
|