In this section of the training materials, we will be guiding you through the process of installing a demo application. This application will be used throughout the rest of the training materials, so it's important that you are able to successfully install it. The demo app is a great starting point for getting to know the different features and functionalities that will be covered in the upcoming exercises. It also contains numerous examples that can be used to help you experiment and try new things on your own.

• Download the latest Apliqo UX installer file

• Right-click Apliqo UX installer file and select Run as Administrator

• Follow the installation wizard:

  • Click Next button

  • Click I Agree button

Open

Open

• Select:

  • Demo Applications

  • Install Apliqo Server

• Click Next button

• Finish installation by clicking Finish button

1. Log-in

• Navigate to: http://localhost:8880/Apliqo_Demo/#!/

• User: Demo1 / blank password

2. Enable Edit mode

Edit Mode button gives you the ability to create new applications and make changes or edits to existing ones. It allows you to customize and personalize applications to meet specific needs. Once edit mode is enabled, you will have access to a wide range of editing tools that can help you to modify your applications. Whether you are creating a brand new application from scratch or making changes to an existing one, edit mode is an essential tool.

1. Enable edit mode by clicking Edit Mode button

3. Create first App

Apliqo application is structured in a folder manner, allowing you to organize everything in a logical and intuitive way. By creating folders and subfolders in the navigation bar, you can easily manage your applications and keep them organized.

Creating a new application is a straightforward process. In the Navigation bar click + Add app button that will open Create app popup.

1. Follow the steps

• Enter the App title: App Templates

• Change Create With Default Settings option to No

• Click Create button

After clicking Create button new folder App Templates will appear in the Navigation bar.

A dashboard is a collection of widgets of different types that provide users with a quick and easy way to view and analyze data. These widgets can include charts, graphs, tables, and other types of visualizations that allow users to easily interpret complex data.

By organizing data into a dashboard, you can quickly identify trends, patterns, and insights that might otherwise go unnoticed.

1. Create new dashboard

1. Add a new folder under App Templates

• Open App Templates folder and click + Add...

• In the popup do the following configuration:

  • Public option will be chosen by default, don't change it

  • Type option should say Folder

  • Enter the Folder title: Dashboards

  • Click Create button

New Dashboards folder was created under App Templates.

1. With folder ready you can create first dashboard

• Open App Templates folder

• Choose Dashboards folder

• Click + Add public

• In the popup do the following configuration:

  • Change the Type by choosing Dashboard from the drop-down list

  • Leave the Dashboard Title empty

  • Change Cube Source by choosing General Ledger from the drop-down list

  • Click Create button

After clicking Create button the app will navigate to the newly created dashboard.

2. Publish the App

Newly created pages that have not yet been published will not be visible to others and will be marked with a pencil icon.

1. Save your changes and make the dashboard available for other users

• Click Publish button that will trigger confirmation popup

• Click Yes

Changes will be confirmed by notification visible in the right corner of the page. Publish & Delete button will no longer be displayed.

3. Configure the dashboard

» Change dashboard title and add info tool-tip

Title Change

While in Edit Mode click on page title and when the text field becomes editable, you can easily change the title.

1. Follow the steps

• Click on the page title and change it to: Exec Dashboard

• Click outside of the editable text box and make sure that the title changed

Adding info tool-tip

You can add page specific info tool-tips.

1. Follow the steps

• Click on the Info icon visible next to the page title.

• In the Edit Info popup add This is my first Dashboard info and click Save button

• Hover over Info icon and check if info tool-tip displays and shows the correct text

» New Cube Settings dialog Overview section

» Configure widget data

For the widget to display data, it needs to be configured using the cube settings popup.

1. Follow the steps

• While in Edit Mode click on cube icon visible in widget header and wait for the popup to appear

• Select Default from the View list visible in the left side of the popup under the General Ledger cube

The table preview will be now visible. Global filters as well as column and row dimensions are automatically configured to match the settings from the Default view.

After learning about the fundamentals of view definition, the next step is to further configure it to suit your specific requirements.

1. Drag & drop

• Region dimension to the Widget Rows

• Version dimension to the Widget Columns

• Account dimension to the Global Filters

Click refresh button to see updated table preview.

1. To further practice the configuration process, assign fixed values to certain dimensions

• Select Currency global filter dimension

• Open advanced options GUI by clicking on the wrench icon

• Select Dimension Settings

• Set the Fix option to Yes

• Click Select to choose Selected Fixed Value from the dropdown list

• Choose Local

• Close the cube settings popup

All the changes made in the cube settings modal will be visible in the dashboard.

» Update Global filter attribute

As shown on the screenshot below, Account global filter as well as Region row dimensions are displaying element technical names. This is because for those dimension no attribute was selected.

1. Update the attributes

• Open New Widget cube settings

• Click on the Account dimension

• Open advanced options GUI by clicking on the wrench icon

• Select Dimension Settings

• Change the Attribute value to Code and Description

• Click on the Region dimension

• Change the Attribute value to Code and Description

• Close the cube settings pop-up

Account filter and Region row dimension are now showing the full description.

» Change widget title and add info tool-tip

Title Change

1. Changing the widget title works the same way as it does for dashboards

• Click on the widget title in the editable text box input e.g. Overview

• Click outside of the text box and make sure that the title changed.

Adding info tool-tip

