OCPN Studio

OCPN Studio is a modern web application for designing Object-centric Colored Petri Nets (OCPNs) and generating simulated OCEL 2.0 event logs — making what used to be a complex, StandardML-heavy workflow super easy and smooth, right in your browser.

Launch OCPN Studio

• Visual OCPN editor — Create and edit places, transitions, and arcs on an interactive canvas with drag-and-drop, including multi-select batch editing of shared properties across many places or transitions at once
• Hierarchical nets — Model hierarchical object-centric Petri nets with substitution transitions, subpages, and fusion places
• Declarations — Define color sets (including record types that directly map to OCEL 2.0 objects), variables, priorities, and functions
• Declare constraints — Author declarative, LTL-based behavioral rules (Response, Precedence, Succession, Not-Coexistence, and more) as color-coded arcs between transitions; violations are prevented by blocking non-compliant firings during simulation, matching CPN Tools' Declare plugin
• Simulation — Step through or auto-run simulations powered by cpnsim, our own CPN simulator written in Rust and cross-compiled to WebAssembly, running entirely in the browser. Click any enabled transition directly on the canvas to fire it (Fire Mode), edit a place's live marking mid-run, or jump to any enabled transition from the sidebar
• Run to a point in simulated time — Besides running a fixed number of steps, run until the model clock reaches a chosen date/time, or leave the end open and run until the net deadlocks. No transition fires past the end time, and the screen is kept awake so the display timeout can't cut a long run short
• Monitors — Define marking-size, transition-count, breakpoint, duration, and custom data-collector monitors to observe simulation behavior and collect statistics
• State space analysis — Compute the full state space with BFS exploration, SCC decomposition, dead/home markings, place bounds, and transition liveness — with deterministic overrides for models using stochastic distribution functions
• Reachability graph — Visualize the state space as an interactive graph with clickable nodes showing full marking details
• OCEL 2.0 export — Export simulated event logs in the OCEL 2.0 standard format for process mining. Mark individual transitions as scaffolding rather than business events and they stay out of the log; by default a transition is included when it is connected to an object place
• File format support — Open and save .ocpn (native JSON), .cpn (CPN Tools XML), .pnml (PNML, partial support), and .json (CPNPy) files
• Auto-layout — Arrange nets automatically using Dagre, ELK, or our own Sugiyama-based layouting algorithm developed in our research
• Built-in examples — Get started instantly with the Airport Ground Handling process example via the Open button
• AI assistant — Optional AI-powered sidebar for modeling guidance (OpenAI API key required)

The easiest way to use OCPN Studio is the hosted version at elte-dsed.github.io/ocpn-studio.

• Click the ? (Help) button in the top-right corner for an interactive guide that explains the app's functionality in detail.
• Click Open in the top-left corner and select the built-in Airport Ground Handling example to explore a complete OCPN model.
• Use the Feedback button in the app to share your thoughts — feedback is very much welcome!
• If OCPN Studio has been useful to you, the ☕ button next to Feedback links to buymeacoffee.com/istvank — it helps cover the cost of the AI tooling used to build this project faster.

• Node.js (v20+)
• pnpm (v10+)

git clone https://github.com/ELTE-DSED/ocpn-studio.git
cd ocpn-studio
pnpm install

The simulator lives in a separate Rust crate published as @rwth-pads/cpnsim. To test simulator changes before they are released, point the app at a local checkout:

pnpm cpnsim:local      # builds the crate to wasm, then links it
pnpm cpnsim:restore    # back to the published package

Requires wasm-pack (cargo install wasm-pack). The crate is looked for next to this repo (../cpnsim, ../../rust/cpnsim); set CPNSIM_DIR if it lives elsewhere:

CPNSIM_DIR=~/src/cpnsim pnpm cpnsim:local

The switch is local to your node_modules — no lockfile or package.json change, so there is nothing to accidentally commit. Rust edits need a rerun of pnpm cpnsim:local to be rebuilt, and the dev server needs a restart afterwards.

See ARCHITECTURE.md for a slide-style conceptual overview of the frontend, the WebAssembly integration boundary, and the internal cpnsim engine layers.

Contributions are welcome! Feel free to open an issue or submit a pull request — any help is greatly appreciated. The easiest way to reach out is via the Feedback button directly in the app.

This project is licensed under the MIT License. See the LICENSE file for details.

Based on the React Flow starter (Vite + TS) template by webkid GmbH.