Common Usability and Navigation

2 Common Usability and Navigation

This chapter describes the method by which you log in, and log out, and navigate. It also describes the common User Interface (UI) controls that are used throughout the mobile UI.

This Chapter is divided into the following sections:

MAF Mobile UI features:

Welcome / Login

Figure 2-1 Welcome Screen

Upon launching the mobile UI application, the login screen is displayed. The first time a user logs into the system, if logon is successful, the system will log in to the user's first assigned store. The system will remember the store the user was last logged into and log in to that store until the store is changed. Upon successful login, the system will navigate you to the Open Transactions dialog.

Menu/Drawer

Figure 2-2 Menu/Drawer

The mobile drawer is displayed as the menu panel on the left side of the screen upon tapping the drawer (hamburger stack which looks like three horizontal lines in the upper left-hand corner of the application). From the menu/drawer, you have access to various functionality of the application.

Store List

Figure 2-3 Store List

The change stores function is available from the drawer/menu by tapping the store option. You are directed to the store list screen with an option to change stores.

The store list displays all the stores that the user is authorized for. If needed, the user can search for a store by either the store ID or store name. The store list is narrowed down based upon the search. Selecting a store will display the new store in the store field of the drawer/menu as well as in the footer on Open Transactions. The user is then officially logged in to the new store. All data and transactions will be for the newly selected store. Every time the user logs in to the system, it will be for the store selected until a new store is selected. The system remembers/saves the store for the user.

Language

Figure 2-4 Language

The Language screen is displayed by selecting the Language menu option within Configurations from the drawer/menu. Initially when a user is logging into the mobile for the first time ever, it will use the language of the device. The Language screen will display with a list of the available languages supported in the system. User selects a language, and the language will change in the application to the language selected and user will navigate to the Open Transactions. That language will remain for the user (saved on the user) until the user change languages. The locale of the device (date format, currency format, and so on) will remain that of the device.

Scan Type

Figure 2-5 Select Scan Type

The Scan Type is a found in the mode bar. It is used whenever an item can be entered or scanned within a Scan Bar. The scan type allows you to tell the system what type of item or barcode is being entered.

The values for this include Auto which is represented by a lightning bolt, Bulk represented by a cube (user must have proper permissions), and UIN which is a barcode.

Auto is the default value when logging into the system. Auto assumes that you can enter or scan any of the supported barcode types such as SKU, type 2, UPC E, GS1, and so on, and the system will parse through the various algorithms to derive the item.

Bulk allows the user to bulk scan or enter one to many items within a bulk dialog and then apply them to the transaction and validate them all at once. An example would be doing a wave of multiple RFID items.

The final option of UIN, assumes that the user will enter in a serial number or AGSN and therefore the system will only run the algorithm to search for UINs. Scanning a UIN as part of the UIN option will be much faster and potentially be more accurate in case of overlapping UIN numbers.

Scan Mode

Figure 2-6 Select Scan Mode

Figure 2-7 Scan Mode

The Scan mode is a found in the mode bar. It is used whenever an item can be entered or scanned, and the quantity is captured. The scan mode defines if the quantity from the barcode should be:

Added to the existing item quantity, indicated by Increase with a plus icon.
Removed from the exiting quantity indicated by reduce with a minus sign.
No change to the quantity, which is review mode represented by a barcode.

The default scan mode is set to Increase.

Unit of Measure

Figure 2-8 Select Unit of Measure

Figure 2-9 Unit of Measure

The Unit of Measure selection is a found in the mode bar. It is used whenever a quantity is captured. The unit of measure defines if the quantity displayed is going to be represented in the item's standard unit of measure, cases, or transaction unit of measure.

When switching the Unit of Measure, the quantity on the screen will convert to that unit of measure. When first logging in, the default unit of measure will be set based upon the system configuration Default Unit of Measure. The Unit of Measure selected by the user will be displayed in the mode bar, and the selected UOM will remain as the UOM until the user logs out of the application.

Transaction Unit of Measure will only be used where applicable which is in Customer Orders as well as Shipping and Receiving for a Customer Order. If Transaction UOM is selected in dialogs where it is not applicable, the system will use the Standard Unit of Measure even though the Transaction UOM may be selected.

Numeric Entry

Figure 2-10 Numeric Entry

