Tag: Updates

New Round Slider Element

We are pleased to introduce our new Round Slider. It features outstanding responsiveness and can seamlessly fit into any environment. It can be adapted both in height and width simultaneously. All content within the slider also automatically adjusts to the element’s size by default, which is highly convenient.

Taking into account your feedback and our previous experience with the earlier version of the slider (Circle Slider One), the internal content is now presented as a standard text field. This allows you to freely arrange the necessary content across any number of lines and format it exactly as you wish.

A rich set of options allows you to style your slider and achieve completely different results that seamlessly fit into your design concept.

A universal approach to defining the list of element options.

Due to the growing number of elements and their settings, it became necessary to standardize all properties in a consistent style across all elements. We carried out extensive work to group the properties in a clear and convenient way. For now, these properties will only be available in this form for the new elements introduced with this update. In the near future, we will gradually update the properties of all existing elements to bring them into full consistency.

Element state management.

For new elements, we’ve made element state storage and usage universal. It can be stored and retrieved from any dynamic source: data sources, parameters, global variables, data received via WebSocket or HTTP requests. The Crestron option remains available. In the future, we’ll upgrade all elements so they can store, retrieve, and send state through any channels, not just Crestron.

New Color Picker Element

It’s time to introduce the new ColorPicker element. It allows you to add any RGB color range.It can store its state with any dynamic data; similar to RoundSlider, it is fully responsive and can adapt to any parent width and height.

Auth improved

We’ve improved the authorization system. Now you can log in not only using the Email and Password combination, but also via the Google platform. In the near future, we’ll add several more convenient authentication methods.

Bug fixes and improvements

• Parameter handling has become much more stable. We fixed issues with boolean parameters, as well as some update and dynamic calculation errors.
• When creating a data source, errors could occur during test data retrieval, test function applications, etc. All these issues have been fixed.
• Color selection in some element layers could be slow. We’ve improved its performance in the following object and will continue working to make this process even more convenient and faster.
• And various other minor fixes and improvements.

AVStudio HTML5 GUI Editor Updates Version 3.4.0 | New features for Crestron Control System GUIs

At AVgator Inc., we are committed to evolving our AVStudio HTML5 GUI Editor to empower system integrators with faster, smarter, and more flexible tools. Our recent updates — versions 3.4.0 through 3.4.2 — bring exciting new features and capabilities that help Crestron HTML5 GUI developers deliver exceptional, customized control system user interfaces.

Premium Widgets for a One-Click Integration

NEW

With version 3.4.0, we launched the Autonomic Premium Widget — AVStudio’s first widget designed for one-click integration within your Control System Custom GUI project.

This new AVStudio HTML5 GUI Editor feature is developed to accelerate your Crestron Control System GUI design. Simply drag and drop the widget, enter the IP address, and you instantly get a sleek, fully responsive media player interface ready to use. No complicated setup — just rapid deployment that saves time and impresses clients.

Key features include:

• Only the IP field is required to get started
• Fully responsive design that fits any space
• Comprehensive support for the Autonomic API:
  • Full transport control (Play, Pause, Skip, etc.)
  • Real-time metadata display (album art, track info, artist name)
  • Volume control
  • Player selection
  • Seamless integration with Crestron, Global Caché, and other AV control systems

This launch marks the start of our vision to develop a diverse portfolio of premium widgets supporting one-click integration with multiple hardware and software platforms. These widgets will be tailored for residential, corporate, hospitality, and education use cases.

We are committed to making AVStudio the go-to Crestron HTML5 GUI Editor for seamless, drag-and-drop integrations across all environments.

Web Connectors to add IP-controlled devices

NEW

In addition to the existing Crestron Connectors, which enable fast development and testing of Crestron HTML5 GUIs within AVStudio, this new release introduces new Web Connectors. These empower you to integrate and control a wide range of other IP-based devices and control systems within the AVStudio HTML5 GUI Editor.

Managing HTTP resources in your AVStudio GUI projects is now easier with the new Web Connectors feature. Accessible from your project’s global settings, Web Connectors let you centrally store and manage data properties used across your HTTP actions, making edits faster and your Custom GUI Editor projects more consistent.

The New Web Connectors feature extends your GUI project capabilities far beyond standard Crestron hardware and makes AVStudio the go-to GUI Editor for system integrators working across AMX, Control4, Extron, Global Cache, and other various control systems and devices.

WebSocket connectors are currently under development and will soon complement the existing Web Connectors. This new functionality will enhance the handling of real-time data streams and support remote data sources, expanding your options for dynamic and responsive integrations in future AVstudio updates.

Redesigned Manage Actions Layout

NEW

