skills/ai-host-video/references/motion-style-web-brutalism.md

# Web Brutalism

Use this direction for urgent, raw, confrontational graphic communication. Heavy
type, visible structure and machine-like changes create its identity. Its strongest
contrast is between abrupt events and authoritative stillness.

## Still composition

- Use a genuine heavy condensed display face with tight tracking and compact
  leading, paired with monospace for functional labels. Make scale contrast obvious:
  a hero may span 40–85% of the width while context stays much smaller but readable.
- Build an exposed grid, an off-centre split or an inset block with unequal margins.
  Let oversized type bleed intentionally; keep essential wording understandable.
- Start with ground, ink and a restrained alarm accent. If a colour becomes a large
  field, treat it as the new ground instead of letting every colour compete. Keep
  these three graphic colour roles distinct; preserve meaningful source colour.
- Keep the image flat: hard overlaps, box rules and offset colour duplicates rather
  than soft shadows, depth blur or gloss.
- Choose a print treatment such as halftone, photocopy texture or a small consistent
  registration offset. One coherent surface is stronger than a stack of effects.
- Bracketed labels, timecodes and document details must be real or clearly graphic
  organization. Do not fabricate metadata that could be mistaken for evidence.

## Motion vocabulary

- **Commit:** hard-cut a statement into place or uncover it with a short bar swipe;
  hold the resulting composition still enough to read as a finished poster.
- **Overwrite a state:** replace a word or value at the same anchor when the meaning
  changes, keeping the surrounding structure so the viewer sees the revision.
- **Expose a system:** align scattered labels into a grid or extend a rule to reveal
  the next information field. Straight paths and hard edges keep the action mechanical.
- **Change polarity:** exchange ground and ink at a major turn, carrying a shared
  type edge or box rule into the new composition.
- **Decode selectively:** a short type-on or stepped text change may reveal a label;
  resolve to exact legible copy before it needs to be understood.

## Adjustable starting points

- Try display tracking of −0.02 to −0.045em and leading of 0.85–0.95 times the font
  size. Fit the actual face, language and diacritics; open spacing when readability
  needs it. Supporting labels use their own legible spacing and scale.
- Prefer an instant cut or a snap around 80–160 ms with a sharp ease-out such as
  `(0.16, 1, 0.3, 1)`. Use linear motion for sustained travel; avoid elastic settling.
- Try a hard mask crossing in 180–350 ms or a short related-label offset of 60–120 ms.
  Events can follow a spoken phrase, a visual turn or an actual musical accent.
- A deliberately stepped group may update around 6–8 times per second. Keep its
  coupled channels on that same cadence; a separate slowly moving group can retain
  its own cadence. Define both in time, without assuming an output frame rate.
- A slow 2–5% image-scale change over a passage can contrast with instant type.
  It is optional: stillness supplies the style's dynamic range.
- If corruption serves a specific interruption, keep it brief, roughly 80–150 ms,
  isolated and clean on both sides. Texture, jitter and glitch are not prerequisites.

## Example development

A huge statement cuts onto a divided field. A smaller real supporting detail appears
at the grid edge. The divider extends, exposing a contradiction; the statement is
overwritten at the same baseline. Ground and ink exchange for the conclusion, which
holds cleanly. The turn in the argument supplies the impact.

## Standalone typography

Use the example's statement and overwrite on a bare field when type alone carries
the argument. A heavy condensed phrase and a functional monospace annotation can
provide the entire hierarchy. Hard replacement, scale contrast and dead-still holds
retain the character without box rules, panels or added texture.

## Avoid

Continuous glitch, flash sequences, fictional evidence, illegible tiny metadata,
texture that destroys detail, soft dissolves and bounce. Do not copy fixed frame
counts, tempo, event totals or surface stacks as requirements for this direction.