Related Pages:

...

Type	Usage	Illustration	Full page	Widget	Icon?
No results found	Use when a user’s search criteria returns no results.
No <entities> defined	Use when no entities, such as forms, have been added/defined.		Render the LUX frame, including the VerinTop. Replace the full content area with the empty state.
You’re all caught up	Use when a user has no new notifications to review.		Render the LUX frame, including the VerinTop. Replace the content pane area with the empty state.
Waiting	When Use when an action is in progress.		Render the LUX frame, including the VerinTop. Replace the full content area with the empty state.

Usage & Behaviour

General guidelines

...

Placement and Positioning

• Empty states should be centered vertically and horizontally on full pages and in instances where the empty state must be shown in a container or pane.In instances where empty states must be displayed inside a container or pane, the empty state replace the content that would ordinarily be shown.

• Empty states should be centered vertically and horizontally .Empty states should be positioned contextually to the relevant contentin the content area.

Content

• Use in-context, light-hearted illustrations to add delight and aesthetic appeal to the interface.

• Use an accurate explanation that provides more detail on the current state the application is in.

• Use contextual cues, relevant to the user’s task to educate users on how to use an application in real time.

• Where possible, include direct links to the steps that need to be taken in the user’s workflow to accomplish a task/populate the screen.

...

• Empty states have no intrinsic interactions. For component-specific interactions see the documentation of that component.

Best Practices

Use:

• To communicate system status to users

• When content does not yet exist for a screen ,

• Visual content that is representative of the state

• Clear, concise written explanations

• In-context prompts or pane to provide guidance on how to populate the area with that content.

• Contextual prompts (i.e., links) that help a user to accomplish their task

Don’t use

• Inaccurate .

• Clear, concise written explanations.

• Visual content that is representative of the state.

Don’t use:

• Totally empty states (, this approach creates confusion for users).

• Inaccurate written explanations.

• Irrelevant actions.

• Unrelated visual content.

General

• <…>

Accessibility Compliance

Unless otherwise specified, see our general compliance information in Fundamentals - Accessibility

...