To streamline your workflow, we redesigned the Manage Actions interface in the HTML5 GUI Editor to occupy almost the full screen and group actions thematically. This reorganization helps you quickly find and manage the actions you need, keeping your focus on building powerful GUIs without unnecessary distractions.

Workflow Improvements

BUGFIX

Between updates 3.4.1 and 3.4.2, we delivered key fixes and enhancements to make your control system GUI design experience within AVStudio more stable and smooth:

• Fixed issues with attaching dynamic page names in route actions
• Improved stability of routing-back operations
• Introduced the new Editor Connection Manager for better connection handling inside the editor
• Several minor improvements and bug fixes for overall performance

Fixed issues with attaching dynamic page names in route actions

Improved stability of routing-back operations

Introduced the new Editor Connection Manager for better connection handling inside the editor

Several minor improvements and bug fixes for overall performance

Explore these new features and enhancements in the AVstudio HTML5 GUI Editor for your projects completely free and accessible anytime at avstudio.app. Registration is quick and simple, so you can start building without delay.

Interested in early access to new features, direct communication with our developers, and opportunities to influence the future of Control System GUI design? Join our growing community of beta testers! Apply now to become a beta tester or contact us directly to learn more.

We are excited to introduce the latest updates in AVstudio, bringing you new features and improvements that will enhance your design experience. This version includes community templates, new design options like Shadow and Reflect, support for custom fonts, and various usability enhancements such as better hotkeys and the ability to switch between element modes by name. Additionally, performance optimizations and bug fixes ensure a smoother workflow. These updates are designed to provide you with more creative options and streamline your projects.

Community templates

 NEW

The first free community template is available in AVstudio. Feel free to clone these projects and reuse or modify them any way you want.

We plan to regularly add new templates, so stay in touch to not miss new stunning, free-to-use AV GUI templates!

Community templates

Try it yourself by following the link!

Design option: Shadow

 NEW

Shadow introduces a subtle, elevated look to your elements, creating a sense of depth. This design option enhances visual hierarchy and can make your elements stand out more effectively.

Design option: Reflect

 NEW

Reflect allows you to create mirrored versions of your elements with just a few clicks. This can be particularly useful for design symmetry and creating visually balanced layouts.

Custom Fonts

 NEW

Upload and use beautiful custom fonts everywhere you need to impress your customers!

Fonts can be attached from element settings or by using custom project CSS.

Switch between element mode by name

 UPDATE

You can now switch between element modes by using their names directly, making the design process more intuitive and streamlined.

Better Hotkeys

 UPDATE

Add hotkeys for quick copy/paste of elements. This works even between projects, but for now, it does not include associated data like datasets, attached functions, nested subpages, etc. Deep copy will be available later.

Current available hotkeys are:

ctrl/cmd + shift + z (redo)

ctrl/cmd + c (copy)

ctrl/cmd + v (paste)

ctrl/cmd + s (save)

ctrl/cmd + z (undo)

Double click to edit text fast

 NEW

You can double-click on text and button elements to open a text editor modal.

Override global project theme vars

 NEW

Take control of project variables such as colors, backgrounds, and more. In the near future, the list of available overrides will be expanded.

Functions: AVgator® project methods info

 UPDATE

You can now access a variety of built-in functions directly through the Window object. These include methods for data manipulation, element control, sending and listening to events, page flips, and more.

Large list loading optimization

 UPDATE

Now you can easily handle a large number of elements on one page without any performance issues.

Added keypad design options for colors, backgrounds and gaps

 UPDATE

Keypad design options have become more flexible.

Post-processing functions

 NEW

Post-processing functions let you apply effects and modifications to element values to alter the result. For example, based on a signal or string variable’s value, you can calculate and return the proper element’s mode index (or name) using some logic.

Image Sizing

BUGFIX

There were sizing issues with image elements and inside elements where images were used (such as in the shades widget). Sometimes, images were larger than expected and did not fit the container. This issue has been fixed.

Element modes

 NEW

We have added the capability to create mods for elements (all of them!). This allows for significant alteration of both the appearance and actions of the element depending on dynamic data. This functionality extends to page lists as well: you can easily modify the structure of the list with just a few clicks.

Mode creation dialog

Media upload: support for .svg (color inheritance included) and .webp

 NEW

We have implemented the ability to upload images in the webp format. Additionally, you now have the unique opportunity to upload images in the .svg format. It is important to understand that an SVG image containing ‘currentColor’ as a color indication will adopt the element’s color settings—this is particularly convenient for creating unique icons.

Extended media upload box

We recommend to use this icons: Open Source Icon Sets – Iconify

Use any .svg image as icon. Animated .svg also supported.

Granural Padding & Border Radius Control

 NEW