1. Adding information to the widget works the same way

• Click on the Info icon visible next to widget title.

• In the text box add: This is Region Overview widget info

• Click Save button

4. Create new widget

» Add new widget

Adding a new widget to a dashboard can be a great way to enhance its functionality and provide users with more insights and data.

1. You can do that from the dashboard level

• Click the “+” button visible in the dashboard toolbar and choose Widget from the list

• Enter the widget title: Column

• Change the cube source to Retail

• Click Create button

» Setting up the Column chart

Same as in the previous case, in order for the widget to display data, you need to configure it using Cube Settings.

1. Follow the steps

• Click on the cube icon visible in the Column widget header

• Select Default from the Views list under the Retail cube

• Make sure that the preview table is visible

After finishing the configuration close Cube Setting popup and make sure that Column widget displays data.

» Change the widget type

For now, the widget doesn't look like a chart yet. Each widgets header shows its type, in this case it's Grid.

1. Change the widget type

• Click the widget type info visible in the widget header, it now displays Grid

• After the widget type selection menu opens, choose Charts section

• Click Column

Widget refreshed and is now displaying column chart, type visible in the header should say Column.

5. Change the size and layout of widgets

When creating a dashboard, it's important to pay attention to the layout settings. A well designed layout can greatly improve the user experience and make it easier to access important information.

One way to achieve this is by using flexible layout option, which will allow you to place widgets in a variety of sizes and positions. Alternatively, you can use device settings to create a more structured grid layout.

» Flexible Layout functionality

With Flexible Layout functionality, users can easily adjust the size of widgets using drag handles and drag and drop them to different positions within the dashboard. This feature enables users to customize the layout of their dashboard to fit their needs and preferences, providing a more user-friendly experience.

1. Follow the steps

• Click Layout Settings button visible in the toolbar

• Check the box for Flexible Layout

• Click Edit Layout button

• Set the position of the widgets using drag and drop functionality

• Adjust the size of the widgets using drag handle

• When you're finished with configuration, click Lock Layout button

» Device Settings

Flexi grid is not the only way to adjust our dashboard layout. Apliqo UX has the capability to work on all display sizes. In the device settings popup you can set how the page is uniquely displayed on the desktop, tablet and mobile.

Follow the steps below:

• Click Layout Settings button visible in the toolbar

• Uncheck Flexible Layout box

• Select Device Settings button

To be able to create responsive layout, the browser window is divided into 12 columns to get more control over the items or graphics that are used on a page. Each columns width is defined by percentage (%) instead of a constant value. This way, it doesn’t matter the size or display resolution of the device, if you need to use several widgets on a row, you need to pick how many columns you need for each with the idea of having 12 columns in total in a row.

Number of column used is controlled by the column bar.

1. To practice this method, follow the steps

• Set the column bar to 6 for Overview and Column widget

• Close the popup

Notice that the widgets have taken up 50% of the page's width.

1. Try different configuration

• Set the column bar to 3 for Overview and Column widget

• Close the popup

As you can see the dashboard has updated once again. The same method is used to set layout for other devices.

Let's return to the original layout by checking the Flexible layout checkbox under Layout Settings.

6. Widget interactivity

» Turn on Hyperlinks

By enabling the hyperlink option for row elements in widgets, users can interact with the data in a more dynamic way. Clicking on a row element will update the dashboard filters.

1. To enable this option follow the steps

• Open Cube setting for the the Overview widget

• Click on the Region dimension

• Open advanced options GUI by clicking on the wrench icon

• Select Dimension Settings

• Set the HyperLink to change filters value to Yes

• Close the pop-up

Region row headers are now formatted as hyperlinks and clicking them will update Region global filter.

» Active Row

In this exercise, you will learn how to turn off the active row highlight. The active row is the one that corresponds with the current global filter value and is highlighted in the grid.

To begin with, take a look at the Overview widget and notice that Europe row has different formatting applied.

1. Follow the steps

• Change the region global filter to America and observe that the highlighted row changes

• Click on the widget header. You will see a blue triangle indicating the current selection

• Open the advanced options panel by clicking on the wrench icon

• Expand the Table Config section by clicking on the + icon

• Select Active row and set the Enabled option to No

You should now see that the highlight is no longer appearing in the grid.

7. Duplicate and delete a widget

» Duplicate a widget

Creating new widgets from scratch can be time-consuming, but fortunately, there is a quicker way to add similar widgets to a dashboard. By duplicating an existing widget, you can save time and effort in the widget creation process. This allows you to make small tweaks to the duplicated widget to create a new, custom version that meets your needs.

1. Follow the steps

• Open Action Menu for Column widget by clicking on the 3 dots icon visible in the widget header

• Choose Duplicate

• Input Title: Duplicate Column

• Click Duplicate

New widget will appeared in the dashboard.

» Delete a widget

• Open Action Menu for Duplicate Column widget by clicking on the 3 dots icon visible in the widget header

• Choose Delete

• Click Yes in the confirmation popup

Duplicate Column widget is no longer visible in the dashboard.

8. Additional functionalities

» Basic Widget Settings

This exercises will focus on exploring basic widget settings, with a specific focus on card configuration. By adjusting these settings, users can customize the appearance and behavior of widgets in their dashboard. This can improve the usability and functionality of the dashboard.

