Component Criteria

It is recommended that components have already been built and tested before being proposed for inclusion in Nebula, and the information in this document is intended to help decide if the component is the right fit.

What is a Component?

A component is any part of an application that can be logically grouped and thought of as a singular element, which can be reused as a building block for the rest of the application. In terms of the user interface (UI) these might be elements such as a label, input or a button. These elements can be combined together to create components such as a form. Components vary in terms of complexity and context, and the Nebula design system is opinionated about these things.

Nebula contains a collection of these reusable UI components guided by clear standards that can be assembled together to build any number of applications.

What is a Design System Component?

In order to be included in Nebula a component should be;

• Reusable across multiple platforms and products
• Brand agnostic
  • The component is not specific to a particular brand
• Themable
  • Properties such as colour and shape are controlled by tokens which can be easily updated but the main function of the component remains unchanged
• Used frequently across our products
• Considering UX best practices in its design and implementation
• Conform to AA accessibility standards

What is not a Design System Component?

A component is not suitable for inclusion in Nebula if;

• It is only applicable to a particular context or purpose
  • An energy consumption graph is only applicable to showing energy usage
• It is brand specific
  • Any component that includes brand specific concepts or tone of voice

How do we Prioritise which Components we Build?

In order to prioritise our roadmap we look at a few key criteria, if the component you are looking for is missing it is likely that it doesn’t meet one or more of these. Suggestions are always welcome, and if a component is missing or should be higher priority please raise a component proposal issue (opens in new window) .

• How frequently is it used?
  • Components used on more than one page will be higher priority than those used on only a few
• Has it already been requested?
  • A team has specifically asked for it to be included
• How complex is it to build?
  • Complex components will require more effort from the design system team, and may be delayed if there is not sufficient capacity
• Could the current implementation benefit from some design input?
  • For example it may not be consistent with the rest of the site, or may benefit from some UX or accessibility improvements