Web User Interface

The Asset Manager includes a built-in web server that provides a browser-based interface for uploading and managing assets. This lets team members contribute media from any device on the network — laptops, tablets, or phones — without needing the WATCHOUT Producer application installed. The web UI is particularly useful during collaborative setup and rehearsal when several people need to add or review content at the same time.

How It Works

The web UI is compiled into the Asset Manager binary and served by the same process. The server binds to port 3023. When the Asset Manager starts, the web UI is available — there is nothing extra to configure.

The browser sends the file to the Asset Manager over HTTP. From there it enters the same processing pipeline as files added through Producer — upload, optimize, store, and distribute. See Asset Manager.

Assets uploaded via the web UI appear in Producer's Assets window in real time.

The header reads "Asset Manager Web" and shows the running version and the host reference. This confirms which node you are connected to.

If the connection drops, an offline overlay blurs the page and shows a wifi-alert icon. The UI reconnects on its own once the Asset Manager is reachable again.

Accessing the Web UI

  1. Make sure the Asset Manager node is running and a show is loaded.
  2. Open a web browser on any device on the same network.
  3. Go to:
http://<asset-manager-ip>:3023

Replace <asset-manager-ip> with the IP address or hostname of the Asset Manager node.

You can also open the web UI from Producer. Right-click in the Assets window and choose Open Web UI. Producer looks up the Asset Manager node's IP and opens the URL in your default browser.

The port is always 3023 and cannot be changed. The URL uses the IP of the Asset Manager node, which may be different from the Producer machine. If you are unsure which node is the Asset Manager, check the Nodes window in Producer.

The Toolbar

A toolbar runs across the top of the page. The right-side buttons are icon-only. Hover to see the tooltip. Items from left to right:

ControlWhat it does
Title and filterA filter dropdown sits next to the "Assets" title. Choose All, an asset kind (Image, Video, Audio, etc.), or Failed to show only assets that failed to optimize.
Folder breadcrumbWhen you open a folder, its path appears here. Click any segment to jump back up the tree.
ColumnsOpen the dropdown to toggle which columns are shown. The Name column is always on. Your choice is saved between sessions.
SearchFuzzy search across name, path, and kind. Type one or more terms. Each term must match. Spaces, commas, periods, hyphens, underscores, and slashes all split terms. Results update as you type. Press Alt+Enter to focus the field and Esc to clear it.
DeleteRemoves the selected assets. Disabled when nothing is selected.
UploadOpens a file picker for one or more files.
Upload folderOpens a folder picker. Disabled inside a Dynamic Asset folder.
SettingsCog icon. Opens the Asset Manager Settings dialog (see below).
Create folderCreates a new folder inside the current scope. Disabled inside a Dynamic Asset folder.

Folder creation and folder upload are only allowed inside plain folders or at the root. They are disabled inside Compositions and Dynamic Asset folders, where the structure is fixed.

The Asset Tree

Assets are shown in a hierarchical tree. Folders contain assets and other folders. Each row shows the asset's name, an icon for its kind, and the columns you have enabled.

Besides Name, Thumbnail, Dimensions, Duration, and Date, the table offers Type, State, FPS, Codec, Color, Channels, Original Path, Progress, Optimized Size, and UUID. Toggle the extra columns from the Columns dropdown in the toolbar.

Click a Type cell to filter the list to that asset kind.

The Color column shows the input and output color space. When they differ, both appear as input → output.

The State column shows each asset's status with an icon: a check for Ok, gears for Optimizing, a spinner for Uploading, a red alert for Failed (hover it to read the error), and a grey alert for Cancelled.

Original Path shows the source folder and file name of the imported file. It is empty for files uploaded through the browser, which do not expose a full path. UUID is the asset's unique identifier, used in asset and thumbnail URLs.

A dynamic asset folder shows a recycle badge, and its Type reads Dynamic Visual, Dynamic Audible, or Dynamic Display Data.

Expand and collapse folders by clicking the chevron in the Name column, or by double-clicking the folder row. Each folder's open state is saved in your browser. The tree looks the same when you reload the page.

Drag the divider between two column headers to resize a column. The width is saved in your browser.

Inside a folder, rows are sorted in this order:

  • Plain subfolders first, alphabetical.
  • Compositions, Dynamic Asset folders, and leaf assets mixed together, alphabetical.
  • Inside a Dynamic Asset folder, versions are sorted by creation time with the newest at the top.

This mirrors the order used in Producer's Assets window.

Selecting Assets

Click a row to select it. Shift-click to select a range, and Ctrl-click (Cmd-click on macOS) to add or remove single rows. Click an empty area to clear the selection. Delete and drag-move act on the whole selection.

Uploading

You can upload files in three ways:

  • Drag onto a folder row. The files are uploaded into that folder.
  • Drag anywhere else — onto a leaf row or empty area. The files are uploaded into the current folder scope (the root by default).
  • Click the Upload or Upload folder button in the toolbar.