Height

Configuring the card height of a widget is an important aspect of dashboard design. There are three possible ways to set the card height:

• fixed value (e.g. 500),

• auto

• percentage-based (e.g. 50% or 100%)

The auto option will automatically adjust the card height based on its content, while the percentage-based option will allocate a given percentage of the page height to the widget. these settings will not apply if the user is using the Flexible Layout grid option.

In this exercise, we will explore how to configure the card height of a widget using all available options.

Navigate to UX Samples - Card Config - Height: auto, 50%, 100%

Fixed value

1. Follow the steps

• Open the advanced options panel by clicking wrench icon

• Select Widget 1 widget (selection will be indicated by the blue triangle visible in the header)

• Select Card Config

• In the Height textbox input: 700 (clear the auto value)

Notice that the widget height changed accordingly to the inputted value.

Auto

1. Follow the steps

• Open the advanced options panel by clicking wrench icon

• Select Widget 1 widget (selection will be indicated by the blue triangle visible in the header)

• Select Card Config

• In the Height textbox input: auto

Card height changed and now it will automatically adjust to the table content.

1. To test it further, follow the steps below

• collapse America element by clicking on the minus icon (-)

• card height will again adjust to match the table content

Percentage-based

Now you will use % value to define the widget card height.

1. Follow the steps

• Open the advanced options panel by clicking wrench icon

• Select Widget 1 widget (selection will be indicated by the blue triangle visible in the header)

• Select Card Config

• In the Height textbox input: 100%

You will notice that the chart widget is still taking up 100% of space available in the dashboard.

1. Test it further

• open the browser settings menu

• use zoom option and change it to 150%

• widget is still taking up 100% of space available in the dashboard

• open the browser settings menu » use zoom option and change it to 80% Chart widgets is still taking up 100% of space available in the dashboard.

By setting the widget card height using %, users can define the amount of space that the widget should take up on their dashboard, allowing for a customized design. This means that users can input any value they need to achieve the desired widget height.

Title Separator

In this exercise, we will disable the title separator, which is the line that appears between the header and content of a widget in a dashboard. While it can provide a clear visual distinction between these two areas, some users may prefer to disable it for aesthetic or functional reasons.

1. Follow the steps

• Open the advanced options panel by clicking wrench icon

• Select Widget 1 widget (selection will be indicated by the blue triangle visible in the header)

• Select Card Config

• Set Title Separator to No

You will notice that the line between widget and it's content is no longer visible.

Top Border

In this section you will learn how to customize the appearance of a widget header by changing the Top border setting. By adjusting this setting, you can control whether the widget header is visible outside of the edit mode, giving you greater control over the overall look and feel of your dashboard.

1. Follow the steps below and see the impact it has on your widget design

• Open the advanced options panel by clicking wrench icon

• Select Widget 1 widget (selection will be indicated by the blue triangle visible in the header)

• Select Card Config

• Set Top Border to No

• Save the changes

• Disable the edit mode

You will notice that the widget header is no longer visible. Turn the edit mode back on.

No Card

Each widget has a card layout and it has default styling such as white background, a primary color top border, a slight drop shadow effect around the box and margins around it to create some space. Default No Card value is No which means there is a rectangle card layout covering the widget.

1. Remove the card property from the widget

• Open the advanced options panel by clicking wrench icon

• Select Widget 1 widget (selection will be indicated by the blue triangle visible in the header)

• Select Card Config

• Set No Card to Yes

You will notice that the widget card is no longer visible. Discard the changes.

» Setting up widget filters

Navigate to App Templates - Dashboards -Exec Dashboard

Changing dashboard filters applies to all widgets on a page. However, there is an option to set a filter that will apply only to the selected widget.

1. This is how you can do it

• Open Cube Settings for Overview widget

• Drag and drop Year dimension to Widget Filters section

• Close the popup

Now Overview widget has a filter available in its header, it's displaying 2016.

• Change the filter to 2012 and than back to 2016

• Make sure that only Overview widget refreshed

» Column filters

If you want to filter the table by specific values or elements, you can do it using column filters.

1. Follow the steps

• Click Toggle column filters button

• Open the advanced filters for Region column and select America and Europe

• Click Clear All Filters

• Open the advanced filters for Actual column

• Click Filter Top X

• Choose Top or Bottom

• Number: number of elements

• Items or Percent: refers to the number above

• The source elements: current elements, leaf elements in a subset or in a dimension

• Remove filters by clicking Clear All Filters or one individual filter

» Cell Commentary

In this exercise, we will explore a useful feature in the application that allows us to add comments to individual cells in a table. This feature can be helpful when working with large datasets and collaborating with others on data analysis tasks.

1. Follow the steps

• Right click on any cell in Actual column in Overview widget

• Choose Comments from the table context menu

• In the Cell Commentary pop-up enter the text: this is my test commentary

• Click Post button

Commented cells with will be marked with a red triangle

You can access the full commentary history of a cell in a table by right-clicking on the cell and selecting Comments. Additionally, users can delete their own comments using the Delete button in the cell commentary popup window.

1. Try it out

• Right click on a cell in Actual column marked with red triangle in Overview widget

• Choose Comments from the table context menu

• Message posted in the previous exercise will be visible

• Click X button visible in the Delete column

• In the confirmation popup click Delete button