The Numeric Entry popup is used whenever there is an editable numeric field such as an item quantity field. The quantity that gets entered into the Numeric Entry popup will increase, reduce, or override the existing quantity on the screen. The mode on the Numeric Entry will be defaulted the system setting, Manual Quantity Entry Default Mode. When set to Scan Mode, the Numeric Entry popup defaults based upon what the Scan Mode is set to. When set to Override the default will be Override. In all cases, these are only defaults, and the user can always change mode of the Numeric Entry.

Examples:

Qty = 15, enter in 3 increase, Qty = 18

There is a quantity of 15 on the UI. In the popup, the user enters a quantity of three, selects the increase option, and apply. The new quantity is 18.
Qty = 15, enter in 3 reduce, Qty = 12

There is a quantity of 15. In the popup, the user enters a quantity of three, selects the reduce option, and apply. The new quantity is 12.
Qty = 15, enter in 3 override, Qty = 3

There is a quantity of 15. In the popup, the user enters a quantity of three, selects override, and apply. The new quantity is three.

Filter Bar

Figure 2-11 Filter Bar

The Filter bar is used to narrow down a list of things such as items, containers, child stock counts, and so on.

You can tap and type into the filter bar or tap and scan into a filter bar. By default, the Filter bar will be displayed on the top of the list. When scrolling down in the list, the filter bar disappears, and it reappears when scrolling back up in the list. The criteria that a user can filter on will be unique per functional area. For example, inventory adjustments the user can filter on Item ID, Item Description, reason code, and UOM. The search is not case sensitive. The filter can be cleared out to return the full list. The filter will retain the entered criteria until leaving the screen in which it will be cleared out.

Scan Bar

Figure 2-12 Scan Bar

Figure 2-13 Scan Bar Camera

The scan bar is at the top of the transaction lists, Item Lists, other lists such as Child Count and Container Lists, and Item Detail screens. It will be anywhere an item, or some other attribute can be entered or scanned to be viewed or edited on a transaction.

This bar allows for one defined attribute to be scanned and that attribute will be stated in the text of the bar. For example: Item, Container or Customer Order ID.

In the Transaction List screens, the scan bar will further filter or funnel down the list of transactions when doing a scan. The scanned attribute will be added in addition to the existing search criteria. It will appear in the search criteria, eye glasses field.

In other areas such as lists, item lists, container lists, as well as Item Detail, and soon, the scan bar will go to the details for what was scanned. Quantity may be updated, and the item may be added to the transaction depending on functionality.

If the system configuration Enable Device Camera Barcode Scan is set to Yes, then if a camera is detected on the device, the camera icon will be available. The camera icon will allow for scanning in the barcode via the camera on the device. The barcode will be parsed and processed the same as if the scanner was utilized.

Search Criteria

Figure 2-14 Search Criteria

The Search Criteria field is represented by an eye glasses icon in the header of the screen. Search criteria will be found on all transaction list screens, such as Inv Adjust List shown in this figure. Criteria will be listed. If there is more than one criteria, they will be separated by a pipe symbol. Initially when entering the dialog, the default search criteria for the functional area will be displayed. For example: in inventory adjustments it would show: Status = In Progress. If there are no default search criteria, the eye glasses will be displayed and the words Search Criteria will be listed.

Tapping the Search Criteria field, eye glasses, will navigate to the Search Criteria screen to select and or change criteria to search with. The search criteria field gets updated with the newly selected search criteria fields from the Search Criteria screen. When leaving the dialog, the search criteria will be reset back to the default search criteria.

Item Image and Item Description

Figure 2-15 Item Detail Item Image

The item image is displayed throughout the application wherever an item is displayed. The item image will be displayed next to the Item ID and Item Description in all applicable screens. Each functional area has a parameter called Display Item Image. If it is set to Yes, the image will be displayed in that functional dialog. If it is set to No, the image will not be displayed.

The Item Description will display with the first line displaying the short or long description based upon as system configuration. The second line will display the diffs, diff1, diff2, diff3, diff4. If there are no diffs for the item, the second line will be blank. The second line is also displayed per a system configuration.

Print

Figure 2-16 Print

The Print dialog is accessed when selecting print within the application. It is available when selecting Print from the footer menu within a transaction.

