Building an Enterprise-wide UX Design System
Summary
At project start, design teams and brand partners lacked cohesive design systems, causing fragmented user experiences and inefficient collaboration.
Our team created a unified UX design system supporting company segments and external partners, grounded in Material Design 3, atomic design, React, WCAG standards, and UX best practices.
Using Figma for broad team adoption, we structured components for consistency and maintainability. We built from simple elements to modular components, enhancing reusability and consistency. Globally updatable components streamlined standards and collaboration, balancing flexibility and diverse use cases to ensure scalability.
Conclusion
We delivered a structured, component-based UX design system in Figma that improves workflows, reduces errors, and fosters collaboration. Scalable with product growth, it maintains brand consistency and serves as a lasting foundation for design excellence across the organization.
Retention UX design system components
Summary
Leveraging insights from contributions to the enterprise-wide UX design system components were created for and tailored to Retention team UX workflows.
Components were built with ease of scalability in mind. The previous Retention components involved many duplicate parts, making them difficult to modify when changes were necessary.
A previously designed component, the Accounts-to-pay card
The same card is now easier to modify
It became clear through observation that UX designers were recreating existing properties and variants because the default component view didn’t show all available options. This lack of visibility caused confusion and wasted time.
To solve this, the component was restructured to display all properties and variants upfront. Designers could now easily see every option at a glance and simply toggle off what they didn’t need, streamlining their workflow and reducing duplication. There was no single, moist frequently used option, making this default component option the most sensible.
The Accounts to pay card default view
The Accounts to pay card component controls in the right sidebar
UX/UI Pattern Library
Summary
Ricoh-USA lacked a user interface pattern library to address common design challenges and ensure consistency, maintainability, and reusability across its websites and applications. My role was to create tailored pattern libraries that aligned with each corporation’s unique needs and goals.
The solutions presented were designed specifically for these organizations, taking into account their existing corporate structures, available technologies, internal capabilities, and user needs
.
Conclusion
By developing customized pattern libraries, I helped these companies establish a foundation for scalable, user-centered design. The resulting systems improved efficiency, reduced design inconsistencies, and supported long-term growth across digital products.
Sample pages
Wireframe Standards Guide
Summary
Each product team had a dedicated UX/UI designer who collaborated closely with an assigned architect. While teams learned to interpret their architect’s wireframes, challenges emerged when architects changed teams, were newly hired, or had to build upon another architect’s work. Inconsistent wireframing styles made it difficult for teams to interpret designs, slowing down production and creating unnecessary friction.
To address this, I created a company-wide wireframe standards guide aimed at bringing consistency to how architects produced wireframes. The guide outlined clear visual and structural conventions, optimized for use with Axure, the company’s chosen prototyping tool. Everyone involved in reviewing wireframes received the guide and a brief orientation, ensuring alignment across teams.
Conclusion
The wireframe standards guide significantly improved communication, reduced confusion, and increased design efficiency across teams. It also streamlined onboarding for new architects and team members, enabling faster integration and more consistent design output throughout the organization.