SKUs: Velocity platform, AT-VGW-250, AT-VGW-HW-3, AT-VGW-HW-10, AT-VGW-HW-20, AT-VGW-SW, AT-VTPG-1000VL

Summary: This is a walkthrough of the buttons or components used in Velocity's CUI (custom user interface).

Pre-requisite

Velocity training will have to be completed to continue 301 Level | Programming with Velocity
In CUI, everything is custom and can be done in multiple ways. There is no one way to make something work, but plenty of ways exist to make things not work.
Ensure you understand your hardware and its capabilities.
- An AT-VGW-HW-3 or AT-VTPG-1000VL may not have the hardware to run a CUI with many buttons or macros before becoming sluggish.
- An AT-VGW-20 or AT-VGW-SW may be better for running larger systems with more complex programming.

Note: We will be using firmware 2.6.0 for this article. Button locations and features may be different if you are on another firmware.

Overview

Navigate to your CUI interface and open your components menu if it is not already opened.

This menu will be used a lot to build out your CUI rooms. The article will go through each menu and give some best practices for when to use each item.

We recommend always using Solid buttons.

The Components menu is broken up into five submenus.

Buttons

Media

Sliders

Labels

Panel Widgets

Buttons

The Button menu contains three options if your room is set up with connections, but if you do not have any connection or devices, it may only show Solid.

Solid

The Solid button is the most versatile and, therefore, the most used of all the components.

Using this for your sources and displays gives your more customization over the buttons to set conditions and macros.

Examples of what you can program Solid buttons for

drag and drop

navigation

toggles

Variable updates

And many more

Sources

The Sources menu will only appear if connections are made in your equipment room. Everything will show even if you choose Show Disabled on the device's configuration pages.

These are not used often as they are pre-constructed buttons with minimal customization.

The use case will be if you want a quick drag-and-drop CUI page with limited programming or customization. These also need to be used with display buttons to work correctly.

Displays

The Display menu will only appear if you have displays in your equipment room. These are used in Tendem with the Source buttons to route video.

No active feedback will be shown on these buttons. They are simple routing buttons that are pre-program.

For best practices, we recommend always using Solid buttons. You can use the Source and Display buttons together for a quick and straightforward setup, but the standard template may be better.

Media

The Media menu is closely related to Solid buttons but has some styles already set up.

Icon Buttons

The Icon menu changes the inside image to the icon of your choice.

You can change this in the style tab of the button.

Button Backgrounds

The Button Backgrounds menu has plain buttons that you can use to change the look of your CUI.

The issue with these is that the system still thinks they are square and not curved. You can see the hitbox in yellow. This may confuse drag-and-drop or hitboxes when customers are using them.

Room Images

The Room Images menu is for imported images. Drag and drop images into your canvas, and they will create as buttons.

Once in your canvas, the images will appear in the Room images.

Sliders

You can add vertical and horizontal audio sliders to your room in the Sliders menu.

The sliders can be linked to DSPs that you have in your equipment room.

If you want a Mute to go along with your slider, it is under the Panel Widgets menu.

Labels

The Labels menu is helpful for, you guessed it, Labels. These are like buttons without macros and are meant to show off text.

You can set these up for static or variable text in the Style properties of the button.

Panel Widgets

The Panel Widget menu has different tools to lay out the beginning of a page. These are for more advanced users as they are more like layouts that have to be programmed.

Note: Italics