Component lifecycles portray different stages a component can go through and in which order. Statuses clearly define the stages a component can be in, depending on design and development implementation. They can send a clear signal a component shouldn’t be used (deprecated), will be changing soon (in progress), or perhaps a new component will be added (planned).
Component statuses
We use the following statuses to signify the maturity of design and code aspects of all components in the Octopus Design System:
|
Status |
Emoji (used in Figma) |
Description |
|---|---|---|
|
Stable |
✅ |
The component is ready to use. It has been reviewed and tested. |
|
In progress |
🚧 |
Changes to a component (or a new component) are currently being implemented by the Frontend Foundations Team or a contributing team and will be released soon. |
|
Needs review |
👀 |
The existing component requires design, code or documentation review to adhere to our design and engineering standards. |
|
Planned |
🗓️ |
Changes to an existing or new component have been prioritised on the Frontend Foundations Team Roadmap for the next quarter. |
|
Missing |
❗️ |
The component partially exists in the design system (e.g. in Component Library, but not design system component package). Parts of the component have to be migrated into the design system. |
|
Deprecated |
⛔️ |
The component will be removed according to deprecation guidelines. Its use is no longer supported or recommended. |
We use the statuses above primarily in the design system documentation and Figma Component Library resources. Selected statuses are also utilised in Component Showcase.
Component lifecycles
Here are the potential lifecycles a component can go through:
- Existing component that needs to be removed: Stable/Needs review → Deprecated
- Existing component that needs to be updated: Needs Review → Planned → In progress → Stable
- New components: Planned → In progress → Stable