The transaction format type or types that are applicable to the functional area will be available for selection. For example, in Customer Order Deliveries, there may be format types of Customer Order Delivery and BOL. If there is only one applicable format type for the functional area it will be defaulted.

Once a format type is selected, the system will list all the reports that are available to print for that format type. The report will default based upon the default format type. The user can choose to select a different report format to print if other report formats exist for this format type transaction. Once print has been selected for the report, the PDF is retrieved based upon the report format.

Print Tickets

Figure 2-17 Print Tickets

The Print Tickets dialog is accessed by the user to print the tickets for the container items. This dialog can be accessed by selecting the Print Tickets option from the footer menu.

The Print Tickets dialog is available on the following transactions container items screen both via transaction and lookup.

Direct Store Delivery
Transfer Receiving
Transfer Shipment

The system displays the following attributes for the user to select.

Format Type: This allows the user to select the format type. Item Ticket or Shelf Label. Default -Item Ticket.

Format: This will show the list of formats available for the selected format type for the user to select to which format the tickets should be assigned. Default format assigned for the selected format type will be shown as selected by default.

Quantity: This field indicates the quantity populated depending on the transaction and status. This is a read only field.

Values: Shipped, Received or Expected.

In case of Shelf Label, the quantity is 'Label Quantity or 1'.

Print Date: This field indicates the print date. This is a read only field.

When the user selects to print, the system displays the Select Printer screen for the user to select the printer to which the tickets need to be submitted to print.

Select Printer

Figure 2-18 Select Printer

On this screen the user can select the printer to set for the ticket printing.

On the top of the lists the system displays the paired Bluetooth printers.

The Bluetooth printers are indicated with the Bluetooth symbol and prefix 'BT' and these printers cannot be scanned.

This screen is for the user to select or scan the barcode of the printer and submit the tickets for printing.

This screen is accessed from the Select Printer option on the Auto Print Item, Manual Print Item screens and Print Tickets popup that appears when printing tickets from the container items screen.

This screen lists all the printers that are available in the system for the item tickets and label type.

The selected printer is displayed on the Auto Print Item and Manual Print Item screens for the user to know to which printer the tickets/labels are submitted for printing.

Notes

Figure 2-19 Notes

The Notes function is used to capture one or more notes about the transaction. It also allows you to view history or a trail of notes for a transaction. It is an optional process. The notes feature will be accessed from the footer menu within a transaction using the Notes menu option. Notes is available from within all transactions.

To add a note, select the Add Note button. The Add Note popup displays. Enter the note and then select Post. The note will be posted to the top of the list of notes in the Notes dialog. All notes will be listed in read-only mode with the user who created them and the creation date. Notes will always be available, and the user will always be able to add notes regardless of the transaction status. The user must have Create Notes permission to add notes.

Reset, Remove, and Restore Item

Within the footer menu (ellipsis) on most Item Detail screens will be options for Reset, Remove, and Restore. Remove and Restore are also displayed on most list of items screens, that is, Inv Adjust Items.

Reset will take all changes that have been made during the session and "undo" them back to the way the item was prior to entering the session. This option is only available for items that were added before the current session and only applicable to items where updates can be made to the item.

Remove will allow for the removal of the item from the transaction. After selecting Remove the item will remain on the transaction, however it will be grayed out/disabled and changes cannot be made to the item. The item will remain on the transaction until it is saved/completed, which at that time the item will be deleted from the transaction.

Once an item has been marked for removal a Restore option will be available. Restore item allows for an item that is marked for removal to be unmarked. It will no longer be grayed out and the user will be able to edit the item where applicable.

Item Detail - UIN

Figure 2-20 Item Detail - UIN

The UIN tab will be accessible from Item Detail screen from within a transaction. The system must be configured for UINs and the item must be a UIN item.

UINs can be added to the adjustment for UIN items via the scan enter item bar in the header. A UIN can be removed by tapping the trash can which will flag the UIN for removal and it will be deleted from the transaction upon saving or confirming the transaction. Lastly those UINs that have been flagged for removal can be added back to the transaction by selecting the Restore option.

Note:

Some functional areas may have slight modifications to this screen to accommodate the functionality.

Item Detail - Attributes

Figure 2-21 Item Detail - Attributes

