Loop Studio

Loop Studio is a browser-based visual systems editor and simulator — draw a Machinations-style diagram of pools, sources, drains, gates, and converters, then run a deterministic, seeded simulation to see how the system behaves over time. Built primarily for game economies, the same step-based model generalises to inventory/supply chains, service queues, cash flows, and other resource-flow systems; it's an independent, client-only implementation — nothing is uploaded, the whole app runs in your browser, and a graph is a plain JSON file you own.

Run it now: https://cozy-loop-studio.pages.dev — available in 14 languages, with five bundled Templates ranging from a small production flow to a large game economy and a three-zone probability/pity comparison.

Key features

• Visual diagram editor — pools, sources, drains, gates, and converters; resources move between them on a deterministic, discrete-step simulation; select a region of nodes from the rail and move them together, or place nodes in a named frame that moves with its contents
• Seeded RNG + Monte Carlo — probabilistic gates and flows, and many-run outcome distributions with percentile bands
• A small model language — parameter / register nodes with a safe arithmetic expression grammar, guided @-autocomplete authoring, and a name-and-value read-back
• Executable state connections — trigger (+ delay), activator, and label Pool modifiers, with in-canvas pulse / tint / flash feedback
• Simulation playback — resources visibly depart, travel the real edge path, and arrive before values update, in dependency order
• Data import & collaboration — bring the numbers you already keep in a spreadsheet (CSV/TSV paste or upload) in as adjustable Parameters, with a manual refresh and a three-way diff — see docs/import-guide.md; plus file-based project revisions & proposals for asynchronous collaboration — no accounts, no server
• Runs anywhere — an installable offline PWA, a portable single-file build, shareable links, and a UI translated into 14 languages

Languages

The UI ships in 14 languages, listed here the way the in-app picker orders them. Pick one under Settings → Language; the first visit follows your browser's language, and the choice is remembered on that device.

Code	Language	In its own words
zh-Hans	Chinese (Simplified)	简体中文
zh-Hant	Chinese (Traditional)	繁體中文
en	English	English
fr	French	Français
de	German	Deutsch
ja	Japanese	日本語
ko	Korean	한국어
pt-BR	Portuguese (Brazil)	Português (Brasil)
pt-PT	Portuguese (Portugal)	Português (Portugal)
ru	Russian	Русский
es-419	Spanish (Latin America)	Español (Latinoamérica)
es-ES	Spanish (Spain)	Español (España)
th	Thai	ไทย
tr	Turkish	Türkçe

Regional pairs are separate locales, not one catalog with a flag: a browser asking for pt-PT gets European Portuguese, while pt, pt-BR and the African Portuguese tags get Brazilian — and the same split holds for the two Spanish and the two Chinese catalogs. See docs/localization.md for the resolution order and the per-locale notes.

Representative use cases

The 3-zone gacha banner comparison Template runs three pity/pickup rule sets — General/Free, Premium Standard (hard-pity ceiling), and Premium Pickup (hard-pity + a pickup guarantee) — side by side, 200 pulls per zone under identical run settings. Once a run completes, its hit and pickup rates are easy to compare; run Monte Carlo analysis to inspect the distribution across many runs.

Premium Pickup, framed on its own — the hard-pity counter forces the next roll's SSR once it hits the ceiling; whether that (or any ordinary) SSR lands as pickup or standard depends on the Pickup owed guarantee flag, which a miss sets and the next SSR consumes.

Develop locally

npm install
npm run dev             # http://localhost:5173
npm run build            # -> dist/            static SPA, deploy anywhere
npm run build:portable   # -> dist-portable/   single self-contained index.html (file://)
npm run lint
npm test                 # vitest (engine + store unit tests)
npm run e2e              # Playwright browser end-to-end

Requires Node 22+ (.nvmrc pins 22). React + TypeScript + Vite, React Flow for the canvas, Zustand for state; the simulation engine is a dependency-free, unit-tested TypeScript module kept separate from the UI. Deployed on Cloudflare Pages; CI on GitHub Actions.

Technical reference

Behaviour is frozen in versioned spec documents; a behavioural change means a new spec id, never an edit to a frozen one.

• Engine & simulation — SEMANTICS.md, SEMANTICS-B1.md (seeded RNG), SEMANTICS-B2.md (Monte Carlo)
• State connections — SEMANTICS-S4.md (trigger / activator / label; the latest of a sequential S1→S4 series, each frozen on its own)
• Model language & expressions — SEMANTICS-X.md, SEMANTICS-M2.md (the latest of a sequential M1→M2 series)
• File formats & revisions — SEMANTICS-W.md (Workspace), SEMANTICS-U.md (Share links), SEMANTICS-R8.md (revision projection/diff/Apply — the latest of a sequential R1→R8 series)

Project revisions & proposals — a worked, file-based walkthrough of the create → propose → review → apply flow lives in examples/revision/README.md.

Where the model could grow (not on a committed schedule — continuous-time models, spatial/grid models, external-engine integration for specialized physics) is recorded in docs/product-direction.md.

Additional feature-specific design documents (localization, mobile, module system, large-graph readability, simulation playback, edge routing, data import, …) live under docs/.

Latest — v0.13.0

• Eleven languages — Chinese (Simplified and Traditional), French, German, Spanish (Latin America and Spain) and Portuguese (Brazil and Portugal) join English, Korean and Japanese; the full list with codes is above under Languages
• Regional detection that means it — a browser asking for pt-PT gets European Portuguese and one asking for pt-BR gets Brazilian, with the same split for Spanish and Chinese; an unlisted tag falls back to the closest catalog, and only then to English
• Templates and modules translate too — bundled Template node labels, frame titles and the labels an inserted module brings are localized per language; labels you edited stay yours
• A sorted, searchable language picker — listed by English name so regional pairs sit together, searchable by endonym, English name, current-UI name or code
• Fit and finish for translated text — per-locale wrapping measured in the real boxes, CJK punctuation rendered with CJK fonts, character position instead of column in parser errors, and a clearer disabled row in the mobile sheet

No save-format change and no migration: v0.12.0 files open unchanged.

See CHANGELOG.md for the full v0.13.0 notes, the v0.12.0 and v0.11.0 releases and every earlier one.

Credits

Created by Hanrim · Cozy Shelter.

Loop Studio is an independent project and is not affiliated with or endorsed by Machinations.io. Its modeling approach is informed by publicly documented academic work on game-economy diagrams.

Copyright

Copyright © 2026 Hanrim. All rights reserved.