Carlie Bradshaw , Asaf Ben-Oved, Shani Laendler (Unlicensed)
Status | ||||
---|---|---|---|---|
|
...
Product area (Verint logo and suite name).
Application selector.
Search
Resource center
Additional options. (Use only in combination with Left Navigation).
Instances?
Notifications and alerts (WM) (Optional)
Additional information (WM example)
Progress indicator??? (with Liav)
User profile, including:
System settings
User settings
User status
Logout option
Notifications and alerts (in both navigation)
Product area
Description
The Product area identifies the application as a Verint product.
...
The list should should be the same from all applications in a suite.
Applications should be sorted in order of importance.
External products should be shown underneath internal applications.
...
The selected application will be indicated with a blue check mark.
A scroll bar will be used when the application selector is taller than the height of the screen.
TBDDDD External Products
External products should be opened in a new tab.
… ?
Interaction
Clicking the 3 dots ⋮ beside the application name will open the list of available applications.
When an application is selected:
the list will close.
the view will change to the new application.
...
Type | Choose: | Image |
---|---|---|
| ||
|
** Additional information, permitted only when using the left navigation. < Carlie Bradshaw >
Search
Description
Allows the user to search the suite hierarchy.
...
While typing a search parameter in the search field
A results menu will be displayed beneath the search field
Search parameter will be highlighted in the displayed result’s menu
Clicking on a Page will navigate to the page. In addition, it will close the results menu and search field.
Clicking on a Branch will navigate to the 1st page under the selected pathbranch. In addition, it will close the results menu and search field.
Clicking the “X” in the field will close the menu but will keep the field displayed with text cursor ready to type
Clicking Esc on the keyboard
1st click will clear the search field
2nd click closes the menu
<<TBD image>>
Resource center
Description
...
Positioned left to the user profile
...
Internal logic
...
Interaction
Clicking on the “?” icon button opens a new browser window on top menu with all of the current viewresource’s center options.
Additional options
Instances
TBD
Notification and alerts
Description
...
Additional information can optionally be shown in the header bar. Permitted only when using the left navigation.
...
Content
Can be either text or icons. Additional information is not interactive.
Structure
A one-line row.
It may be divided by vertical lines according to the displayed information
...
Positioned on the top row, right-aligned next to the User Profile and Resource CentreCenter.
Interaction
The additional Additional information must be a read-only . section
Tooltips may be used. Recommended for icons.
...
By default, the circle around the profile image will be blue. However, it can also be used to show the user’s current status.
Default (no status) |
|
---|---|
Available |
|
Not available |
|
Profile Menu
Note: The options in the profile menu should be the same for all products in a suite.
Current statuses (optional)
A horizontal line separating the statuses from other options
Preferences, which may include:
Upload profile picture
Language
Date/Time format
Email preferences
Switch profile
Logout
Internal logic
Alerts/notifications:
above 99: TBD “99+”
within the menu… TBD
When are they removed?
Interaction
Alerts/notifications: TBD
Search: TBD
Help: click on Help will open the help center in a new tab, focused on the specific workspace currently being used.
When relevant, Help will operate as an action menu that will show all help options in the menu list.User profile: TBD
Best practices
<Whenever a recommendation (not a must) is provided>>
Use:
VerinTop in every Verint application.
Short labels for menu items, allowing room for translation.
Top navigation, unless you have more than 7 menu items at each level, or more than 3 levels in the menu hierarchy.
<…>
<…>
Don’t use
<…>
<…>
General
<…>
Accessibility Compliance
Unless otherwise specified, see our general compliance information in Fundamentals - Accessibility
...
Zeplin link | Screen thumbnail |
---|---|
<<Short Zeplin link. You | <<Screen with 200 width>> |
Code
<<a box containing the code - when there is no code to present use the Coming Soon GIF>>