User Interface Overview
Updated by Tauqeer Hussain
Design Improvements
Shell & Header
In the above screenshot portion with green outline is the page header where user could see the name of the current screen, action buttons such as exit, return, search, insert and then more kebab menu.
This section also holds the ‘session’ dropdown which helps the user to shift between the open sessions conveniently, following feedback from internal/external stakeholders on the desire for the feature.
Global Primary Actions:
Primary action buttons have been renamed to make more sense and avoid confusion:
· ‘OK’ has been changed to ‘Search’.
· ‘Update’ has been changed to ‘Save’.
· ‘Cancel’ has been changed to ‘Return’.
· ‘Update’ has been changed to ‘Save’.
· ‘Cancel’ has been changed to ‘Return’.
For example, previously the primary buttons ‘Exit, cancel’ and ‘Okay’ were not grouped.
In the new system, the actions are placed conveniently together and return and exit better differentiate negative actions.
Whilst Save & Search are clearer positive actions to differentiate the need of the user depending on what action they are performing.
Global Chips:
1. Company Chip – Company name would be displayed on the page header as above and be more accessible on the page.
2. Map ID – ID of the current map which is open would be displayed as above to help users familiarise Screen Codes for quicker access through the menu search functionality.
3. More kebab menu - In the new UI, we have the more Kebab menu to accommodate the various pull-down items that were present in our existing UI (explained in detail in the split button vs more kebab menu section below)
Session Drop Down:
Session drop-down helps the user to shift between the open sessions conveniently without having to open up their menu if the user preference is to have the menu hidden by default.
This helps users see the sessions that are open and switch between the sessions by clicking on them.
Search/Results tab:
For all list screens where there is search criteria and an AG Grid which shows the results determined by these criteria. The page is bifurcated into ‘Search’ for the criteria & ‘Results’ for the data, which is presented in the AG Grid, to allow for a better screen capacity for engaging with the AG Grid.
Search is always a primary action here, for users to navigate between selection of their criteria to the results in the AG Grid.
Draw & Rail
Rail (Red out line) – Rail provides quick access to menu, sessions, alerts, history, product hub and settings.
Draw (Orange outline) – The Draw would interchange options varying on the selection of the Rail.
Menu
Below screen shot refers to the draw section for Menu.
Initially, menu expands as a collapsed tree view (as below).
Upon clicking on the plus button, user could see an expanded tree view as below to click-into specific modules.
E.g. System Controls -> Definitions..
Screen Search
On the ‘Menu’ draw section, the system now offers an improved Function Search Capability.
Users can now either search directly for their specific module name or the screen ID which can be found in settings or using the MAP-ID chip. (e.g. “Supplier” or “#PBA”)
This can also be accessed from the homepage as a 'search-engine' styled feature allowing you to quickly navigate to your favourite items.
‘Sessions’ option on the rail
Here user can navigate between sessions that are open along with the session ID’s.
On the side of each session in the Draw, users can see a kebab menu which by clicking on will display session related actions that a user can take on the open sessions (shown below).
‘Saved’ option on the rail.
Users can quickly access their favourite menu items by utilising the new bookmarking functionality embedded in the Menu by selecting the bookmark icons highlighted in green below.
By Selecting the Bookmark icons, menu items will automatically be saved as per user preferences for future uses of the application in the ‘Saved’ section.
Users can re-arrange their saved items by using the pencil icon below (arrow & save icon will then be present), saving the order preference that they wish to display their most used screens within.
‘Alerts’ Menu
We have enhanced the alerting functionality greatly in the new user interface. To read more into the various aspects of the application where the improvements are. Please select the link below;
https://financials.helpdocs.io/article/6ojn5kyqjw-afx-alerts-field-error-focus
Product Hub
Upon selecting the Pendo ‘Product Hub’ from the Menu Rail, users will be able to view the updates which are available through the Financials Product Hub.
These are maintained and updated, so users can be kept informed with the latest updates and information.
Typically, there are two types of assets available for users to access through the Pendo Product Hub.
1. Announcements – These could be pertaining to new features available within the application.
2. Helpful Documentation – For informative content relating to useful information that could be accessed by the user.
Settings & User Preference Enhancements
For settings, please see the below article providing more details into the user preference based improvements the new interface brings, along with the configurations available through settings:
https://financials.helpdocs.io/article/0ijzrv6gjx-afx-user-preference-enhancements-settings