Comment will no longer be visible in the Cell Commentary popup.

1. Test it further

• Add another comment, this time with formatting applied (e.g bold font), to any cell in the Overview widget

» Adjust column width in grid widget

Not only can you edit the layout and settings of a dashboard, but you can also make changes directly inside a widget.

1. For example, you can adjust the width of columns in a grid widget using the following steps:

• Change the column width in the Overview widget by dragging the borders of the columns

• Click Save to Options button, which is available under the three dots icon visible in the widget header

» Show Source data

This exercise will show you how to access the source data for a widget, which is presented in a table format providing greater insights and understanding of the data being displayed.

1. Follow these steps to view the data source for a Column widget

• Click on the three dots icon in the widget header to open the Action Menu

• Select Show Source Data from the dropdown menu

• The grid with the data source will be displayed, allowing you to view the data in a tabular format

• Switch back to the chart by clicking on the three dots icon and selecting Revert back to original widget

» Export chart to PNG

In some cases, you may need to share a chart from the application with a user who doesn't have access to it.

1. You can export the chart to a PNG file with just a few simple steps

• Click on the three dots icon in the Column widget header to open the Action Menu

• Select Export from the dropdown menu

• Choose PNG

The PNG file will be downloaded to your computer, allowing you to share it with anyone who needs it.

9. Save the dashboard

While editing a dashboard, all the configurations made are only visible in edit mode and are not available once it's turned off. This means that end-users won't be able to see any of the changes made.

However, there's an easy way to make the configurations available to end-users.

1. Follow the steps

• Click Save & Discard button

• A confirmation popup will appear showing you the changes made

• Click Save changes button to confirm

The changes will now be available outside of the edit mode, allowing end-users to see the updates made to the dashboard.

10. Connect widgets

In UX 2021.11 release, a new feature has been introduced that allows users to connect widgets together. This means that you can now combine widgets from the same or different cubes, as long as the row dimension elements are the same.

In this exercise, we'll explore how to use this new feature by connecting two widgets and displaying them together as one widget. By the end of the exercise, you'll have a better understanding of how to use this powerful new feature in your own dashboards.

» Navigate to the prebuild dashboard

For this exercise, you will use an existing pre-built dashboard in the Apliqo Demo app.

1. Follow these steps to access the dashboard

• Open the UX Samples Folder.

• Select Connected Widgets.

• Click on Using the same or different cube.

App will navigate to the selected dashboard.

» Change master widget

In this dashboard only two widgets are currently displayed. However, if you examine the elements chosen for these widgets' columns, you'll see that different dimensions were merged.

In this exercise, we'll take a closer look at the cube settings to understand how this was accomplished and use the master widget option to give you greater control over the data displayed in the tables.

1. Follow the steps

• Open the cube settings for Different cubes 1 widget

• You will see four widget tabs: Different cubes 1, Different cubes 2, Same cube 1 and Same cube 2

• Click on the Refresh button

• A table preview will appear, showing the first part of the connected widgets

• Select Different cubes 2 tab

• Click on the Refresh button again

Another table preview will appear, showing the second part of the connected widgets

1. In the next part of the exercise, you'll have the opportunity to change the master widget and observe how its settings affect the final results displayed in the dashboard

• Change the Version dimension subset by selecting Default Member from the dropdown list

• Open the advanced option by clicking the wrench icon

• Select Widget Settings

• Clear the selection for the current Master Widget

• Navigate to the first tab (Different cubes 1)

• Open the widget settings for Different Cubes 1

• Select Different cubes 2 in the Master Widget dropdown list

• Close cube settings popup

Once the widgets are connected, the settings from the master widget are applied to other tables. This means that the column dimension from the master widget is displayed as the first column in the new connected grid, and the subset selected for the row dimension is also applied.

• Save the changes

If you only need to display a single table of data on a page, you can use the 'View' page type instead of a dashboard. This can be a more streamlined way to present data without the added complexity of multiple widgets and visualizations. In this exercise, you'll learn how to create a view page and customize it to display the data you need.

1. Create a view

• Open App Templates folder and click + Add

• In the popup do the following configuration:

  • Public option will be chosen by default, don't change it

  • Type option should say Folder

  • Enter the Folder title: Views

  • Click Create button

New Views folder was created under App Templates.

With folder ready you can create first view.

1. Follow the steps

• Open App Templates folder

• Choose Views folder

• Click + Add public

• In the popup do the following configuration:

  • Change the Type by choosing View from the drop-down list

  • Enter the view title: Sales Planning

  • Change Cube Source by choosing Retail from the drop-down list

  • Click Create button

After clicking Create button, application will automatically navigate to the new view.

2. Publish the view

Keep in mind that any configurations or changes you've made so far are only visible to you and not to other users. If you want to make your view accessible to others, you'll need to publish it. Unpublished pages are indicated by a pen icon.

1. To publish your view follow the steps

• click the Publish button

• confirm by clicking Yes in the confirmation popup

Once your view is published, other users with the appropriate permissions will be able to view and interact with it.

3. Configure the view

1. Follow the steps

• Click on the cube settings icon visible in the page toolbar

• Select Input from the Views list under the Retail cube

Preview table will be dispalyed.

1. Configure row and column dimensions by following the steps

• Select Period dimension

• Open advanced options GUI by clicking on the wrench icon

