Design system –Libraries and documentation

Establish, maintain and document an enterprise-wide design system. This is a collaborative effort of all designers, with me leading the web library

The design system is built in Figma and the documentation is located in the brandcenter (system: Frontify).

Collaboration

Every designer is allowed and encouraged to actively participate in the design system. If they feel changes need to be made, they can implement them in a branch and challenge them through the review process. If necessary, changes are also discussed in a larger group so that every impact on all areas can be taken into account.

Component Impression

This teaser module shows a rather complex component. I have built it so that you can make the following settings in the instance.

Switch screen sizes (M-L, S, XS)
Switch number of colunms from 2-4
Switch image stye (illustration, image round, image full width, video and icon
Switch between button and text link
Switch between different text content (default, event and news)

For all settings, input that has already been entered is retained.

Click to resize

Web Library in Figma

The web library, like all libraries, is based on the foundation library, which contains basic elements like colours, illustrations, icons and so on.

It should be used for all web projects, mainly websites.

Click to resize

Documentation in Brandcenter / Frontify

The specifications of the individual elements are written down in the brand centre. Every employee can access the information there.