Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

The navigation boardlet is a special type of boardlet. It houses a number of several links to other dashboards and is part of the grander patterns of [Local Navigation]().

...

Possible navigation items include but are not limited to:

AssetPurpose & Behavior
Link ListScrollable collection of links. Use for quick movement in content and to surface favorites.
Node ListScrollable collection of nodes. Enables fast navigation across node hierarchies.
Card ListScrollable mini-cards providing additional detail; . It supports navigation into related content.
Conflict ListScrollable conflict cards showing current issues; supports filtering and prioritization.

...

  • 01 Extender - The Action Icon for extend and collapse the navigation boardlet.
  • 02 Divider - A divider helps the user to differentiate between several action icons that have a different content and function.
  • 03 Link-List Assets
  • 04 Node-List Assets
  • 05 Card-List
  • 06 Client Logo - In case the customer wants his own logo, it will be placed only here. Only signets or rectangular logos are allowed
  • A Navigation Asset
  • B Content of a navigation asset - The content can vary, see overview navigation asset.
  • C Overline of a navigation asset - Overlines can be used with or without an action bar.

The following images image shows the alignment of navigation items.

...

  • 01 Extender - This button allows the user to expand the navigation.
  • 02 Divider - A divider helps the user to differentiate between several action icons that have a different content and function.
  • 03 Content Actions/Navigation Overline Icons - These actions are variable and can be selected by the user/creator.
  • 04 Brand Logo - In case the customer wants his own logo, it will be placed only here. Only signets or rectangular logos are allowed
  • 05 Overflow Action Link - The number of links and the content of the link are variable.
  • 06 Overflow Menu - The overflow menu contains all thematic actions. It opens only to the right.

The following images image shows the alignment of elements.

...

Local navigation is optional in Edge.One. Simple applications do not require it. Use the Navigation Boardlet Nnavigation boardlet only when a dashboard needs local navigation (e.g., nodes, dependencies, favorites, sub-dashboards). Keep it off simple dashboards to preserve focus.

Default to Collapsed collapsed on content-dense dashboards; expand on demand when navigation is the user’s next likely step.

In Extendedextended, use at most three assets (Link, Node, Card, Conflict) at once to avoid vertical crowding and nested scroll traps.

...

Prefer no internal scrolling. If content overflows, switch to the Extended extended state or split into multiple assets/tabs.

...

  • The content must be visible simultaneously (e.g., long Node List in Extendedextended).
  • The boardlet provides essential footer/actions tied to the list (e.g., batch selection).
  • The overflow occurs only on rarely used small screens.

Use independent scroll scrolling for each asset and never create horizontal scrolling.