The Attributes screen is accessible from the Item Detail screen by selecting the Attributes icon. The system and store must be configured properly to allow for collection of attributes. In addition, the item must be configured to be an item that has extended attributes. This screen will display attributes that may have been captured automatically from a GS1 barcode, or they may have been manually captured in this screen.

Sets of attributes can be captured manually by selecting the Add Extended Attribute Set button. The attributes to be captured depend on the attribute configuration for the item. A popup will be displayed to enter the attributes. Sets can be removed and then they will be flagged for deletion. Upon saving or confirming the transaction the flagged sets will be removed. The Restore feature will be available to bring back the attributes if necessary.

Item Detail - Scan Details

Figure 2-22 Item Detail - Scan Details

The last scan details are displayed on the bottom of all of the Item Detail screens in transactions of the mobile application. It includes the details from the barcode for the last item entered/scanned. This field is refreshed for each scan, so if an item has a quantity of 10, the Last Scan could have displayed different content for all ten barcodes/instances scanned.

GS1 barcode - the system will display the barcode, GTIN, and the contents of the barcode (that is, price, UIN, and so on).
Type 2, barcode, and Price.
All other types of barcodes will display the actual barcode (UPC, UIN, and so on).

Configure Endpoints

Figure 2-23 Configure Endpoints

This dialog on mobile device is for the user to configure the endpoints.

The Configure Endpoints screen is displayed by selecting the Configure Endpoints menu option within Configurations from the drawer/menu. The following fields are available on this screen and the technical details of the configuration can be found in the technical documentation.

Configuration URL

Configuration Login URL

Open ID Connect Discovery URL

OAuth Client ID

Scanner Configuration

Figure 2-24 Scanner Config

This screen on the mobile application is to configure the external scanners.
The Scanner Config screen is displayed by selecting the Scanner Config menu option within Configurations from the drawer/menu.
This screen will list all the paired/connected scanners to the device.
Selecting the paired device will connect to the mobile device for the user in the application.
If the device does not find any scanners paired/connected, it displays a message to indicate no scanners found.
Identify - Upon selecting this button, the system makes the scanner you are connected to beep, so the user knows which one is used. Note: This button is displayed only in IOS.

Note:

For the scanner to find the external device, the location permission should be assigned to the client.

Figure 2-25 Scanner Detail

This screen is accessed on the mobile application by selecting the Configure option from the external Scanner List screen after an external scanner has been connected.

Scanner Name: <Scanner Name> - the name of the connected scanners whose settings are displayed on the screen.
Battery Info Bar: Visual progress bar showing the amount of battery remaining in the scanner:
- The progress bar will be green if the battery remaining is greater than 30%.
- The progress bar will be yellow if the battery remaining is between 15% and 30%.
- The progress bar will be red if the battery remaining is less than 15%.
Battery %: Shows the amount of battery life remaining as a numeric value (0-100%).
Battery State: Will display either Charging or Discharging depending on if the battery is charging or discharging.
Scan Power Slider Bar: Displays the amount of power each scan takes on a slider bar. The slider bar can be dragged to a new value. The values are between 0 and 300 dBM.
Scan Power Input Field: Displays the amount of power each scan takes as a numeric value. A user can enter a new numeric value in this field. Any value less than 0 will be set to 0, and any value greater than 300 is set to 300. This value updates if the slider bar value is changed.
Scan Volume: Displays the current beep volume during a scan and presents values in a drop down to change. Values are: Quiet, Low, Medium, and High.

Buttons

Apply: Will apply the settings to the connected external scanner.
Identify: Upon selecting this button, the system makes the scanner you are connected to beep, so the user knows which one is used. Note: This button is displayed only in IOS.

JET Mobile UI features:

Figure 2-26 Welcome Screen

Figure 2-27 Menu/Drawer

Quick Actions

Figure 2-28 Quick Actions

The Quick Actions menu is accessed by selecting the Quick Actions icon from the Application Panel Footer menu. Quick actions will include various different functionalities sucks as Item Lookup, Quick Receiving, etc. It will also be where User Preferences are accessed and an option for user to update UOM from here

Select Store

Figure 2-29 Select Store

The select store function is available from the drawer/menu by tapping the Store. It is also in the Additional Options menu (…) in the upper right hand corner on the Open Transactions by tapping the User and then selecting Change Store the user is directed to the Select Store screen with an option to change stores.

