Short description

A widget consists mostly of information derived from the module it is connected to; for example, how a specific fund is progressing. It can also be used as a placeholder for standalone tools, such as a loan calculator.

When and how to use it

Complexity is not the true nature of a widget, it should instead aim to be simple and offer glanceability that encourages exploration.

Use it to show a specific hero number or few rows from a lengthy table from the parenting module. It could be latest three account transactions or the current account balance.

Behaviour

Depending on size (S/M/L), a widget accommodates a few or no content areas (applies to small sized). A medium sized widget contains one content area which can be held by a table/graph/list or hero number, whilst a large sized widget holds two content areas.

The widget itself can be added, removed, customised and/or reordered in a page.

Errors should be contextual and affect the whole widget or a specific value. The error area should override the default behaviour of a row and show the actual message if clicked upon.

Do's and don'ts

• Show a narrow selection of information
• Show contextual actions
• Be specific and contextual if the widget requires attention from a user

• Try to not overcrowd the widget with information, less is more

Examples

Specification