Creating components
If you're considering creating a new component, make sure you've read all about the collaboration flow and know exactly what you are doing.
Don't forget to work in a new branch in Figma.
Components should be built carefully - make sure you're following all of the guidelines here. To help ensure a component is ready to be published in a library, confirm all of the topics below are checked:
|
The component is responsive. If you add more content to it or change its width or height, it adapts perfectly. |
|
The rules for responsiveness have been thought of and defined, e.g. paddings, text-wrap, content overflow, etc. |
|
The component fits the edge cases or has enough rules to overcome them. |
|
The component's name is compliant with the naming rules. |
|
The component uses only the measures defined as our spacers. |
|
The content is product-agnostic. This means that every piece of text needs to be generic and any image used must not refer to a single specific product. |
|
The component makes efficient use of pre-existing atoms - i.e., the atoms can be applied as-is and do not require special changes just to fit that component. |
|
In case the component has variants, they're scalable. For instance, make sure you didn't create a boolean option just because for now you only have two options. |
|
If the component is themeable, the colours you've chosen are the theme colours. For example, you used Global's primary colour instead of the Digital black colour. |