Atomic Systems and Data Visualization
PRODUCT
Figma design system and zero height documentation
________
User to: Unify + Constrain
________
User by: Designers + Product Managers
A burst of post-merger innovation led to the creation of Axiom, an atomic design system designed to create unity through a common language.
In the process, cross-functional designers represented their product needs across the research continuum . With inputs for brand, a high level mission statement and core values designers discussed, researched, iterated, compared, and created. What emerged was a foundational system. A system of flexible Figma and React components to use as building blocks for the work to come.
System Parts
-
![]()
Principles
Design principles are derived from the companies core values. Principles should be reflected in every area of the design and visual mood of the user interface.
-
![]()
Voice + Tone
Voice and tone guide writers and designers with specific examples of how and how not to apply principles in practice.
-
![]()
Color
Color guidelines included various palettes, tones. Typography features styles and example strings.
-
![]()
Formatting
Design principles are derived from the companies core values. Principles should be reflected in every area of the design and visual mood of the user interface.
-
![]()
Atoms
the smallest, fundamental components of a user interface, such as buttons, input fields, and icons
-
![]()
Molecules
the smallest, fundamental components of a user interface, such as buttons, input fields, and icons
-
![]()
Organisms
relatively complex, distinct UI components composed of groups of molecules and/or atoms
-
![]()
Data Visualization Library
As the designer representing analytics I took lead on creating a flexible set of chart and dashboard assets. These charts are flexible and able to support categorical and numerical data.