The Select Store displays all the stores that the user is authorized for. If needed, the user can search for a store by either the store ID or store name. The store list is narrowed down based upon the search. Selecting a store will display the new store in the store field of the drawer/menu. The user is then officially logged in to the new store. All data and transactions will be for the newly selected store. Every time the user logs in to the system, it will be for the store selected until a new store is selected. The system remembers/saves the store for the user.

Select Language

Figure 2-30 Select Language

The Select Language screen is displayed by selecting the Change Language menu option within the Additional Options menu (…) in the upper right hand corner on the Open Transactions. Initially when a user is logging into the mobile for the first time ever, it will use the language of the device. The Language screen will display with a list of the available languages supported in the system. User selects a language, and the language will change in the application to the language selected and user will navigate to the Open Transactions. That language will remain for the user (saved on the user) until the user change languages. The locale of the device (date format, currency format, and so on) will remain that of the device

Preferences

Figure 2-31 Preferences

The Preferences dialog is accessed by selecting Preferences from the Quick Actions menu or by selecting Preferences from the Additional Options (…) menu in the upper right hand corner. Preferences are for the user on the JET Mobile application. Preferences include: displaying images, scan navigation preference, Scan Type, Scan Mode, and UOM. The Display Images preference will be available if the system setting, Display Images is set to ‘Yes’.

Scan Type

Figure 2-32 Select Scan Type

The Scan Type is a found in preferences. It is used whenever an item can be entered or scanned within a Scan Bar. The scan type allows you to tell the system what type of item or barcode is being entered.

The only value for this is Auto.

Auto assumes that you can enter or scan any of the supported barcode types such as SKU, type 2, UPC E, GS1, UIN, and so on, and the system will parse through the various algorithms to derive the item.

Scan Mode

Figure 2-33 Select Scan Mode

Figure 2-34 Select Scan Mode on Scan Bar

The Scan mode is a found in preferences. It is used whenever an item can be entered or scanned, and the quantity is captured. The scan mode in preferences will be used to default in the scan mode on the scan bar. The default scan mode in preferences when logging into the system initially will be ‘Increase’.

The scan mode will update the quantity as follows:

Increase: Adds to the existing item quantity. The Scan Bar will show a ‘+’ sign
Decrease: Removes from the exiting quantity. The Scan Bar will show a ‘-‘ sign
Review: No change to the quantity. The Scan Bar will show an ‘Eye’ icon

The user can change the scan mode in the scan bar, and that will be the scan mode used upon entering / scanning an item, it trumps that of the preferences. The system will retain the scan bar defined scan mode until the user logs out of the session. Upon relogging in, the system will default the mode in the scan bar to the scan mode defined in the preferences.

Unit of Measure

Figure 2-35 Select Unit of Measure

Figure 2-36 Unit of Measure

The Unit of Measure selection is a found on the Quick Actions menu as well as in Preferences. It is used whenever a quantity is captured. The unit of measure defines if the quantity displayed is going to be represented in the item's standard unit of measure, cases, or transaction unit of measure.

When switching the Unit of Measure, the quantity on the screen will convert to that unit of measure. When first logging in, the default unit of measure will be set based upon the system configuration Default Unit of Measure. The Unit of Measure selected by the user will remain as the UOM until the user changes it or Resets Application.

Edit Quantity

Figure 2-37 Edit Item Quantity

The Edit Item Quantity popup is used whenever there is an editable numeric field such as an item quantity field. The quantity that gets entered into the Edit Item Quantity popup will increase, Decrease, or override the existing quantity on the screen. The mode on the Edit Item Quantity will be defaulted per the system setting, Manual Quantity Entry Default Mode. When set to Scan Mode, the Edit Item Quantity popup defaults based upon what the Scan Mode is set to in Preferences. When set to Override the default will be Override. In all cases, these are only defaults, and the user can always change mode of the Edit Item Quantity.

Examples:

Qty = 15, enter in 3 increase, Qty = 18

There is a quantity of 15 on the UI. In the popup, the user enters a quantity of three, selects the increase option, and apply. The new quantity is 18.
Qty = 15, enter in 3 reduce, Qty = 12

