How it works — Prototypes

What this is

A lightweight host for shareable HTML prototypes. The whole site lives in a GitHub repo (SpaceMusicZH/Prototypes) with one folder per prototype under sites/. Pushing a new folder — or using the Add button on the index page — triggers a rebuild and the prototype appears on the landing page automatically. Hosted at prototypes.origin-infinite.com.

Adding a prototype

Two ways:

From this site. Click + Add prototype in the header, pick a .html file or a .zip, fill in title and tags, submit. The server commits a new folder to GitHub and the site redeploys within ~30–60 seconds.
Via git. Create a folder under sites/, drop in index.html plus meta.json, commit, push to main. dev push redeploys.

meta.json schema

{
  "title":  "Human-readable title",   // required
  "author": "armin",                   // optional
  "date":   "2026-05-13",              // optional — falls back to folder prefix
  "blurb":  "One or two sentences.",   // optional — appears on the card
  "tags":   ["ui", "experiment"]       // optional — clickable filters on the index
}

Folder naming

Folders use the pattern YYYY-MM-DD-slug. The date prefix drives default sort order (newest first). Use the Date field in the Add modal to backdate a prototype if you're uploading something you made earlier.

ZIP rules

index.html must exist at the ZIP root, or inside a single top-level folder (which gets stripped).
Path traversal (..) is rejected. macOS metadata (__MACOSX/, .DS_Store) is stripped.
Caps: 100 files, 20 MiB uncompressed total.

Search & filter

The search bar matches against title, author, blurb, and tags. The tag chips at the top toggle filters — selecting multiple tags shows prototypes matching any of them (OR). Search and tag filter combine: matches must satisfy both. Click Clear filters to reset.

Editing & archiving

Each card has a ⋯ menu in the top-right with two actions:

Edit opens the same form as the upload modal — title, author, date, blurb, tags. The file isn't editable here; replace it via git if needed.
Archive moves the folder from sites/<slug>/ to _archive/<slug>/ at the repo root. It disappears from the index but the files remain in the repo and can be restored later by moving the folder back. Archive is not delete.

Where files live

sites/<folder>/ — one folder per prototype (this is what you add to).
_shared/ — optional cross-prototype assets; served at /_shared/....
_template/ — index page CSS + HTML and this docs page.
build.mjs — scans sites/ and writes dist/.
serve.mjs — static server plus POST /upload and GET /me.

Folders starting with _ or . are excluded from the index but still served.

For AI agents

If you're an AI assistant being asked to add a prototype, read CLAUDE.md in the repo — it has the local recipe (folder name, meta.json, build + commit). The same conventions apply whether you upload via the button or push directly.

← Back to prototypes