Folder uploads preserve the folder structure under the destination.

While you drag, the destination folder row highlights to show where the files will land before you release.

Dropping files onto a Dynamic Asset folder adds each file as a new version of that asset, matching the behavior of Producer.

File Size Limit

The Web UI has no fixed upload size limit. The practical limits are available disk space on the Asset Manager node and the 24-hour HTTP timeout per upload. For multi-gigabyte files, use a wired connection.

Upload Progress

Each upload shows a progress spinner and percentage on its row. While an upload runs, you can keep adding more files. Uploads do not block each other or prevent the operator from using Producer.

The table also has dedicated Progress and Optimized Size columns. Progress shows the percent complete. Optimized Size shows the size after optimization. Enable them from the Columns dropdown.

After the upload finishes:

  1. The asset appears in Producer's Assets window in the Uploading state.
  2. Optimization begins as soon as the upload completes.
  3. The asset transitions through Optimizing to Ok.
  4. Once optimized, the asset is ready to be distributed to Runner nodes.

See Asset Properties for the full asset state pipeline.

Moving Assets

Drag an asset row onto a folder row to move it there. If several rows are selected, all of them move together. The drop target is the row under the cursor. Dropping onto an empty area moves the selection to the current folder scope.

Hover Preview

Hold the pointer over a thumbnail to see a larger 256-pixel preview anchored under the row. The preview uses the same image as the row thumbnail.

A thumbnail that is still being generated shows a "No Preview" placeholder and fills in on its own once it is ready. An empty or fully-filtered tree shows "No assets".

Cancelling Uploads and Optimization

While an asset is in the Uploading or Optimizing state, a small cancel icon appears next to the spinner. Click it to stop the job.

The cancelled asset stays in the list in the Cancelled state until you delete it.

Asset Manager Settings

The cog button in the toolbar opens the Asset Manager Settings dialog. These are the same optimization settings as in Producer, editable from the browser. Changes apply to future optimizations only.

The dialog has four sections:

  • Bandwidth Limit — caps the transfer rate to Runner nodes, in Mbit/s. Set 0 for unlimited.
  • Track Management (Audio/Video) — the Composition Logic dropdown: Skip Audio, Skip Video, Composition, or Individual Assets.
  • Output Properties — a Quality Level (Good, Very Good, Excellent, Optimal, Best) for codecs that support it.
  • Codecs (in → out) — the source-to-output codec mapping. A changed row shows a colored arrow with a restore button. Reset All reverts every row.

Save is enabled only after a change. For what each setting does, see Asset Manager Settings.

Keyboard Shortcuts

The following shortcuts work whenever the table has focus (text inputs are not affected):

ShortcutAction
Up / DownMove selection one row at a time.
Left / RightCollapse or expand the selected folder, or move into / out of it.
Home / EndJump to the first or last row.
Page Up / Page DownScroll a page at a time.
Ctrl/Cmd + ASelect all visible rows.
Delete / BackspaceDelete the selected rows, after confirmation.
Alt + EnterFocus the search field.
EscClear the search field when it has focus.

Browser Compatibility

The web UI works in any browser released from 2020 onward. Internet Explorer is not supported.

Security Considerations

The web UI has no authentication. Anyone who can reach the Asset Manager's IP and port on the network can upload, browse, move, or delete assets. This is by design for ease of use in controlled AV environments.

In production, protect the web UI with network-level controls. Anyone with access to port 3023 can modify your show's assets, including deleting them.

For production, restrict access to port 3023 with firewall rules, and block the port on the Asset Manager node when the web UI is not needed. The general network isolation advice — dedicated network, VLANs, physical or logical separation — applies to all WATCHOUT traffic and is covered in Asset Transfer.

Relationship to Other Ingestion Methods

The web UI is one of several ways to add assets to a show. Choose the method that fits your workflow:

MethodBest ForRequires Producer?
Web UIRemote team members, mobile devices, quick uploads during setupNo
Drag and drop (Producer)Primary operator adding files from the local machineYes
Asset WatcherAutomated pipelines, render farms, scheduled updatesNo
ImportMigrating a complete show package from another systemYes

All methods feed into the same optimization pipeline and produce identical results. See Asset Manager for an overview.

Best Practices

  • Share the URL with your team. At the start of setup, share http://<ip>:3023 with everyone who needs to contribute content. This saves time compared to collecting files on USB drives or email.
  • Create folders before the team starts uploading. This prevents all files from landing in the root of the tree.
  • Monitor from Producer. While others upload via the web UI, the operator should watch the Assets window in Producer to confirm uploads complete and optimization proceeds as expected.
  • Test connectivity first. Before relying on the web UI during a show, open the URL in a browser and confirm the interface loads. Firewall rules, network segmentation, or IP address changes can silently break access.