As Visma grew, the need to keep a unified identity by using a common design system was replaced by a wish to build strong individual brands for each company within the organisation. Over the years Proceedo was built, the code had diverged from using components from the common design system to a combination of those and multiple custom made solutions. Hence, a lot of work had to be done to prepare the system for a new look and feel that could be applied to the entire system.
My role in this was…
UX designer, developer coordinator
Purpose: Prepare for a introduction of a unified design system
Method: An inventory of colours and icons used and the system as well as certain key components
Participants: UX designers, front end developers
Outcome:
Reductions of colours and shades used in the system from 191 to about 65 where no colour had more than 10 different shades.
Introduction of reusable variables instead of hardcoded colours throught the system.
A common place to store icons as well as better overview of which ones would need to be converted in order for one format to be used instead of several
Introduction of a common button component to replace a multitude of different components in the system
A start of a dialogue between FE and UX about how to develop, document and maintain components in a common design system.
A figma library file to be used by all UX designers when designing new interfaces