Standardisation
shared set of principles and rules to build consistent experiences across different platforms
One single source of truth; forming unity across the whole site and lay a stable foundation for onboarding future businesses.
The live design system can be found here
shared set of principles and rules to build consistent experiences across different platforms
enable designers & developers to reuse components
efficiency and consistency leads to building faster products
shared set of principles and rules to build consistent experiences across different platforms
enable designers & developers to reuse components
efficiency and consistency leads to building faster products
Extended:
Firstly, we auditioned over 150 component down to a manageable 35~. By means of merging similar ones and deprecating un-used one. This gave me a starting point to build from. I went about breaking our library into Core, Elements and Components to create a multi-layered system.
Once signed off by all squads, I worked closely with the Front-end champion to cut and merge, refine and build the new components into the live system.
Now we have a single source of truth, used by designers and engineers across all of our companies under Tes Global.
CORE
This is the first and most important part of the design system; everything is built of this. Its mainly comprised of typography, colour and icons - the base of all that we're building off
CORE
Typeface set & hierarchy
CORE
Total of 13 colour with tone and shades
CORE
100+ icons with 4 size varients and all colour palette
We're building on what we've built. combining multiple core parts to make more complex pieces
The final building blocks of the design system. an agreed-upon, unified component list used sitewide. Providing consistent and uniform designing, efficient engineering and changes that cascade through from one source of truth
Reduction in complexity —
Over 150 components down to 35~
Unified 7 internal teams and 3 external sister company under one language
Ability to mockup design at a much faster rate