Design Systems

How I work

Over twelve years of designing for complex, enterprise-level platforms, I have transitioned from creating interfaces to architecting the systems that power them. I view Design Systems not merely as component libraries, but as strategic assets that align stakeholders, engineering, and product teams. By managing the full lifecycle of these systems from initial conception to long-term evolution, I ensure that as the business scales, the user experience remains cohesive and the development velocity remains high.

Modern product design requires a balance between systematic rigor and the flexibility to innovate. Throughout my career across diverse industries, I have led the development of design infrastructure for organizations navigating rapid growth. This involves more than just documentation. It requires establishing a shared language that bridges the gap between design and code. By creating robust, accessible, and themeable systems, I help teams move away from solving the same UI problems repeatedly, allowing them to focus on high-level product strategy and user needs.

The true value of a Design System lies in its ability to reduce technical debt and streamline cross-functional collaboration. I specialize in identifying and modernizing legacy components that hinder product evolution, replacing fragmented workflows with synchronized execution. My approach ensures that the design system is a living product in its own right. It is a tool that solves emerging conflicts, scales with the business, and serves as the foundation for every digital touchpoint.

TOOLS USED: SKETCH, XD, AND FIGMA.

CLIENTS: AMERIFIRST, NiMBAL HEALTH APP, CARX.

THE PROCESS: RESEARCH, AUDIT, EDIT, EVOLVE.research, audit, edit, evolve

Toolchain Strategy and Platform Agnosticism

Throughout my twelve-year tenure, I have witnessed the rapid evolution of the design software landscape. I have navigated the industry shift from static handoffs to the current era of integrated, code-aligned environments. Rather than championing a single application, I maintain a platform-agnostic approach. I prioritize the specific needs of the organization, the existing engineering stack, and the long-term maintenance requirements of the product.

My experience across the three most prominent industry standards has taught me that the value of a design tool lies in its ability to facilitate collaboration and bridge the gap to production. Whether I am adopting a tool mandated by an existing corporate infrastructure or selecting a new platform to optimize a startup’s workflow, my focus remains on building scalable, accessible, and maintainable systems.

The following case studies illustrate how I leverage these various environments to deliver high-fidelity design systems. Each project represents a unique set of constraints where the choice of software was a strategic decision to ensure cross-functional alignment and streamlined development cycles.

Clients

Within this presentation I’ll be showcasing 3 clients with whom I’ve used 3 different approaches to apply every thing I have learned and how this has improved their own Design Systems.

The Process

For each project, each design system the process changes depending on the basic needs, yet, I could see 3 states that basically are starting point patterns.

🔎 Research and Create

With heavy research, brand design guidelines defined, and co-work with the client the creation of the design system from scratch can be achieved

✎ Audit and Edit

Brand already has a design system but it has flaws and some items outdated, this is also a great point to start, maintenance is not always the last step.

⏭ Next Level Evolution

Either there’s a rebrand in process, the current Design System has become obsolete, or the expansion has gone to another level that current proposal is just not enough

ATOMIC DESIGN METHODOLOGY

Design Systems are just as complex as living organisms, changing and evolving at all times, Design Systems are always a work in progress, and a daily challenge.

Atomic Design: A Framework for Systematic Consistency

Atomic Design is more than a categorization method for UI elements. It is a mental model for building scalable, cohesive design systems from the ground up. By breaking down a digital interface into its most fundamental parts, we create a hierarchy that ensures consistency across every touchpoint of a product. This methodology allows for a shared language between design and engineering, reducing the friction of handoffs and accelerating the development of new features.

The system begins with Atoms, the foundational building blocks like colors, typography, and buttons. These are combined into Molecules, such as a search bar or a form field, which represent simple functional units. As the complexity increases, we assemble Organisms, which are distinct sections of an interface like a navigation header or a product grid.These components then form Templates, providing the structural layout for a page, which eventually lead to the Pages themselves—the high-fidelity representations of the final user experience.

Implementing this hierarchy is a strategic decision to eliminate design debt. Instead of designing screens in isolation, I focus on building a resilient library of reusable components that adapt to various use cases. This systematic approach ensures that as a platform grows, the design language remains unified, allowing the product team to focus on solving complex user problems rather than reinventing basic interface elements.

Sketch – AmeriFirst

My experience with Sketch dates back to the early emergence of cloud-based libraries, a period that required a rigorous approach to nested file structures and manual version control. While the platform has evolved significantly since then, navigating those initial technical constraints instilled in me a disciplined commitment to file organization and architectural best practices. I developed a systematic folder and naming convention that ensured seamless handoffs to stakeholders and fellow designers, a foundational habit that continues to drive the clarity and scalability of my design systems today.

USUAL FOLDER STRUCTURE

CLIENT’S FOLDER STRUCTURE

XD – NiMBAL Health App

My introduction to Adobe XD coincided with a strategic organizational shift at Metova, where we prioritized the platform’s emerging ecosystem and robust auto-animate features. Although the tool was initially less mature than its competitors, I leveraged its evolving library management and Document Assets to architect a more synchronized design workflow. By centralizing core components and enabling cross-file inheritance, I significantly reduced the cognitive load of asset discovery and improved overall team productivity. This experience demonstrated the value of adopting a tool not just for its standalone features, but for its capacity to drive operational efficiency and maintain a high-velocity output across complex projects.

Figma – CarX

Figma has consistently represented the most significant shift in my design workflow, offering a level of collaboration and versatility that previously required multiple fragmented tools. Beyond its adoption as an industry standard, I prioritize Figma for its sophisticated library distribution and real-time synchronization, which are essential for maintaining a unified design language across distributed teams. Its rapid release cycle and continuous improvements allow me to build increasingly complex systems while maintaining a high degree of operational agility. For me, it has transitioned from a simple design tool into a comprehensive platform for bridging the gap between high-level strategy and production-ready execution.

Conclusions

To conclude this look into my methodology, it is clear that a Design System is never truly finished. It is a living product that must adapt to new business requirements, evolving user behaviors, and emerging technical capabilities. My role as a Senior Product Designer and Strategist is to ensure this evolution happens without sacrificing the integrity of the core user experience or the efficiency of the development cycle.

The true measure of a successful system lies in its adoption and the autonomy it grants to a product team. By establishing a robust architectural foundation and a shared language across disciplines, I empower designers and engineers to move past repetitive UI tasks. This shift allows the entire organization to focus on high-level problem solving and strategic innovation, knowing that the structural quality of the product is handled by a resilient, well-governed framework.

Looking ahead, I remain committed to refining these workflows and exploring how new technologies can further bridge the gap between design and production. Whether navigating a shift in the toolchain or scaling a platform for a global market, my goal is to build systems that are as flexible as they are disciplined. I strive to create digital environments where consistency is the standard and where great design is a repeatable, scalable outcome.