Matter.js · many to one · inbox

Everything lands in one place

Work items from everywhere fall into one tray with real physics while a counter tallies them.

Drawn in Soft UI · follows any look See the matched set →

Work items fall from above into a single tray and pile up with real physics while a counter tallies them; then the tray opens and the batch drops out, handled.

With Claude Code

With the skill installed, paste this in your project.

Use the site-motion skill to make the "drop-pile" scene for our site, in our brand.
Read our design tokens from this project (or run `site-motion theme <our url>`), write the content JSON with our real product nouns and numbers, then render mp4, webm and a poster. Check the loop seam before you finish.

From the command line

Draft your tokens, then copy the scene into your project. The first scene you add sets your site's look; every scene after it follows.

node bin/site-motion.mjs theme https://yoursite.com --out brand.json
node bin/site-motion.mjs add drop-pile --tokens brand.json

Your brand, as tokens

The theme playing above, as a token file the CLI and the skill accept.

content.json, the words in this scene

{
  "title": "Everything lands in one place",
  "label": "Work items fall from above into a single tray and pile up with real physics while a counter tallies them; then the tray opens and the batch drops out, handled.",
  "eyebrow": "One inbox",
  "heading": "Work arrives from everywhere.\nIt lands in one place.",
  "trayLabel": "Inbox",
  "counterLabel": "handled today",
  "items": [
    "Invoice 2291.pdf",
    "Ticket #482",
    "Call recording",
    "Signed NDA",
    "Refund request",
    "Bank statement",
    "Slack thread",
    "Claim form",
    "Receipt.jpg",
    "Contract v3",
    "Support email",
    "Spreadsheet.xlsx",
    "Shipping label",
    "Voice note",
    "W-9 form",
    "PO 1187"
  ],
  "every": 0.42,
  "tipAt": 9.6
}

Files

default theme

Rendered frame-exact. For your brand, run the command on the left.

MP4 · 1600×900 Poster PNG Preview WebM

embed snippet

<iframe src="/drop-pile.html" title="Everything lands in one place" style="width:100%;aspect-ratio:16/9;border:0" loading="lazy"></iframe>

Related scenes

all scenes

The number, made of the work

Grains of real events pour into the digits of the total, then sort themselves into one bar per source.

Data & analytics

Inbox triage

Incoming requests are tagged and routed into team queues with SLA timers, and one urgent item jumps to the front of its line.

Workflows & integrationsPro

Woven together

Each tool is a band of warp threads, woven into one fabric that rolls onto your product's beam.

Workflows & integrations