About VizMix
VizMix is a browser-based VJ (Visual Jockey) software.
- No installation required - runs in your browser
- 2-channel mixing - crossfade between A/B channels
- Channel dimmers - independent brightness control per channel
- 16 banks - 8 media slots per channel
- BPM sync - tap tempo, auto-switching, BPM flash
- Video effects - Color / Adjust / Blur / Glitch effects
- MIDI support - freely assign controls via MIDI Learn
- GLSL shader / ISF shader support
Installation
Web Version (Recommended)
Simply access VizMix in your browser. No installation required.
- Open Chrome browser
- Navigate to VizMix URL (Coming soon)
- Start using immediately
Web version requires no additional software installation.
Download Version (Coming Soon)
A downloadable version for offline use is planned for a future release.
Basic Usage
Screen Layout
- Channel A (Left) - Dimmer + video preview + playback controls + 8 banks
- Master (Center) - Master preview + crossfader + BPM controls
- Channel B (Right) - Video preview + dimmer + playback controls + 8 banks
- Effects Panel (Right Side) - VIDEO EFFECTS (collapsible)
Channel Dimmers
The vertical slider next to each channel preview is the dimmer.
- 0% (bottom): Blackout / 100% (top): Full brightness
- Operates independently from the crossfader
- Preview brightness updates in real-time
- Controllable via MIDI
Loading Videos
- Drag and drop video files onto bank buttons
- Or double-click a Media Browser thumbnail to assign
- A thumbnail appears and the video is loaded
- Click bank buttons to switch videos
Supported formats: MP4 (H.264), WebM (VP8/VP9). MP4 recommended.
Loading Shaders
- Drag and drop shader files (.glsl / .frag / .fs) onto bank buttons
- Button turns purple when shader is loaded
- ISF format (.fs) is supported - INPUTS uniforms are auto-generated
Crossfade
Use the center slider to mix between Channel A and Channel B.
- Left: Channel A 100%
- Center: 50% / 50%
- Right: Channel B 100%
Output Window
Click "Open Output" to open the output window. Move it to the monitor connected to your projector or LED and make it fullscreen.
Output resolution can be set to 540p / 720p / 1080p via the dropdown in the header.
Media Browser
Media Browser panels are located next to Bank A / Bank B. Browse folder contents and easily assign videos to banks.
Selecting a Folder
- Click the "Select Folder" button
- Choose a folder containing video files
- Supported files will be displayed as thumbnails
View Modes
- Grid View: Display thumbnails in a grid layout
- List View: Display filenames with thumbnails vertically
Toggle between views using the icons in the panel header.
Assigning to Banks
- Drag & Drop: Drag a thumbnail onto a bank button
- Double-click: Double-click a thumbnail to assign it to the currently active bank
Supported Formats
- Video: MP4 (H.264) recommended, WebM
- Shaders: .glsl / .frag / .fs (ISF supported)
Webcam
Use the Media / Cam toggle button below the Channel A / Channel B preview to switch to camera input.
Basic Usage
- Media / Cam Button: Click to toggle between Media mode and Cam mode
- Cam Mode: Display camera feed in real-time
- Media Mode: Display normal bank media
Multi-Camera Support
- Select which camera to use from the dropdown menu
- Channel A and Channel B can use different cameras
- OBS Virtual Camera and similar tools are also supported
Requirements
- HTTPS or localhost environment required
- Browser will request camera access permission on first use
Playback Controls
Playback controls are located below each channel preview.
Controls
- Play/Pause button: Click to toggle playback
- Seek bar: Drag to jump to any position (video pauses automatically)
- Time display: Shows current playback position
Note: Seek bar is hidden when an ISF shader is loaded.
Keyboard Shortcuts
| Key | Function |
|---|---|
| 1 - 8 | Select Channel A bank |
| Q W E R T Y U I | Select Channel B bank |
| A | Crossfader left (A 100%) |
| S | Crossfader center (50/50) |
| D | Crossfader right (B 100%) |
| ← → | Crossfader fine adjust (±1%) |
| < > | Crossfader fine adjust (±1%) |
| Shift + ← → | Crossfader adjust (±5%) |
| Space | Tap tempo |
| ↑ ↓ | BPM ±1 |
| Shift + ↑ ↓ | BPM ±5 |
| P | BPM play/pause |
| X | Auto-switch toggle |
| [ ] | Change auto-switch interval |
| F1 | Invert ON/OFF |
| F2 | Grayscale ON/OFF |
| F3 | Sepia ON/OFF |
| F4 | Reset Blur |
| F5 | Reset Brightness |
| F6 | Reset Contrast |
| F7 | Reset Glitch |
| F8 | Reset RGB Shift |
| F9 | Reset RGB Multiply |
| Tab | Toggle Effects Panel |
| O | Open Output Window |
| H | Show help |
| Ctrl+Shift+D | Debug overlay |
BPM Features
Setting BPM
- Manual input: Enter value directly (40-200)
- Tap tempo: Tap the TAP button or Space key in rhythm
Beat Indicator
Four dots light up in sync with the beat.
Auto-Switch
- Enable "Auto Switch" checkbox
- Select switch interval (1/2/4/8/16 beats)
- A↔B will switch automatically on the beat
BPM Flash
Overlays a white flash on the output in sync with the BPM.
- FLASH button: Click to toggle flash ON/OFF
- Pattern select: Choose from 1/1 (every beat) / 1/2 / 1/4 (default) / 1/8
Effects
Effects Panel
The effects panel is located on the right side of the screen.
- Open/Close: × button to close / "FX" button on right edge to open / Tab key to toggle
- Select Effect: Click effect in list → Parameters appear
- Toggle ON/OFF: Double-click effect, or use toggle in parameter panel
- Adjust Parameters: Drag sliders
Panel open/close state is saved and restored on next visit.
Available Effects
| Category | Effect | Shortcut | Description |
|---|---|---|---|
| Color | Invert | F1 | Color inversion (ON/OFF) |
| Grayscale | F2 | Grayscale (0-100%) | |
| Sepia | F3 | Sepia tone (0-100%) | |
| Adjust | Brightness | F5 | Brightness (-100 to 100) |
| Contrast | F6 | Contrast (-100 to 100) | |
| Blur | Blur | F4 | Blur (0-100%) |
| Glitch | Glitch | F7 | Horizontal slice displacement (0-100%) |
| RGB Shift | F8 | RGB channel offset (0-100%) | |
| RGB Multiply | F9 | Color tint multiply (0-100% + color picker) |
RGB Multiply Color Selection
Use the color picker or preset buttons (R / G / B / C / M / Y) to select a tint color. Great for monochrome-style visual effects.
MIDI Support
Connection
- Connect your MIDI controller to PC
- Open VizMix (or refresh the page)
- Device name appears in the header when connected
Note: MIDI only works in Chrome/Edge. HTTPS connection required.
MIDI Learn
Freely assign any MIDI knob, fader, or button to any UI parameter.
- Click "Learn" button in the header → Enter learn mode
- Click the UI element you want to assign (slider, button, etc.)
- Move a knob/fader/button on your MIDI controller
- Mapping is automatically registered
- Click "Learn" again to exit learn mode
Mappings are saved in the browser and automatically restored on next visit. Click "Clear" to remove all mappings.
Assignable Parameters
- Crossfader
- Dimmer A / B
- BPM
- Bank A / B selection
- Effect parameters
- Auto-switch, tap tempo, etc.
Troubleshooting
Video not displaying
- Check video format (MP4/H.264 recommended)
- Ensure Chrome hardware acceleration is enabled
- Refresh page (Ctrl+Shift+R)
MIDI not recognized
- Confirm using Chrome/Edge
- Confirm HTTPS connection (or localhost)
- Connect MIDI device before refreshing page
Performance issues
- Lower output resolution (use 540p via the header dropdown)
- Close other tabs and applications
- Glitch/RGB Shift effects are CPU-intensive; set to 0 when not in use
- Dedicated GPU recommended (GTX 1060 / RX 580 or better)
License
VizMix
© 2024-2026 VizMix. All rights reserved.
- Trial Version: Free for personal use
- Full Version: Paid version planned
Third-Party Libraries
VizMix uses the following open-source libraries:
| Library | License | Purpose |
|---|---|---|
| PlayCanvas Engine | MIT | WebGL rendering |
| Vite | MIT | Build tool |
See LICENSE.txt for details.
Output Rights
Any visuals created with VizMix belong to you. Use them freely, including for commercial purposes.
Disclaimer
This software is provided "as is". The developer assumes no liability for any damages arising from its use.