Skip to main content
iPlug2 offers multiple approaches to building plugin user interfaces, from traditional vector graphics to modern web and native platform frameworks.

​
Available UI Frameworks

IGraphics

Cross-platform vector graphics with NanoVG or Skia backends

SwiftUI

Native macOS/iOS interfaces using Apple’s declarative framework

Cocoa

Native AppKit/UIKit interfaces with Interface Builder support

WebView

HTML/CSS/JavaScript UIs using native webviews

Svelte

Modern reactive web UIs with Svelte framework

​
Choosing a Framework

​
IGraphics (Default)

Best for: Cross-platform plugins with custom graphics and animations Pros:
  • Single codebase for all platforms
  • Pixel-perfect rendering
  • No web dependencies
  • Optimized for audio plugin UIs
Cons:
  • Custom control library (not native)
  • More code for complex layouts

​
SwiftUI

Best for: macOS/iOS only plugins with modern native UIs Pros:
  • Native Apple look and feel
  • Declarative syntax
  • Automatic dark mode support
  • Access to all Apple frameworks
Cons:
  • macOS/iOS only
  • Requires Swift knowledge
  • macOS 10.15+ / iOS 13+

​
Cocoa

Best for: macOS/iOS plugins using Interface Builder Pros:
  • Visual layout with Xcode’s Interface Builder
  • Native controls and styling
  • Familiar to iOS/macOS developers
Cons:
  • macOS/iOS only
  • More verbose than SwiftUI
  • Separate storyboards for macOS/iOS

​
WebView

Best for: Rich, web-based UIs with standard web technologies Pros:
  • Use standard HTML/CSS/JavaScript
  • Rich ecosystem of libraries
  • Designer-friendly
  • Hot reload during development
Cons:
  • Larger memory footprint
  • Depends on system webview
  • Different rendering across platforms

​
Svelte

Best for: Modern reactive UIs with excellent developer experience Pros:
  • Reactive programming model
  • Compile-time optimization
  • Smaller bundle size than React/Vue
  • Great TypeScript support
Cons:
  • Requires build tooling (Vite)
  • Webview overhead
  • Additional learning curve

​
Architecture Overview

All UI frameworks in iPlug2 share a common architecture:

​
Key Concepts

​
1. Editor Delegates

Each framework uses a specific editor delegate:
  • IGraphics: IGraphicsEditorDelegate (built-in)
  • SwiftUI/Cocoa: CocoaEditorDelegate
  • WebView/Svelte: WebViewEditorDelegate
The delegate handles communication between C++ DSP code and the UI.

​
2. Parameter Communication

All frameworks use the same parameter communication pattern: From UI to DSP:
  1. BeginInformHostOfParamChangeFromUI() - Start gesture
  2. SendParameterValueFromUI() - Send value (normalized 0-1)
  3. EndInformHostOfParamChangeFromUI() - End gesture
From DSP to UI:
  • SendParameterValueFromDelegate() - Update UI with new value

​
3. Data Visualization

For non-parameter data (meters, scopes, etc.), use ISender classes: 
// In plugin header
IPeakSender<2> mMeterSender;  // 2 channels

// In ProcessBlock()
mMeterSender.ProcessBlock(outputs, nFrames, kCtrlTagMeter);

// In OnIdle()
mMeterSender.TransmitData(*this);
The UI framework receives this data via control messages.

​
Platform Support

FrameworkmacOSiOSWindowsLinuxWeb
IGraphics✓✓✓✓✓
SwiftUI✓✓✗✗✗
Cocoa✓✓✗✗✗
WebView✓✓✓✗✗
Svelte✓✓✓✗✗
WebView and Svelte support on Windows uses Microsoft Edge WebView2.

​
Getting Started

Choose the framework that best fits your needs:
1

Use the duplicate script

Copy an example project as your starting point:
./duplicate.py IPlugSwiftUI MyPlugin
2

Configure your plugin

Edit config.h to set plugin name, manufacturer, etc.
3

Build and run

Open the project in your IDE and build.
See the individual framework pages for detailed setup and usage instructions.