Component Library

This project has evolved and changed. It was initially started as a Design System but its so many projects on it never got he hard and fast rules of one and then a rebranded was required after about 2 years since its conception.

Figma
Design systems
Components
UI

Introduction

So now it has evolved into the AutoEntry Pattern Library because some of our components need to be custom for our app and differ from other components in other areas.

We have the benefit of a very large team. Where we have dedicated Design System designers in Sage, so we have the fortunate positions of being able to use the Atoms and Molecules for that team to build our Organisms and Templates.

Iterations

There was a few consistent components, must of the buttons where alike. That was the starting point in Figma. Before then there was no master component for this. Designs had originally been in Sketch and the team was migrating to Figma. I had a lot of prior knowledge of Figma as I had been using it in a previous role for about 3 years. 

So first up our Primary Button. Next I created the Navigation and then a Secondary Navigation. At the time there was a slight disconnect between the Mobile App and the Web Product. Primary Buttons where not consistent and many other items.

After about month I had established a solid designer friendly component library. Where we could reuse master components for designing new features. Not many rules or guidelines where established and probably more aligned itself to a Figma component library. But it did help with the output of the UX Team and speed design work. So a marked improvement.