Mografy Templates · Explainers

Feature grid

Quiet glass cards rise into a grid, then a comet runs around each in turn and lights it up in the spectrum.

16:95.5 sFree · MIT

Add the template

Run this in your Mografy folder. The template, the shared modules and its fonts are copied into the project; files you changed are kept. A folder that is not a project yet becomes one, with a scene that plays the template.

Terminal
mografy add feature-grid-wide projects/my-film

To watch it on its own, point the project's scene to the template: "scene": "scenes/templates/feature-grid-wide.ts"

Use it in a film

Play the template on your film's timeline and override its parameters. Pass backdrop: false to draw an overlay template over your own picture.

scenes/main.ts
import * as featureGridWide from './templates/feature-grid-wide.js'
import { play } from './templates/kit.js'

// inside renderFrame(ctx, time): play it from 2 s, with your own copy
play(ctx, time, 2, featureGridWide, { title: "Everything your [week] needs." })

Or describe the film to Claude or Codex: the Mografy Skill knows every template and picks the ones that fit.

For your agent Show what a product does in one frame: 3–6 features, one per line as "Name: detail" (name 1–3 words, detail under ~38 characters), headline under ~32 characters with [brackets] for the spectrum. Draw your own icons in `icon()` (one per card, by index).

Parameters

  • titlestringEverything your [week] needs.
  • featuresstringShared plans: One calm view of the week ⏎ Live reports: Numbers that update themselves ⏎ Goals: Progress the whole team can see ⏎ Team spaces: Every project in one place ⏎ Gentle alerts: Only what needs you today ⏎ Insights: Patterns found for you
  • themeenum · night | light | neonnight
  • safeGuidebooleanfalse

Timing and layout live in the template file itself: edit them there, then check and review the frames.