Was ist enthalten

Eine SKILL.md (die Anleitung) + eine Startvorlage. Eine Vorschau:

Cost Ledger Total

When to use

• A budget, quote, or invoice needs to be shown line by line so the audience trusts the total
• A "where does the money go" explainer must make every line item visible before the total lands
• A pricing breakdown has 4–10 line items and a single total that would feel arbitrary without the build
• A finance or procurement video must show the arithmetic, not just announce a number
• A proposal walkthrough needs the viewer to follow the addition in real time
• You have a list of charges that add up to one total, and the addition itself is the point

Workflow

1. Build the ledger (input: your charges → output: ledger table)
   List every line item: short label (≤5 words), quantity if any, and amount. Sort in the order you want the audience to read them — usually largest first, or in the order the charges occur. Add the amounts by hand and write the total separately, then check the addition twice: a ledger animation with a wrong total is worse than no animation. Decide now whether any lines are deductions (discounts, credits) — they get a minus sign and a different treatment in the animation, and they must be included in the total.
2. Design the ledger layout (input: ledger table → output: layout)
   The ledger is a ruled table: labels left-aligned, amounts right-aligned, one row per line item, generous row height so each row reads on a phone. A running subtotal column or a subtotal readout sits at the top-right or beside the table — the audience watches it climb as rows land. Leave clear space below the last row for the rule line and the total row; the total row is larger type (at least 1.5× the row type) and sits on its own, separated by the rule. Background stays plain; the numbers carry the scene.
3. Choreograph the line-by-line drop (input: layout → output: timing map)
   Total duration 5–9 seconds for 4–10 rows. Rows drop in one at a time, top to bottom, 500–700ms per row with a 150ms gap between rows. Each row drops from 12px above its resting position with a soft settle — the motion should feel like entries being written into a book, not objects falling from the sky. Deduction rows pause a beat longer (add 200ms) so the minus sign registers. The running subtotal updates on each row's landing, never during the drop.
4. Set keyframes for rows, subtotal, and rule (input: timing map → output: keyframe spec)
   Row keyframes: 0% — translateY(-12px), opacity 0; 60% — translateY(2px), opacity 1 (the overshoot); 100% — translateY(0), opacity 1. Easing: ease-out cubic (cubic-bezier(0.22, 1, 0.36, 1)). Subtotal keyframes: on each landing, the subtotal number swaps to the new running value with a 120ms scale pop (1 → 1.08 → 1) — the pop is the reward for the landing. Rule line: after the last row lands and a 300ms pause, a horizontal rule draws left to right across the table over 400ms (scaleX 0 → 1, ease-out). Total row: fades and slides up 8px over 400ms, ease-out, landing below the rule.
5. Land the total (input: keyframe spec → output: finished motion)
   The total row gets the emphasis: a 250ms scale pulse (1 → 1.04 → 1) plus a brief accent underline or a double-rule draw beneath it (the classic ledger double-underline, drawn over 300ms). If the ledger has deductions, the total lands after a visible "less discounts" step so the arithmetic stays honest — never jump from the last charge to a total that quietly includes a deduction. Hold the finished ledger at least 1.5 seconds so the audience can read the whole table and verify the total against the rows.
6. Check the arithmetic and the reading at full speed (input: finished motion → output: verified animation)
   Watch at real speed: can you read each row as it lands, follow the running subtotal, and see the total arrive without rewinding? Then verify the numbers frame by frame: running subtotal after each row must equal the sum of the rows above it, and the final total must equal the sum of all rows including deductions. Check the final frame alone: does it read as a complete, trustworthy ledger — labels, amounts, rule, total, nothing cut off? A ledger that cannot be audited from its final frame has failed.

Vorschau der Startvorlage

Cost Ledger Total — Starter Template

Fill in every {placeholder}. Check the addition twice before animating — the animation promises the numbers add up.

Ledger table (4–10 rows)

• Sort order: {largest first / order charges occur / other}
• Deductions (discounts / credits): {row #s} — each shown with a minus sign
• Total (checked twice): {sum of all rows incl. deductions} — [ ] addition verified

Layout

• Table: {ruled, labels left-aligned, amounts right-aligned, generous row height}
• Running subtotal readout: {top-right / beside table}
• Total row: {1.5× row type, own space below rule} · Background: {plain}

Timing map

Das Skill-Paket selbst (SKILL.md + Vorlage) ist auf Englisch verfasst.

Das komplette Skill-Paket kaufen — $4.99 Pro — alle 511 Skills