A browser-based performance tools & sound design ecosystem for electronic musicians.
🌐 Website
SY.CORE is a professional-grade, local-first web application that serves as a centralized hub for MIDI orchestration, sound design, audio processing, and live performance — all running in your browser with no installation required.
- Roland S-1 Adaptive Generator — preset identity management, real-time parameter control, modulation, and performance integration with the Roland S-1 Tweak Synth.
- Generative Patch Creation — create new sounds instantly based on musical parameters.
- Unlimited Preset Library — store, categorize, and recall thousands of sounds beyond the hardware's 64-pattern limit.
- Audio Capture — record audio directly within SY.CORE via the mic toolbar panel.
- Audio Looper (Beta) — sample-accurate 8-track looper for live instrumental and digital performance.
- Samples Machine — 24-pad simultaneous loop player with sync-quantized starts, mixer, Performance Sets, and Capture integration.
- Sampler (Beta) — 7-pad multi-bank sampler with MIDI velocity, chromatic pitch-shifting, ADSR envelopes, lo-fi modes, and granular synthesis.
- Backing Track Player — dual-slot playback engine with crossfade, playlist, and MIDI sync.
- Freesound Browser — search, preview, and inject sounds from freesound.org into playlists, loop pads, or Audio Capture.
- Devices — auto-discover and register your MIDI hardware, plus Virtual Instruments (software synths reachable through a virtual MIDI cable) with a bindable real output port.
- Flow — visual drag-and-drop MIDI routing canvas for connecting virtual apps and hardware devices. Supports device→app and app→app routing with per-connection note-range filters (keyboard splits) and channel filters, multi-channel fanout for multi-timbral virtual instruments (e.g. duplicate one part onto CH 1, 2 and 4), one-click shortcuts to open a routed app or a device's Program Change panel straight from its canvas node, and named saved canvas configurations that auto-restore on reopen.
- Note Latch — independent MIDI IN/OUT app that holds notes after key release with configurable Max Notes (1–16) and FIFO/BLOCK mode. Cable it into the MIDI Flow canvas to apply latching to one or more instruments at once, with a single OFF switch to release every held note.
- Controller Designer — visual canvas for designing custom MIDI controller layouts with draggable controls and preset management.
- Monitor — real-time MIDI event monitoring and logging, one click away from the MIDI Flow canvas footer for checking messages while you wire up routing.
- MIDI Manager — unified MIDI control center for routing, mapping, and device management.
- Mapping — MIDI CC to application parameter binding.
- Actions — per-device app action binding (MIDI CC/Note → high-level actions: start sequencer, toggle looper, change preset).
- Sync — cross-subsystem transport synchronization matrix, backed by a single global BPM control that keeps Tone.js playback and outgoing MIDI clock to hardware in lockstep across every synced app.
- MIDI Capture — record, view, and export MIDI events in real time.
- Multi Sound / Program Change Browser — browse and send Program Change messages to connected devices, organize sounds into custom named banks per device, and import external preset listings (like E-MU Emulator X3 exports, Arturia MicroFreak, Arturia Pigments or SQLite based bank database, Yamaha SEQTrak, GForce Basstation, OsTirus syx import ).
- Live Performance Pad — pad-based performance panel for triggering sounds and sequences on stage.
- Solo Performance Sets — 8 assignable pads (A–H) in the Device PC panel for instant Program Change recall during performance. Each pad stores a device name, MSB/LSB, PC number, and patch name. Two modes: Assign (pick a patch from the browser) and Recall (click to send PC). MIDI Learn per slot. Named sets save/recall all 8 pads; the Deck summary card shows device+patch with instant recall.
- Live Timeline — visual arrangement timeline with segments, MIDI markers, and transport control. Position displayed in bars:beats format with bar-number rulers, driven by an editable per-session BPM. Tempo markers change the effective BPM mid-playback.
- Sequencer — chromatic piano-roll-style step sequencer with 12-note vertical bars per step (C–B), per-step octave, accent, and probability controls. Runs as an independent MIDI Flow app with its own IN/OUT and local pattern storage.
- Step Sequencer — algorithmic composition and MIDI sequencing engine with style-based generation. 8 pattern slots (A–H).
- Chord Progression Sequencer — step-based harmonic sequencer with built-in chord library, algorithmic generation, and 8 independent progression slots (A–H) chainable into a longer arrangement. Chord/Arp play mode, chord-strum direction, and arpeggio pattern can all be overridden per step, so a single progression can mix strummed chords and arpeggios freely.
- Drum Machine — 8-track 16-step pattern sequencer with A–H sequence banks, Fill, Repeater, style generation, and REC SYNC.
- Module Manager — enable or disable individual app modules to keep the workspace focused on what you actually use; disabled modules are hidden from every toolbar, dock, and quick-launcher.
| Layer | Technology |
|---|---|
| Framework | Vue 3 (Composition API + <script setup>) |
| Language | TypeScript |
| State | Pinia |
| Routing | vue-router |
| Build | Vite |
| Styles | Tailwind CSS |
| Icons | Lucide |
| Audio Engine | Tone.js / Web Audio API |
| MIDI | Web MIDI API / webmidi.js |
| Audio Export | lamejs (MP3 encoder) |
| Persistence | IndexedDB / LocalStorage |
| PWA | vite-plugin-pwa |
| Backend / Data | Upstash Redis / Vercel KV |
SY.CORE is pre-calibrated for low-latency performance with professional gear:
- Roland AIRA Series (S-1 Tweak Synth, T-8 Beat Machine, J-6 Chord Synth) — deep integration with preset management, parameter control, and Program Change automation.
- Arturia MicroFreak (coming soon via SY.CORE LAB) — unlimited preset management and deep editing.
- Any USB-MIDI device — auto-detection, routing, and mapping.
SY.CORE connects over Web MIDI — plug in your hardware and it's recognized immediately with no drivers or installation.
SY.CORE isn't a single instrument or a single tool — it's the layer that sits between your gear, your DAW-less ideas, and the performance itself. A few concrete scenarios where that pays off:
- One visual hub for a multi-device rig. Instead of hunting through each synth's own MIDI settings, drag devices and apps onto the MIDI Flow canvas and draw cables between them. Split one keyboard across a Roland S-1, a soft-synth, and a drum machine using note-range filters — or fan one part out to CH 1, 2, and 4 on a multi-timbral virtual rack — all visually, all applied live as you connect.
- Compose harmony first, arrangement second. The Chord Progression Sequencer's 8 independent slots (A–H) let you sketch a verse, chorus, and bridge as separate progressions, then chain them into a full arrangement without losing the ability to edit each section independently. Per-step Chord/Arp overrides mean a single progression can strum some chords and arpeggiate others — no need to bounce between a chord tool and an arpeggiator.
- A rig that stays in tempo without babysitting. One global BPM control keeps every synced app — sequencers, the drum machine, outgoing MIDI clock to hardware — locked together. Change tempo from a MIDI CC knob mid-performance and everything follows, instead of hunting down three separate tempo fields.
- Beyond the hardware's onboard memory. The Roland S-1 (and other supported gear) ships with a fixed pattern/patch limit — SY.CORE's unlimited preset library and per-device Program Change banks (including imports from external listing formats) mean your sound library isn't capped by what fits on the device itself.
- Use it as one tool, or all of them. SY.CORE isn't a bundle you take whole. Module Manager lets you turn off anything you're not using — want it as just a MIDI orchestrator for your rig? Turn off the Drum Machine, the Chord Progression Sequencer, and the Sound Engine, and you're left with routing, mapping, and sync. Want just a Chord Progression Sequencer to sketch changes and send them out over MIDI? Turn off everything else. Every disabled module disappears from every toolbar, dock, and launcher — the workspace only ever shows the instrument you actually asked for.
- No install, no drivers, no lock-in. Everything above runs directly in the browser over the Web MIDI and Web Audio APIs — no ASIO drivers, no installer, always the latest version, and your session state persists locally so closing the tab mid-set is safe. See SY.CORE Advantages for the deeper technical case.
- Node.js >= 20
- npm >= 9
- A browser with Web MIDI API support (Chrome, Edge, Opera recommended)
git clone <repository-url>
cd sycore-refactor
npm installnpm run devStarts on port 4100 (or VITE_DEV_PORT if set) using the default IndexedDB database. This is the standard way to run the app.
npm run dev:refactor is also available if you need to run this checkout side-by-side with another SY.CORE instance — it uses a different port (3999) and a separate IndexedDB database (sycore_2) so neither instance clobbers the other's local data.
npm run buildOutput in dist/. Deployable to any static host or Vercel.
npm run previewnpm testnpm run deploy:appDeploys the app to Vercel.
┌─────────────────────────────────────────────────────┐
│ Layer 1: User Interface (Vue 3) │
│ MainPage │ SynthApp │ All Panels / Modals │
└──────────────────────┬──────────────────────────────┘
│
┌──────────────────────▼──────────────────────────────┐
│ Layer 2: State Management (Pinia) │
│ useUiStore │ useMidiStore │ usePresetStore │
│ useMappingStore │ useAuthStore │ useConfigStore │
│ useLivePadStore │ useArpStore │ useLfoStore │
└──────────────────────┬──────────────────────────────┘
│
┌──────────────────────▼──────────────────────────────┐
│ Layer 3: Core Engines (JS / Web Audio) │
│ MidiService │ LooperEngine │ AudioContext │
│ useMidiInit │ useMidiCCListener │
│ useControllerManager │ MidiRouting │
└──────────────────────┬──────────────────────────────┘
│
┌──────────────────────▼──────────────────────────────┐
│ Layer 4: Data & Persistence │
│ IndexedDB │ LocalStorage │
└─────────────────────────────────────────────────────┘
- Offline-First — everything runs locally in the browser. IndexedDB stores your sound library, playlists, and session state. No internet required during performance.
- Event-Driven Communication — components use a custom global event system (
window.dispatchEvent) for cross-cutting communication without expensive re-renders. - Lazy-Loaded Panels — all panels (Sampler, Sequencer, Drum Machine, etc.) are lazy-loaded and shown/hidden via the UI store, keeping the initial bundle lean.
- Session Persistence — every change is saved in real-time. Close the tab and come back exactly where you left off.
Detailed guides are available in docs/guides/:
- Manifesto — why SY.CORE exists
- Guides Index — complete list of all guides
- Sound Engine, Audio, MIDI, and Live Performance guides
- Product overview and advantages
See CHANGES.md for a running log of new features.
| Variable | Description |
|---|---|
VITE_WEBSITE_URL |
URL for the external website link in the top bar |
VITE_DEV_PORT |
Dev server port (used by dev:refactor script) |
VITE_DB_NAME |
IndexedDB database name override |
MIT