Design System Development

Uses ready-made Angular Material or ng-zorro-antd components in projects. Understands design system principles: consistency, component reuse, following color and typography guidelines.

Uses ready-made design system components on Radix UI in React applications: buttons, forms, modals, navigation. Understands component composition principles, applies correct variants and sizes according to design guidelines.

Uses ready-made components from Skeleton UI or other Svelte UI libraries, following documented patterns. Applies design tokens (CSS variables) for colors and typography, creates simple reusable Svelte components according to guidelines.

Creates reusable Angular components for the design system: custom form controls via ControlValueAccessor, composable components with content projection (ng-content), documentation via Storybook.

Creates reusable React components for design system based on Radix UI primitives: compound components, polymorphic components through asChild. Documents in Storybook with interactive examples, types props through TypeScript.

Develops design system components on Svelte 5 with typed $props(), slots, and snippets for flexible composition. Configures Storybook for Svelte component documentation, creates variants through CSS variables and Tailwind classes.

Designs Angular design system architecture: standalone component library, theming via CSS Custom Properties, Angular CDK for behavioral primitives, auto-generated documentation.

Designs React design system architecture: headless components with Radix UI, styling through Tailwind CSS + CVA, tokenization through CSS custom properties. Creates NPM package with tree-shaking, automated tests and visual regression testing.

Designs Svelte design system architecture: headless components, token system, themeable architecture with CSS custom properties. Creates npm package library with auto-generated documentation, ensures WCAG 2.1 AA and SvelteKit SSR support.

Manages design system development for the Angular team: versioning via Nx libraries, RFC process for new components, Figma integration through design tokens, adoption metrics.

Leads design system development for the team's React projects: defines component APIs, contribution process, versioning and breaking changes. Coordinates with designers to ensure Figma-to-code consistency through design tokens.

Manages the team's design system development: component roadmap, version policy, contribution process. Coordinates designer and developer work, ensures Figma token synchronization with Svelte components and Tailwind configuration.

Defines design system strategy at the organizational level: multi-platform system (Angular + mobile), micro-frontend compatibility, Web Components for cross-framework reusability.

Defines design system strategy for the organization's React application ecosystem. Designs multi-brand architecture with shared core, white-label theming, governance model for distributed teams and company-wide adoption strategy.

Defines design system strategy at the organizational level, ensures scaling across Svelte products. Researches cutting-edge approaches: style-dictionary integration, cross-framework tokens, automatic component generation from Figma for the Svelte ecosystem.