Cincom Quadrant UI - Design System
A scalable enterprise level design system for a B2B software company. Before and after inside!
Prototyping
User Research
Interaction Design
A scalable enterprise level design system for a B2B software company. Before and after inside!
Prototyping
User Research
Interaction Design
With multiple products spanning very distinct verticals, inconsistencies were evident products being delivered globally. Development teams had various user interface patterns they had been leveraging over time without a referenceable pattern library to provide much needed guidance.
In order to tackle this problem, an analysis was taken of the current products. This included taking inventory of what colors, typography, UI patterns, and interactions currently existed. Once the inconsistencies in the current patterns were identified, this information was shared with stakeholders to obtain buy-in to develop a design system. In collaboration with global marketing, the first documented attributes ensured typography, and brand based assets were accounted for.
From there, button patterns were established including interaction states. One those were established, form input patterns were created including date pickers, radio buttons, checkboxes, and the accompanying form validation patterns. As project progresses and iterations continue, these assets were centrally published in an easily accessible location (e.g. Zeplin.io and Figma) for developer hand off.
Development and product teams now have a single source of truth for the design components and patterns used in Cincom’s products. Product consistency has greatly increased and work has begun to introduce design system patterns into more product lines. Marketing teams have begun to work with these patterns as well which will help ensure a more consistent customer experience from marketing to product.
Maintaining a design system is both rewarding and challenging. As any design system should, it continually evolves as we iterate through both current patterns and document new patterns. The design system continually needs to be fed and nurtured. As as organization, the design system has helped increase the necessary communications between user experience, development, and marketing teams. With these teams playing in the same “sandbox” we can deliver clear, and consistent user experiences across all products.
