Learn about updates to design tokens, standardized components, internal testing and a lot more.
Over the last few months, we’ve established a comprehensive set of tokens. These tokens represent various aspects of our visual language—color, typography, and spacing—and will allow you to make consistent design decisions across an app. Our efforts will ensure tokens accurately align across the design kit, code, and documentation.
We are nearing the completion of the first design phase to standardize the initial batch of components. The first phase included reviewing UI audits of key applications to create consistent components and their variants. It also focused on looking at all potential use cases and seeing how the system could address them. From the initial designs, specification sheets were generated for design and engineering to collaboratively work through various design, technical, and implementation questions. Engineering has started coding the components and working through accessibility considerations.
The documentation has been updated as specs have been completed to ensure guidelines and best practices are up-to-date. The first round of documentation updates focused on what the component is and does, while subsequent updates will focus on the why and how a component is used.
Our first internal testing began last autumn and included partners from both engineering and design. These partnerships allow us to get valuable feedback on how the system is meeting user needs as well as the overall experience of using the various aspects of the design system.
A major goal of our team was to ensure that the design system could serve as a useful foundation to most users right out of the box. We have started a second pass over the components to further refine their design and specs to achieve this goal. Additionally, we are creating a base theme for the system that will well represent it’s features and capabilities. This theme will allow users to create production-ready applications that complement each other within the Jack Henry ecosystem without having to have additional design knowledge or theme tooling.