⏱️Runtime UX

Designers once done with designing an App it is time for the users to run the same app designed and check its functionality. Designers can make the changes to the app at any time in Design Studio if there is need for any further additions to be made to the app. Designers will configure the app in Design Studio and users will run an app in Runtime mode. Users should have been assigned with Runtime access level to run an app.

Below is the image of our Design Studio Valorx Ribbon.

Runtime is defined by the Workflow and UX. Designers will configure all the actions of the Runtime in Workflow. Users can run the app both in Runtime and Runtime + Express Mode. Users can launch an app in three different ways like Button Click, App Launch and Launch from CRM.

Button Click: Designer will configure the workflow and add a button which will be displayed on the Valorx Fusion Ribbon. Users can launch the app just by clicking on the button. Designers can choose the button of their choice. Refer Workflow Settings - Button Click for more information.

Run at App Launch : Users can launch an app through App Lunch. Users can select the Workflow settings and select the properties to Run at App Launch this enables the app to launch when users open an app in Runtime. Refer Run at App Launch to know more.

Launch from CRM: Users has an option to launch an app from Salesforce. Users needs to visit the Salesforce and click on Launch from CRM then, the app will be launched from Salesforce. Temporary connection with "one time" org will be displayed when a user launches an app from Salesforce. Example : Connection name will now show up as "Launch for <FirstName>".

Refer Launch from CRM to know more information.

Users needs to click on Start, and click on Run button beside the app. Let's have a look at the Runtime ribbon.

Runtime Ribbon will have few sections like all the buttons which users add in workflow, Toolbox, Quickstart, Control Panel.

Workflow Buttons: Users will add a workflow and configure the actions of the app and add a button which will be displayed on the Valorx Ribbon tab for runtime. In the below image users has added the buttons and named the ribbon as My Opportunities. Once users click on the buttons the result will be displayed in runtime.

Toolbox: Toolbox will have six elements like Inset 1 Row, Clear 1 Row, Delete Rows, Lookup, Customize Grids and Mass Modifier. Refer Toolbox for more information on the elements.

Quickstart: As the name suggests this is used to start the app in a quick way. This has two elements like Express Mode and Favorites. Follow Express Mode for more information.

Favorites: Users can add the apps to Runtime Favorites. Let us follow the below steps to add an app to Favorite list. App is now added to the Favorite list now user can see the ribbon button for Favorite list. Refer Favorite List for more information on favorite list.

Control Panels: Users will find five components like Settings, Valorx App Store, Community, Support and User info.

Settings: Users will find the information related to the users license, Fusion Settings and Logs information. Refer Valorx Fusion Settings for more information.

Refer Logs for more information on Logs.

Valorx App Store : Users can submit a Valorx Fusion App to Valorx App Store. App Designers can build Apps for Valorx App Store that will be available to all Valorx Fusion customers.

User info: App Permissions is a new feature added under User Information in the Valorx Control Panel Ribbon. This will allow the user to verify the accessibility of the required objects and fields (Read, Create, Update and Filter).

Flyout Menu:

Flyout Menu, is an innovative addition to our Workflow and UX. This feature transforms the way buttons are organized by merging related buttons under a single menu. Not only does this optimization save valuable screen space, but it also enhances usability by providing a clear and easily accessible view of the available options.

With the Flyout Menu, users can group multiple buttons together without any limitations on the number of buttons that can be included. This flexibility empowers users to create comprehensive menus tailored to their specific needs, enabling quick access to a wide range of related functionalities.

By consolidating buttons under a single menu button, it provides a cleaner and more streamlined interface. The Flyout Menu ensures that all related buttons are organized logically, making it easier for users to locate and select the desired action. Users can simply expand the menu to reveal the available options.

Note: Menu button will not show the “Run at App Launch” option as it is a button on the ribbon, and it will not have any workflow. Button(s) under the Menu button will have this option available.

• Access the Design Studio Mode of the Valorx Fusion app. Navigate to the Workflow and UX.

• Next, locate the option labeled "Add Button Group" or the "+" icon located under the Ribbon UX.

• After opening the group button, you will see an option to add menu buttons. Click on "Add Menu Button" to add buttons to the group.

• Once you have clicked on "Add Menu Button," the buttons will be displayed. Proceed to edit the name of the button as desired.

• To add or remove menu buttons, you can either click on the number displayed next to the button or use the option "Add or remove menu buttons."

• To add the buttons to the newly created menu button, simply drag the button and drop it onto the Menu Button.

• Open the Workflow or click Edit button. By default, the buttons will be displayed under the Menu in the Workflow Trigger.

• From the drop-down menu, select the desired Menu button.

  Note: If you select an empty area, the menu button will be moved to the group level.

• To select or change the icon associated with the button, simply click on the "Change" option.

• Once you have made the necessary modifications, click on the "Save" button to save your changes.

Note: Please note that small buttons are supported for buttons within the Menu button.

• If there are empty menu buttons, a message will appear indicating this. To proceed, click on "Yes" if you want to continue with the empty menu buttons. Alternatively, you can click on "No" to add buttons to the empty menu.

• Save and run the App to see the button menu under Runtime Ribbon.