Design a device interface

The Interface Designer gives a custom device its front panel. You arrange knobs, sliders, buttons, labels and displays, then connect them to the parameters exposed by the device. Interface edits have their own history, so moving a knob does not change the sound patch.

Start with a compiled custom device. In My Devices, choose Design interface on a locally authored, unarchived draft. A device that needs compiling shows Compile this device before designing its interface.

Place and arrange controls#

The Components tab contains these choices:

Choose a component to add it to the current layout. Search components or parameters filters the current list. Each interactive component needs a compatible exposed parameter; adding a component does not add that capability to the sound.

Click a control to select it. Shift-click adds or removes a control from the selection. Drag to move; drag the corner handle to resize one selected control. Drag empty canvas to select with a box. Alt-drag, middle-drag or drag the space surrounding the panel to pan.

When the canvas has keyboard focus, arrow keys move selected controls by one pixel. Shift+arrow moves one 60 px slot. Snap to 60px grid and Show guides help placement. Canvas zoom offers 50%, 100%, 200% and 400%.

The inspector gives keyboard alternatives for X position, Y position, Width and Height. For several selected controls, use Align left, Align top or Group selection. Ungroup selection releases the members of a selected group. Bring forward and Send backward change overlap order. Remove selected, Delete or Backspace removes selected components.

Undo layout and Redo layout, or Command/Control+Z and Command/Control+Shift+Z, move through interface edits. A completed drag is one edit. Command/Control+A selects all controls in the current layout; Escape clears selection and releases held preview notes.

Layouts and templates#

Switch among Full panel, Compact rack, Mobile and Marketplace. These are interface variants, not separate sound definitions. Components can share their identities across layouts while their placement changes. A layout can also be empty.

In a layout other than Full panel, Copy full panel to this layout replaces that layout with a copy of Full panel.

Templates offers Compact subtractive, Classic analog, FM, Drum machine, Chiptune, Sampler, Effect and Generative sequencer. These add an arrangement of controls. They do not construct the matching sound graph or automatically bind every control.

On a narrow workspace, Toggle design tools and Toggle inspector show the side panels.

Bind controls to the sound#

Open Params to find the parameters and macros exposed in Compile Device. Drag one onto an existing compatible control to bind it. Drop onto empty canvas to create an appropriate control. Keyboard users can select a control and use the Binding inspector, or use the parameter browser’s Bind and Create control actions.

Several controls can use the same parameter. Value displays use a read-only subscription. A control with no valid target is disabled in preview.

For numeric bindings, set Minimum, Maximum and Reverse in the Binding inspector. The range must fit the exposed parameter. A selector must match the target’s choices. Rebinding it explicitly adopts the current choices while keeping the control’s identity and appearance.

The inspector also displays macro target mappings. Edit those mappings in Compile Device, because they describe how the sound’s controls relate to each other.

If the sound definition changes, the Designer keeps your layout and flags problems such as missing parameters, incompatible control types or invalid ranges. Choose a replacement parameter explicitly. Acknowledging a changed parameter contract does not repair a broken target for you.

Labels and appearance#

Set an Accessible label that explains the control, such as Brightness or Release. Help text adds guidance. A Label component also has Label text.

Control surface offers None, Glass and Inset. Pixls skin applies artwork already associated with the interface, or No skin removes it. Knobs also have Knob sensitivity and Fine sensitivity. Shift-drag uses the fine sensitivity while playing the interface.

The components remain keyboard controls when skinned. In preview, arrow keys change knobs and sliders, Page Up and Page Down make larger moves, and Home and End go to their ends. Knobs that allow resetting return to their default on double-click.

Draw Pixls artwork#

In Pixls, set Artwork text alternative, then choose Draw panel in Pixls. The painting workspace offers Brush, Line, Rectangle, Ellipse and Eraser, primary and secondary colours, colour swapping, source size, pixel zoom, brush size and shape, and outline or filled shapes.

For animation, use Add frame, Duplicate frame, Delete frame, Move frame earlier, Move frame later, Frame duration (ms) and Onion skin. Undo paint and Redo paint belong to the painting session.

Apply artwork saves through Pixls before attaching the artwork to this interface. Cancel leaves the last applied artwork in place. Artwork editing needs a signed-in, connected session. If saving fails, keep the editor open and retry; the message says Artwork could not be saved.

Artwork remains separate from controls. In Assets or Layers, select a layer to change its text alternative, position, dimensions, Pixel magnification (1×, 2×, 3×, 4× or 8×), and Artwork placement (Center or Tile). Remove artwork layer removes that placement. Missing or changed artwork access produces a labelled placeholder.

Attaching artwork does not establish permission to resell it. Check the applicable rights and Terms.

Preview and play#

Preview interface lets you inspect the panel without starting sound. Choose Edit layout to resume arranging it. Test audio explicitly prepares the device; Stop preview stops it.

A device with MIDI input can be played in three ways:

• The on-screen Keyboard preview covers MIDI notes 60–72. Press and release a key with the pointer, Space or Enter.
• QWERTY keys A W S E D F T G Y H U J K cover the same notes while preview is active. Typing in a text field does not play them.
• Connect Web MIDI requests permission for an attached controller. Disconnect Web MIDI releases that connection. If the browser does not offer Web MIDI, use QWERTY or the on-screen keys.

Show keyboard preview shows or hides the on-screen keys. Moving away from the workspace, hiding the document or closing the preview releases held notes. Separate input sources retain their own holds, so releasing a QWERTY key does not release the same note still held on a controller.

Live parameters lets you test exposed parameters that have no panel control. Preview preset chooses Default or a saved preset. Enter a Preset name and select Save preset to keep the current values; changing a preset releases held notes and changes values without replacing the sound definition.

The preview also shows Polyphony and a DSP meter. See performance for what those measurements mean.

If no audio host is active, the Designer reports Audio preview requires an active Studio audio host. Layout preview does not start sound. Return to Studio, activate its audio, then try Test audio again.

Save and continue#

The Designer saves completed interface edits locally. Save interface explicitly saves the current layout too. Check the save status before closing; Back to devices returns to My Devices and stops preview audio. Saving a layout or artwork keeps separate revisions from the device’s sound and presets.

The progress bar lists Patch, Compile, Draft, Design, Test and Publish, with states such as Ready or Needs attention. Earlier stages remain available. Build your first instrument opens a ten-step tutorial covering the patch, compilation, library, artwork, knob, binding, test and save. Previous step and Next step browse it; merely opening a step does not complete it. Public device publication is not an available continuation of this workflow.