Beefree is a quick, collaborative, friendly design suite to create emails and landing pages to be used anywhere.
We started documenting the inventory of used components in our product as a base for our Pattern library structure. Then we started designing our foundation elements such as colours, typography, iconography and so on. From that point, we moved to design all the components, to create a consistent user interface.
Today we are building our design system, starting from a shared platform such as Storybook to move next to UI development, testing, and documentation.
To create our pattern library, we started from the foundations (colors, typography, spacing, etc..) than we realized the single components (buttons, cards, checkboxes, etc..) and finally we created the complex patterns.
Before designing and defining all components of the Pattern Library, we put down the Style Guideline in order to have a cohesive visual identity. This was the part where we layed down the foundations and decided what was needed while we were defining the overall aspect of the product.
Next step we will create a design system documentation as a point of contact for our stakeholders. The main goal is helping teams to learn how and when to share the UI components.