• Select Dimension Settings

• Change the List Type to Subset

• Choose Default from the Subset drop-down list

• Set the attribute to Short Description

• Select Product dimension

• Change the List Type to Subset

• Choose Accessories from the Subset drop-down list

• Set the attribute to Code and Description

Click Refresh button to check if all the changes were applied correctly.

After closing the Cube Settings popup the view will display selected data.

4. Save the view

1. To make this configuration available for end-users, follow the steps:

• Click Save & Discard button

• In the confirmation popup, click the Save changes button

Popup will close and the changes are now available outside of edit mode.

5. Add new Sub-view

In this section, we'll explore how to add a new sub-view to our existing table. New sub-view can be part of the same cube or a slice of a different one. By creating reports with multiple sub-views, you can join tables with different row dimensions, as long as the selected elements share the same principal name or alias. This process is similar to creating connected widgets. Additionally, you can configure the view to include the same dimensions in the report's global filters as well as rows.

1. To add a sub-view to the table, follow the steps:

• Click on the plus icon visible in the page toolbar

• Select Table from the list of options

• In the popup do the following configuration:

  • Enter the title: Version

  • Change Cube Source by choosing Retail from the dropdown list

  • Click Create button

1. To configure the newly added sub-view, follow these steps

• Click cube icon visible in the page toolbar to open up the settings popup

• Select Version sub-view tab

• Move Version dimension to the Column section

• Select Act Bud Comparison from the Subset dropdown list

• Move Product dimension to the Row section

• Close the cube settings popup

Now new sub-view is visible the table.

• Save the changes

6. Formatting & Conditional formatting

In addition to displaying data, the application provides you with tools to enhance the visual presentation of the reports. Applying formatting can help highlight important information and make it easier to interpret. This functionality is also available for grid widgets.

1. There are different methods of applying formatting, but in this exercise, you will use the advanced options GUI

• Click on the Settings icon

• Expand Table Config section

• Select Column Format

• Click on the + icon and add Year column to the advanced options panel

• Select one of predefined classes by clicking on the pencil icon

The selected class will be applied to the whole Year column.

1. Apply conditions to the formatting and highlight cells between 0 and 1500

• Open the advanced options panel again

• Select greater or equal to from the condition dropdown list and input 0 as the value

• Add another condition by clicking on the + icon (between condition and value options)

• Select less than from the condition dropdown list and input 1500 as the value

What is more we can apply multiple conditions with different classes applied to enhance the view even further.

1. Add different class to values above 1500

• Open the advanced options panel again

• Add new condition by clicking on the + icon

• Select greater or equal to from the condition dropdown list and input 1500 as the value

• Select one of predefined classes by clicking on the pencil icon

• Save the changes

1. Add Toolbar PopUp

The toolbar pop-up functionality provides a convenient way to add a button to the toolbar section of your application that opens a pop-up with various configurations, such as displaying additional data tables or running a process. In this exercise, we will focus on adding a button to allow users to load data from an Excel file into the application.

1. Follow the steps

• Click on the plus icon visible in the toolbar

• Select Toolbar Pop-up option

• Enter the toolbar title: Load From Excel

• Change the cube source to Retail

• Click Create button

• Click the Load From Excel toolbar button

• Set Widget Type to XLS Upload

• Open New Widget cube settings:

  • Drag and drop Product dimension to the rows

  • Drag and drop Period dimension to the columns

• Close Cube settings popup

• Close Load From Excel popup

• Save the changes

2. Load from Excel

In this section we will use the popup created in the previous exercise to load data from excel into the app.

First we need to export the file (more on export functionality in Export section).

1. Follow the steps

• Click Export button visible in the page toolbar

• Select Excel (Load Format)

• File will be downloaded to your computer

1. Make changes in the excel file to check data upload into the app

• Change the data for 486 - All-Purpose Bike Stand element to 100 for all Months

• Save the changes in the excel file

• Close the file and open the app again

• Click Load From Excel toolbar button

• Click Drag file here or select...

• Select Sales Planning file

• Click Upload

The preview of the file will be displayed in the popup.

• Click Load button

If you attempt to upload data on consolidations - like in this example (Version Subview), an error list will be displayed, but all valid cells will still be uploaded. After the upload process is complete, you can close the pop-up and verify if the data you entered is visible in the table.

3. Add Table PopUp

In addition to the previously discussed Toolbar Pop-up, you can also create a Table Pop-up. This type of pop-up will appear as an extra column in the table and can be configured to display various types of widgets or TI processes. In this exercise, you will configure it to display a grid widget to enhance your table with additional insights.

1. Follow the steps

• Click plus icon visible in the toolbar

• Select Table PopUp option

• Input title: Overview

• Change the Cube Source to Retail

• Click Create button

New column named Overview will appear in the table.

1. Configure the Overview Popup to display data based on the row from which it was launched.

• Click Overview icon to open the popup

• Click cube icon visible in the widget header

• Drag Product dimension to the global filter section

• Open advanced options GUI by clicking on the wrench icon

• Select Dimension Settings

• Make sure that the Default Value is empty

• Change the subset to All Elements

• Close the popup

• Open the Overview popup from the Bike Racks row

• Make sure that the filter value is set to Bike Racks

• Close the popup

• Open the Overview popup from the Accessories row

