Speech jigsaw

How to use it

Set most of the clip as full-frame word puzzles of the speaker's own lines, the camera turning to each new line, cutting back to the speaker once or twice for the biggest moment.

Where the speaker sits

Full sceneSuits itSmallAvoidSplitSuits itSideWorksDrawn overAvoid

Full scene: the scene fills the frame. Stock speaker from Pexels.

Palette

THIS IS A MOODBOARD, NOT A TEMPLATE. The style below is inspiration for the look and feel. Keep its materials, colours, textures and the way it moves, but invent your own scenes, characters and objects for this clip. You are not limited to anything shown in the preview, and nothing in it has to appear. Use illustration and animation to help tell the clip's story.

STORY FIRST. Read the whole clip before you design anything.
1. Write the clip's arc in one line: setup, tension, turn, pay-off. Name the one line that is the reveal.
2. Tag every sentence with its job: setup, context, tension, turn, reveal, example, number, contrast, list, quote, feeling, metaphor, callback, pay-off, aside.
3. The visuals carry the whole clip. If the clip shows the speaker's face, open on them (the first scene keeps them on screen) unless the person says otherwise. After that, never cut back to the speaker full-frame unless the person asks for it; if they do, only on the ending, never in the middle of an explanation. The speaker can still sit inside a scene (a corner, a split or drawn in) when the person wants to be seen.
4. Build one flowing visual story, not a new picture per sentence. Each scene covers a whole thought (one to three sentences), holds 3 to 8 seconds and turns into the next.
5. Start each scene on the first word of its sentence, or up to half a second before. Never cut mid-sentence.
6. Inside a scene, bring small details in on the words they show (an item, a tag, a tick). Earlier details stay.
7. Choose one or two recurring objects or characters in the first scene and bring them back changed. Callbacks beat new pictures.
8. Build up the same picture where you can (add to it, move the camera across it) instead of replacing it.
9. Energy: about 80 percent still, drifting or gentle. Allow one big move in the whole clip, on the reveal, for 1 to 2 seconds, then settle and hold.
10. Numbers sit on a scale (gauge, bar, table, timeline) and hold long enough to read. Contrasts are a still split or the same layout twice.
11. Feelings get a quiet image, or one of the cuts back to the speaker; never effects.
12. On-screen text names, labels or quotes; it never repeats the caption. Five words or fewer per label.
13. End every scene by settling or thinning out, or by turning into the next scene. No exit effects.
14. The style sets the look. These rules set when, how long and how calmly. If the style's own motion rules ask for more energy than this, use less.

VISUAL STYLE: Speech jigsaw
Slice style ref: sref-JDP38S
Look and motion: Speech jigsaw. Ground #2E2B28, a dark warm charcoal with a soft centre glow, a dark vignette at the edges and faint paper grain. Type colours: #F2E6CF cream for most words, then #F5A623 orange, #2FB5A8 teal and #E2503C red for the words that carry the thought, never more than four colours in a frame. Type: a narrow condensed gothic sans in capitals only, no serif anywhere. Each line is scaled so its width exactly fills the block width, so short words become huge and long phrases become small; lines stack with almost no gap and lock into one tight block. Some blocks turn 90 degrees and run up the side of the last block, like a jigsaw. Camera: it pans and rotates 90 degrees to sit square on each new block, with a slight pull back mid-move, then at the end of a thought it scales out to show the whole stack. Motion: words arrive on the beat of each spoken word, scaling up a little and settling; one word per thought may slam in from off-frame with a short trail. Camera moves are smooth and eased; between moves everything holds. Small drawn icons are allowed as accents. The one rule: words lock together into one block and the camera travels across it. Don'ts: no loose floating words, no serif mixed in, no more than four colours, no shaking.
Accent: as in the palette.
Frame shape: ask me before you start (9:16 vertical, 4:5 portrait, 1:1 square or 16:9 wide).
Energy: normal.

TECH: one HTML file, one GSAP 3 timeline created paused as window.__timelines.main, duration = the scene's length, transforms and opacity only.

Look rules

• Look and motion: Speech jigsaw.
• Ground #2E2B28, a dark warm charcoal with a soft centre glow, a dark vignette at the edges and faint paper grain.
• Type colours: #F2E6CF cream for most words, then #F5A623 orange, #2FB5A8 teal and #E2503C red for the words that carry the thought, never more than four colours in a frame.
• Type: a narrow condensed gothic sans in capitals only, no serif anywhere.
• Each line is scaled so its width exactly fills the block width, so short words become huge and long phrases become small; lines stack with almost no gap and lock into one tight block.
• Some blocks turn 90 degrees and run up the side of the last block, like a jigsaw.
• Camera: it pans and rotates 90 degrees to sit square on each new block, with a slight pull back mid-move, then at the end of a thought it scales out to show the whole stack.
• Motion: words arrive on the beat of each spoken word, scaling up a little and settling; one word per thought may slam in from off-frame with a short trail.
• Camera moves are smooth and eased; between moves everything holds.
• Small drawn icons are allowed as accents.
• The one rule: words lock together into one block and the camera travels across it.
• Don'ts: no loose floating words, no serif mixed in, no more than four colours, no shaking.

What it suits

Best for

Speeches, sermons and big quotes where the words themselves are the picture.

Avoid for

Charts, products or small personal details that need pictures.

Content

Faith, Motivation, Opinion

Tone

Bold, Warm

Pace

Medium

Topics

sermon, speech, quote, preach, motivation, leadership, church, rally, vision, words

Colours

#2E2B28 #F2E6CF #F5A623 #2FB5A8 #E2503C

For AIs: this style as plain text.