There is a quantity of 15. In the popup, the user enters a quantity of three, selects the decrease option, and apply. The new quantity is 12.
Qty = 15, enter in 3 override, Qty = 3

There is a quantity of 15. In the popup, the user enters a quantity of three, selects override, and apply. The new quantity is three.

Filter Bar

Figure 2-38 Filter Bar

The Filter bar is used to narrow down a list of things such as items, containers, stores, and so on.

You can tap and type into the filter bar or tap and scan into a filter bar. By default, the Filter bar will be displayed on the top of the list. When scrolling down in the list, the filter bar disappears, and it reappears when scrolling back up in the list. The criteria that a user can filter on will be unique per functional area. The search is not case sensitive. The filter can be cleared out to return the full list. The filter will retain the entered criteria until leaving the screen in which it will be cleared out.

Scan Bar

Figure 2-39 Scan Bar

The scan bar is at the bottom of the transaction lists, Item Lists, other lists such as Child Count and Container Lists, and Item Detail screens. It will be anywhere an item, or some other attribute can be entered or scanned to be viewed or edited on a transaction.

This bar allows for one defined attribute to be scanned and that attribute will be stated in the text of the bar. For example: Item, Container or Customer Order ID.

When scanning /entering items from Item Lists, if the Scan Navigation user preference is set to 'Yes' (meaning navigate), the user will navigate to the item detail screen for that item. The quantity will be updated per the scanned/entered item barcode.

If the Scan Navigation user preference is set to 'No' (meaning do not navigate), the user will stay on the Item List and focus will be brought to the that item in the list. The quantities for the item will be updated on the list per the scan/entry of the barcode. This is only applicable in the case where a quantity is editable on the list screen. If the list does not have an editable quantity, then the system will always navigate to the Item Detail on scan.

Search Criteria

Figure 2-40 Search Criteria 1

Figure 2-41 Search Criteria 2

The Search Criteria field is represented by a magnifying glass icon in the header of the screen. Search criteria will be found on transaction list screens, such as Notifications shown in this figure. Criteria will be listed. Initially when entering the dialog, the default search criteria for the functional area will be displayed.

Tapping the Search Criteria field, will navigate to the Search Criteria screen to select and or change criteria to search with. The search criteria field gets updated with the newly selected search criteria fields from the Search Criteria screen. When leaving the dialog, the search criteria will be reset back to the default search criteria. Note: in Open Transactions the search criteria is retained until changed or reset.

Item Image and Item Description

Figure 2-42 Item Detail Item Image

The item image is displayed throughout the application wherever an item is displayed. The item image will be displayed with the Item ID and Item Description in all applicable screens. Item image is displayed based upon a user Preference, Display Images. If it is set to Yes, the image will be displayed in the application for the user. If it is set to No, the image will not be displayed.

The Item Description will display one or two lines depending on the system configuration, Display Item Description Diffs. If it is set to Yes, line one will display either the short or long description per the system configuration Display Item Description. The second line will display the diffs for the item if they exist otherwise it will be blank. If the Display Item Description Diffs. If it is set to No, only one line for the item description will be used and it will be the short or long description per the system configuration.

Print

Figure 2-43 Print

The Print dialog is accessed when selecting print within the application. It is available when selecting Print from the footer menu within a transaction.

The list of applicable format types and report combinations will be given. The user can choose to select a different report format to print if other report formats exist for this format type transaction. Once print has been selected for the report, the PDF is retrieved based upon the report format.

Notes

Figure 2-44 Notes

To add a note, enter the desired text and select the Add Note button. The note will be posted to the top of the list of notes in the Notes dialog. All notes will be listed in read-only mode with the user who created them and the creation date. Notes will always be available, and the user will always be able to add notes regardless of the transaction status. The user must have Create Notes permission to add notes.

Item Detail Scan Details

Figure 2-45 Item Detail — Scan Details

The last scan details are displayed on the top of all of the Item Detail screens in transactions of the mobile application. It includes the details from the barcode for the last item entered/scanned. This field is refreshed for each scan, so if an item has a quantity of 10, the scan details could have displayed different content for all ten barcodes/instances scanned.

GS1 barcode - the system will display the barcode, GTIN, and the contents of the barcode (that is, price, UIN, and so on).
Type 2, barcode, and Price.
All other types of barcodes will display the actual barcode (UPC, UIN, and so on).