SLOPMOTION/Docs
Account← Back to site
Browse docs

SlopMotion documentation

SlopMotion is a browser-based, audio-reactive visual synthesis tool for live performers. It stacks shader effects on top of looping video inside a single canvas, driven in real time by the music.

These docs cover how the system works and the building blocks you compose into a show.

Where to start

  • Scene player - export a scene JSON from Studio and mount it with the open-source player.
  • FX layers - every effect in a picker grid like the live app; open a layer for a live scene, parameters, and a shareable page.
  • Audio bands & triggers - how the analyser hears the music and the Base / Audio depth / Trigger control model.
  • FX groups - render a sub-chain into its own buffer and composite it back as one unit.
  • Blend modes - Blend, Diff, Add, Mult, Layer, and Overlay, and where each selector appears.
  • Masks - turn a group into a stencil, and the layers that carry a mask shape of their own.
  • Packs & claims - playsets vs FX packs, collaboration drops, and how claiming works.
  • Chrome app - install slopmotion.studio as a desktop app for cleaner live sessions.

Core ideas

  • Effects run as a chain. Each effect sees the output of the one before it, so order is part of the look.
  • Most controls are audio-aware. A resting Base value, an Audio depth that the synced band pushes on top, and an optional Trigger that fires on hits.
  • Groups branch the chain. A group renders its own layers into a separate buffer, then composites the result back with one amount, one blend mode, and one audio mapping.
  • Scenes and playsets are savable. Build a chain, save it, recall it live.

New to the tool? Skim the FX layers reference - the How FX layers work section explains the shared control model used almost everywhere.

Run as a Chrome app

SlopMotion runs in the browser - but for gigs and focused sessions, treat it like a desktop app. Google Chrome can install slopmotion.studio as its own window: no tabs, no address bar, launchable from your Dock or taskbar.

Why install it

  • Stage-ready window. A dedicated app window keeps browser chrome and other tabs out of the way - safer when you’re fullscreen, on a second display, or switching scenes mid-set.
  • One-click launch. Pin SlopMotion next to your DAW / Ableton / DJ software instead of hunting for the right tab.
  • Isolated from browsing. Closing other Chrome windows (or crashing a random tab) is less likely to take your visual session with it.
  • Always current. You’re still on the live web app - no separate installer to update. Open the Chrome app and you get the latest SlopMotion.
  • Best browser for the job. Chrome has strong WebGL, Web Audio, and Web MIDI support - the same stack SlopMotion relies on for reactive visuals and controllers.

How to create the app (desktop Chrome)

  1. Open https://slopmotion.studio in Google Chrome on your computer (Mac, Windows, or Linux).
  2. Click the ⋮ menu (top right) → Cast, save, and share → Install page as app…
    On some Chrome versions the label is Install SlopMotion…, or an install icon appears in the address bar - same result.
  3. Confirm the name (e.g. SlopMotion) and click Install.
  4. Chrome opens SlopMotion in its own window. Optionally:
    • macOS: keep it in the Dock (right-click the Dock icon → Options → Keep in Dock).
    • Windows / Linux: pin it to the taskbar or Start / app menu.
    • From chrome://apps, right-click the app → Create shortcut if you want a desktop icon.

If you only see Create shortcut instead of Install, choose that and enable Open as window before creating - that gives the same tab-free app window.

Tips for live use

  • Launch the Chrome app, not a normal browser tab, before soundcheck.
  • Use SlopMotion’s Zen Mode (hide the sidebar) once the Chrome app is up for maximum canvas.
  • MIDI controllers and audio input still work the same as in a regular tab - grant permissions the first time if Chrome asks.
  • To remove the app later: open chrome://apps, right-click SlopMotion → Uninstall.