It has become convenient to set different value for different sides. Feel free to utilize this feature!

Advanced border radius control

Extended Background Size & Position

 NEW

Now you have more control over the background at the page, project, and other supported element. You can now specify sizes and positions as well.

Background Image for Containers

 NEW

The ability to specify a background for the container is now available. Control for position, opacity, size, blur included!

Containers with custom background Images

Border Radius for Containers

 NEW

Utilize border radius directives for the container to enhance the appearance of your project.

Container border radius

Text Wrap Behavior for Button & Text Elements

 NEW

Working with long text has become more convenient. Later we will add convenient tools for automatic truncation of long text.

Control over text wrap

Global Override Theme Design Settings

 NEW

We have moved global project background settings into a separate category in the menu. Additionally, in this menu item you now have the option to specify custom settings for the main colors used. In the future we plan to significantly extend control over the appearance at a global level and allow users to create and share their own design/color themes.

Override global theme color/background settings

Blur Content behind Subpage or Container

 NEW

At the container and subPage level, it is now possible to control the degree of blurring of elements/content beneath them. This is very convenient for highlighting, creating visually appealing effects and improving the readability of your interface.

Background blur effect

Containers are sortable again!

NEW

New Function Creation Modal

NEW

A new editor has been designed for creating functions. Writing and testing functions has become much more convenient. Additionally, integrated documentation with all available global data and variables for use will be added to this modal soon.

New Function Creation Modal

New DateTime Widget

NEW

We have added a DateTime widget for convenient and fast visualization of the current time and date with detailed formatting options and the ability to specify time zones.

DateTime widget

Precache External Images

 NEW

If your project extensively uses images from external sources you can now cache them in advance so that users will see them instantly when using your GUI.

Add datasource with urls array should be precached

Image Lazy Load Option

NEW

Using this option will allow you to defer the immediate loading of heavy images and improve the user experience.

Image lazy loading

Shades Control Widget Improved

 NEW

Advanced settings and bug fixes have been implemented for the shades control widget. You can now configure the curtain style in more detail. Additionally, users can adjust the degree of opening and closing by directly dragging the curtain fabric.

Added support for dynamic classnames

 NEW

We have added the ability to assign dynamic CSS classes to any element on your page. This allows you to change the appearance of elements using not only built-in settings but also custom CSS styles.

You can assign as many classes as you want separated by a space.

Dynamic CSS classnames for any element

Environments

 NEW

We are pleased to introduce our new feature, Environments. Now, each project can have multiple environments, each storing specific settings that can be used in various scenarios. For example, different connection settings to the processor that you can use at your workplace as well as for final testing on the client’s hardware. It’s easy to switch between environments both during interface creation and when selecting them for building. When changing the active environment in the page editor, the live preview instantly applies all the current settings you have selected.

Crestron processor auth token support

 NEW

We have implemented support for authorization tokens for connecting to processors. This allows us to avoid redirects during authentication.

Variables Side Effects

 NEW

Now you have the ability to react to changes in variable values. In the event of a variable change, you can create as many actions as needed. This can include actions to send any type of signal, assign a variable, change a page, or anything else necessary to implement your scenario.

Updated variables table

Variables side effects form

Dynamic subpage inside overlay

 NEW

Now, when opening the overlay you can specify the page that should appear in it dynamically. This allows us to implement various interface logic within a single element as part of an action.

Call overlay by subpage name

Video element updated: new options and HLS support

 NEW

The video element has been significantly enhanced. It now includes extended settings for controlling the display of player interface elements as well as support for the new format: HLS.

Updated video element

New action type: Run Function

 NEW

We have introduced the ability to create an action that allows you to execute any JavaScript function you have previously created. This action can be applied to any element.

Function runner

Bugfix & Small improvements

 UPDATE   BUGFIX

• Better behavior for text input element, slider, circle slider, toggle, checkbox, switch.
• Fix Button element pressed state styles
• Update fullscreen editors (html block, css)
• Back routing doesn’t trigger action if actually no back page exist
• Click on image allow open overlay
• Better webxpanel initialization method, webxpanel updated to latest version
• Fix bugs on touch click events
• Fix bugs when sometimes overlay cannot be closed
• Stop execute actions from list elements while it scrolling
• Edit action form bug with representing wrong initial data
• Click event may triggered twice on iOS – fixed
• Fix project clone process
• Improve page/subpage search
• Improve subpage search whet setting up a route action
• Live session isolation: one per login instance
• Fixed unresponsive field while editing assigned dataset
• Fixed: Color field doesn’t show current color value (text element for example)
• Fixed: Dpad keep working when disabled
• Fixed: Circle slider send wrong value when ends with zero and using fraction
• Add project clone progress indicator