• Make sure that the filter value is set to Accessories

• Close the popup

• Save the changes

4. Popups – basic advanced options

In this exercise, we will focus on the basic advanced options available for pop-ups, including position in the table and icon displayed in the table. After finishing this section you will gain a better understanding of how to customize and manipulate the behavior of pop-ups.

» Position & Icon

Position: by default, a new table popup will appear as the last column of a report. Hoverer users have the ability to manipulate the position of the pop-up and move it to the front as the first column.

1. Follow the steps

• Open the Overview popup

• Open advanced options panel by clicking wrench icon

• Click on the popup header (selection will be indicated by the blue triangle)

• Select Popup Settings from the GUI

• Change the position to 0 (A value of 0 means that the pop-up will appear as the first column in the report. Any value above 0 will move the pop-up to the last column)

Overview column has been successfully moved to the first position in the report.

1. Change the popup Icon displayed in the table

• Open the Overview popup

• Open advanced options panel by clicking wrench icon

• Click on the popup header (selection will be indicated by the blue triangle)

• Select Toolbar Button from the GUI

• Pick any icon from the Button Icon list

• Collapse the advanced options panel

• Close the popup

New icon will be visible in the table.

• Save the changes

Like View or Dashboard, Wizard allows you to present the data in a clear and organized manner. But what sets Wizard apart is its unique ability to create a flow of Views and Dashboards, arranged in a series of logical steps and sub-steps. With Wizard, you can lead your users through your data in an immersive and engaging manner, making it easier for them to understand and act upon the insights you present.

1. Create new wizard

1. Follow the steps

• Open App Templates folder

• Click + Add

• In the popup do the following configuration:

  • Public option will be chosen by default, don't change it

  • Type option should be set to Folder

  • Enter the Folder title: Wizards

  • Click Create button

New Wizards folder was created under App Templates.

With folder ready you can create first wizard.

1. Follow the steps

• Open App Templates folder

• Choose Wizards folder

• Click + Add public

• In the popup do the following configuration:

  • Change the Type by choosing Wizard from the drop-down list

  • Set Create With Default Settings to No

  • Click Create button

After clicking Create button, application will automatically navigate to the newly created wizard.

2. Publish the wizard

1. Publish the wizard

• Click Publish button

• Click Yes in the confirmation popup

3. Configure the wizard Step

In this exercise, we will be exploring the process of configuring dashboards and views in wizards. The principles are similar to the ones covered in previous exercises. However, you will be using and duplicating existing templates into the wizard to speed up the process and practice new functionalities.

1. Follow the steps

• Click on the plus icon visible in the page toolbar

• Select Wizard Step option

• In the creation popup do the following changes:

  • Input title: My First step

  • Set Create with Sub-step to No

  • Click Create button

In the wizard step bar you will notice your first step of the workflow.

4. Add a Sub-step

1. Follow the steps

• Click on the plus icon visible in the page toolbar

• Choose Wizard Sub-Step

• Select Duplicate existing template tab (you can always create a new dashboard or view from scratch using Create new template tab, but in this exercise you will use Duplicate existing template and duplicate a dashboard or view that already exist in the app)

• Change the type to Dashboard

• From the Source dropdown select Exec Dashboard (the one created in Dashboard creation and configuration exercise)

• Click Create button

New Subs step will appear in the left panel. You can now customize the dashboard as needed, including adding data sources, configuring the layout and setting up filters.

5. Configure the Second step

In this exercise, you will learn how to add new steps together with sub-steps to your wizard using the duplication method.

1. Follow the steps

• Click on the plus icon visible in the page toolbar

• Choose Wizard Step

• Select Duplicate existing step tab (this option will allow you duplicate already existing wizard step together with all existing sub-steps)

• Input title: My Second step

• Select Process: wizard navigation from the Existing wizard steps dropdown list

• Click Create button

New step will appear. Repeat these steps to add more views or dashboards (you can also create new ones) to your wizard and create a comprehensive workflow.

6. Save the changes

1. Make the configuration available to end-users

• Click the Save & Discard button

• In confirmation popup you can review the changes made so far

• Click the Save all changes button

Popup will be closed and the changes will be now available outside of edit mode.

7. Edit Wizard Steps

While in Edit Mode notice that Edit Wizard Steps button will appear.

Clicking it will open a new popup that allows you to edit the steps and sub-steps e.g. titles and order. In this section we will cover the available options.

» Rename Steps and Sub-steps

1. Follow the steps

• Click Edit Wizard Steps button

• In the popup do the following configuration:

  • Click on the My First step title

  • In the editable text box input new title: New Step

  • Expand both folders to see available SubSteps

  • Click each title and change it (Executive Dashboard, Products)

» Change the order of Steps and Sub-steps

Using Edit Wizard Steps popup and simple drag & drop functionality you can re-order your Wizard Steps and Sub-steps. It's not possible to drag substeps between steps but if you would have multiple substeps you could easily adjust their order.

1. To test this functionality drag and drop My second step to first position

» Add info tool-tips

1. Follow the steps

• Click on the info icon visible for My second step

• In the text box write: This is test tool-tip

• Expand New step folder

• Click on the info icon visible for Executive dashboard

• In the text box write: This is test tool-tip

• Hover over Info icon to check if the information was applied

» Add Sub-step icons

