CreatorMotion · Folder Grid Filing

Show loose documents becoming part of a stable filing system. Small ruled-paper markers move into a fixed folder grid, with a brief color change acknowledging each arrival. The final clean arrangement offers a visual metaphor for organization; it does not read, classify or move files on your computer.

What you get

  • An editable HyperFrames effect, local generator and focused motion/review instructions. Generate a 1920×1080, 30 fps project and render a seven-second video segment for a larger production.
  • A fixed three-by-three layout with up to nine folder labels and five document markers, controlled through folders and documents. The default uses categories such as Reading, Drafts and Research; they are sample labels you can replace.
  • Five filing moves in the default example, beginning at 0.40 seconds with 0.52-second spacing. Each paper shrinks and disappears into its assigned folder, which briefly changes its fill and text color before returning to the common treatment.
  • Four palettes keep the motion consistent: White & Yellow (white-yellow), Charcoal & Lime (charcoal-lime), Paper & Orange (paper-orange) and Black & White (midnight-ice). Semantic overrides adapt the treatment; check contrast after changes. Dark palettes include a fine static grid. Fonts are bundled locally: Inter, IBM Plex Mono for measurements and ordinals, and Smiley Sans/Noto Sans SC for Chinese. Chinese copy automatically uses Smiley Sans, including Latin text in the composition; --zh-font noto-sans-sc selects the plainer alternative and --font embeds your supplied face. Inspect wrapping after a font change.

Before you choose

Choose this when the filing action explains the point. If the categories carry real meaning, align the label order and fixed destinations deliberately; a tidy animation alone does not show that a document was classified correctly.

Good fit

  • A teaching explanation of an organizing scheme with a small, stable set of categories.
  • A short creator passage showing clutter clearing into destinations, with concise folder and document labels.
  • A series using consistent folder geometry, timing and typography to illustrate different filing examples.

Not for

  • Actual document classification, file-system operations or automatic destination selection from document names. The destinations follow a fixed index pattern.
  • A reordering or priority-grid animation: the folder positions remain fixed while papers move into them.
  • An automatically edited long-form production, generated presenter performance or soundtrack, or copying a reference creator’s identity and materials.

How to use

You say/creatormotion-cards-folder-grid Turn my supplied explanation into a white-yellow B-roll scene using the Folder Grid Filing effect. Use the text, data and media I provide, and ask for any required input that is missing.
  1. Write folders and documents in JSON. For the full intended grid, provide nine folder labels and at most five document labels. Use concise names that remain legible on small paper markers.

  2. Check the built-in destination mapping before claiming a category relationship. With nine folders, the five documents go to folder indexes 0, 2, 4, 6 and 8—positions 1, 3, 5, 7 and 9 in the list. The code uses index arithmetic, not the meaning of a document label. Change the order or implementation if your example needs another mapping.

  3. Keep at least one folder; an empty list leaves the current destination calculation invalid. Fewer than nine folders do not reflow into a new balanced grid. This effect uses editable paper/folder geometry and has no active presenter or image slots.

  4. Prepare Node.js 22+, FFmpeg and the documented HyperFrames CLI 0.8.30. Run node scripts/create.mjs --out PROJECT --data CONTENT.json from the extracted Skill directory. Add --style and optional --overrides for styling. An --images JSON map replaces named local slots; relative paths resolve beside that map and unlisted slots retain defaults. Read the image policy before replacing visual materials.

  5. Inspect the editable composition and render with npx --yes hyperframes@0.8.30 render PROJECT --output VIDEO.mp4 --fps 30 --quality high --strict. Review real rendered frames at the opening, each main change and the final hold for cropping, overlap and readability. Assemble voiceover, music and other scenes separately. Follow each paper to its destination and inspect the acknowledgement frames. Folder fill and text color should switch together; the decorative folder tab intentionally extends above the body, but labels still need to remain readable.

Requirements and costs

You bring
folders: provide your own content or retain the illustrative default. · documents: provide your own content or retain the illustrative default.
Dependencies
HyperFrames CLI 0.8.30 or compatible — required · Node.js 22 or newer — required · FFmpeg — required
Outside costs
Not collected yet
Tools used
HyperFrames
Publisher testing
v1.0.1 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT

FAQ

User reviews

—0 reviews

Select a star to share your experience.

No reviews yet. Ratings appear once readers share real experiences.

Similar Skills

View all skills