To make Sub-steps more visually distinctive you can add icons to them.

1. Follow the steps

• click on the icon visible next to the Executive Dashboard

• list of available icons will appear, pick one

You will notice that selected icon is now visible next to the Executive Dashboard sub-step.

» Apply the changes

The last thing for you to do is Applying the changes and making them available for other users.

1. Follow the steps

• Click Apply button

• If you want to review changes made so far click See more

• Click Save button

All the changes were applied.

1. Filterbar: Next and Back buttons configuration

To make the navigation in the app easier and the transition between different reports swifter, we can configure Next and Back button. Both of them will appear in the app filterbar.

» Configuration

1. Follow the steps

• Navigate to Sales Planning view by selecting it from App Templates - Views folder

• Open the advanced options panel by clicking the wrench icon

• Click on the + icon next to the Filter Bar option

• Click on the + icon next to the Back & Next Buttons option

• Select Next button

• Input name for the Next button in the Label textbox: Test button

• Select Button Class from the dropdown list e.g. Info (it's not mandatory)

• Chose button Icon (also not mandatory, by default the right arrow will appear in the button)

• Click on the + icon next to Next option

• Select Target View

• Click on the plus icon (+)

• Select Target View from the dropdown list: Exec Dashboard

• Save the changes

• Click Next (Test button) visible in the filterbar

App will correctly navigate to the Exec Dashboard.

» Additional exercise – adding custom html

When creating the buttons, users are not limited to the default options available in the GUI. Each button can be changed and customized further using html code.

1. Follow the steps

• Navigate back to Sales Planning

• Open again the advanced options for Next button

• Clear the Class and button Label

• Paste the code provided below into the Html textbox

• Click Update button and notice how the button changed

• Discard the changes

1. Using Navigation Edit popup

Application gives us the option to edit the navigation bar.

While in edit mode, the Edit Navigation button appears in the Navigation Bar. In the edit popup you can rename, reorder elements and adding icons is also possible, just like in Edit Wizard Steps popup.

1. Follow the steps

• Click Edit Navigation button

• Click App Templates title and change its name to: Exercises

• Expand Exercises folder

• Click Dashboards title and change its name to: Dashboards: examples

• Select new icon for Dashboards: examples

• Drag & drop Exercises folder at the top of the list

• Drag & drop Wizards folder at the top of the list inside Exercises folder

• Click Apply

• Click See more to review the changes

• Click Save button

All changes were correctly applied.

2. Duplicate, Move & Delete existing dashboards

Navigation Edit popup is a powerful tool, but not all changes like Duplicate, Move & Delete can be made with it just yet. In this section, we discuss how to tackle this.

» Duplicate

1. Follow the steps

• Open Exercises folder

• Click + Add

• Do the following configuration in the popup:

  • Public option will be chosen by default, don't change it

  • Choose Duplicate current view option

  • Enter the title: Duplicate test

  • Click Create button

Duplicate test view is now available in Exercises folder.

1. Publish the view

• Click Publish

• Click Yes in the confirmation popup

» Move

1. Move existing dashboard to a different folder

• Click on the 3 dots icon visible in the page toolbar

• Choose Move from the list

• Do the following configuration in the popup:

  • Open Select Parent drop-down list

  • Choose Views

  • Click Move button

Duplicate test view is now visible in Views folder in the Exercises app.

» Delete

Last thing for us to practice is deleting dashboard and app from the navigation bar.

1. Follow the steps

• Click on the 3 dots icon visible in the Duplicate test view toolbar

• Choose Delete from the list

Two options will be available: Delete Current View (delete single page) and Delete Containing Folder (delete an entire containing folder, including all its associated pages)

• Select Delete Current View

• Check Yes, delete permanently

• Click Yes

Duplicate test view is no longer visible under Views folder.

1. Configuration

In this section you will create and configure a new widget: Cube Viewer

1. To showcase this exercise you will create a new page, follow the steps

• Enable the Edit Mode

• Open Exercises / Dashboards : examples folder

• Click +Add public...

• In the popup:

  • Change the Type to Dashboard

  • Input Dashboard Title: Cube Viewer

  • Set the Cube Source to General Ledger

  • Click Create button

App will navigate to newly created dashboard.

• Publish the Cube Viewer dashboard

1. Change the widget type

• Click on the widget type list

• Select TM1 widgets

• Click Cube Viewer option

Configure the default view

• Open Advanced Options panel by clicking wrench icon

• Select New widget header (selection will be indicated by blue triangle)

• Select Cube View

• Click Toggle Input/Select from list button for the Cube

• In the textbox input: General Ledger

• Click Toggle Input/Select from list button for the View Name

• In the textbox input: Budget Template

Make sure that the widget is displaying correct data and save the changes.

2. Create new view using cube viewer widget

Using Cube Viewer widget users can create new views.

1. Follow the steps

• Move Version dimension to Rows

• Move Period and Account dimensions to Filters

• Click Save View as button

• In the popup:

  • Check Native option

  • Uncheck private view

  • Input title: new view test

  • Click Save button

Make sure that the newly created view is available in the dropdown list.

Views can also be deleted:

• Select P&L Comment from the views list

• Click on the trash can icon

• In the confirmation popup click Yes

• Make sure that the view is no longer visible in the dropdown list

• Save the changes

1. Messages

» How to access Notification Drawer and open Message popup

We will start with the basics so how to actually access the Notification Drawer and launch the new message creation dialog. For the purpose of this exercise we will use Commentaries and Notification dashboard available in the Latest releases : UX Version 2022.06 folder in the Apliqo Demo app.

1. Follow the steps

• Click on the new Bell icon visible in the application header

• New window with 4 foldable sections (drawers - available for each user) will open:

  • Public (option is only available to members of the UX Power User and UX Administrator groups)

  • Message

  • Process

  • To-Do List

Click on the + icon visible in the left side corner of the widow to open a new popup

There is also another way of accessing message creation dialog

1. Follow the steps

• Close the previous popup

• Right click on any cell in Products widget

• Select Notifications option from the context menu

• New message creation popup will appear on the screen

» Send a message

Now we will try both ways of sending messages and see how they differ.

Sending Message from a cell level

When you want to draw attention to a particular value in a certain view the best way is to send a message directly referencing that cell. In that case recipient of the message will be able to open the view with the original global filters settings.

1. Follow the steps

• Right click on any cell in the Product widget

• Select Notifications option from the context menu

• In the popup configure:

  • Notification Type -> Message

  • User to whom the message should be delivered -> Enduser

  • Type (information, warning, etc.) -> Information

  • Content (Header and Message) -> Important / New Feature!

  • Cell Reference -> auto populated with the cell value

• Click Post button

Sending Message through Notifications window

When a cell reference is not the main priority, users can send messages directly from notification window.

1. Follow the steps

• Click on the Apliqo UX logo to navigate to the Homepage

• Open the Notifications window

• Click on the + icon

• Select Enduser User

• Set the Importance and fill out Header and Message textboxes

• Link option should be set to Yes

• Click Post button

Receiving messages

Now we will look at the messages from the point of view of the recipient , i.e. Enduser.

1. Follow the steps

• Log out of the application

• Log in as Enduser

• 2 notifications will be visible next to the bell icon

• Click on the bell icon

• 2 new messages will be visible in the drawer

Visit Link

In both cases, the message recipient can visit the report from where the message originated using the Visit Link option.

As mentioned before, if the message was sent from the cell level the view will be loaded with the original global filters settings.

1. Follow the steps

• Click 3 dots icon visible next to the Important - New Feature notification

• Select Visit Link option

The app will navigate to the page from which the message originated and the original global filters will be applied, so that it would be easier for the recipient to review the exact value mentioned in the message.

Reply

To further improve communication, each user can reply to a message sent to them by selecting Reply from the list of options available after clicking 3 dots icon

1. Follow the steps

• Click 3 dots icon visible next to the New: Test Message notification

• Select Reply option

• Fill out the Header and Message text box

• Click Post button

• Log out of the application and log in as Demo1

Reply from Enduser will be visible in the Notification drawer.

2. To - Do List

To-Do lists can be created for personal reference but also for other users of the application. Comparable to Messages, new task can be added directly from a cell level to include more necessary details or from the notification window using + icon.

1. Follow the steps

• Open the Notifications window

• Click on the + icon

• Change the Type to To-Do list

• Select Demo1 User

• Set the Importance and fill out Header and Message textboxes

• Link option should be set to Yes

• Click Post button

New task will appear in To-Do List section.

• Click on the Apliqo UX logo to navigate to the Homepage

• Expand To-Do List section of the notifications drawer

• Click on 3 dots icon visible next to the new task

• Select Visit Link from the menu

The app will navigate to the dashboard from which the new task originated.

1. Custom format & PDF

We can export every page created in our app to PDF without further configuration, although it is possible to customize our choice.

1. Follow the steps

• Click Export button

• Choose Custom from the list

• Inside the popup up there are three settings that need to be configured:

  • Select A4 Page size

  • Select Portrait Page orientation

  • Select pdf Export format

• Click Export button

File has been downloaded to your computer.

2. Excel

Navigate to Report / Views - Cross Drill on View

Data from the view can be easily exported to Excel file. In the toolbar there is Export button with two options available for Excel file.

Excel (Load Format) - simplified file version without filters allowing you to load files into the application.

Excel With Filter Values - file version including global filters.

1. To export the view to Excel file follow the steps

• Click Export button

• Choose Excel (Load Format)

• Make sure the file has been downloaded to your computer

3. All tables in dashboard

This option gives us possibility to export all widgets visible in a dashboard in a form of a grid to single excel file. Each widget will be located in a separate tab.

1. Follow the steps

• Navigate to Exec Dashboard by selecting it from Dashboards folder

• Click Export button

• Choose All tables in the Dashboard

• Make sure the file has been downloaded to your computer

Notice that all widgets were exported as grid tables into the single excel file.

4. Export with Grouping

Other option is Export with Grouping. When this option is enabled through the advanced options, the excel file will reflect the consolidations (as set in the app) together with the ability to expand and collapse them.

Follow the steps below:

• Enable the edit mode

• Click on the Overview widget header

• Expand Table Config option by clicking on the plus icon

• Select Export to Excel option

• Set Export with Grouping to Yes

• Collapse the settings panel

• Save the changes

• Open Action menu for the Overview widget

• Select Export -> EXCEL from the list

• Open the exported file

Notice that the option to expand and collapse the consolidations is available.