tezvyn:

Monolithic or multiple libraries for cross-platform design system?

AI-drafted, machine-checkedintermediate

This tests cross-platform design system architecture. Pick multiple interconnected libraries, centralize tokens in a shared primitive layer, and branch platform components downstream. Red flag: one monolithic file ignoring native rendering constraints.

WHAT THIS TESTS: Your ability to separate concerns between universal design language and platform implementation realities. Interviewers want to see that you understand tokens are platform-agnostic while components must respect native rendering engines, accessibility APIs, and interaction patterns. They also want evidence that you have scaled systems across organizational boundaries.

A GOOD ANSWER COVERS: First, choose multiple interconnected libraries rather than a monolith. Structure them as a core token library feeding separate web, iOS, and Android component libraries. Second, define primitive tokens like color, spacing, typography, and elevation in the shared layer using platform-agnostic formats such as JSON or Style Dictionary. Third, let each platform library consume those tokens and build components using native primitives, for example SwiftUI or Compose, so the output respects platform conventions and accessibility. Fourth, establish governance: version the token package independently, publish changes through a CI pipeline, and require platform leads to approve token updates that affect component contracts. Fifth, discuss how to handle shared assets like icons through a unified pipeline while allowing platform-specific overrides for touch targets or motion curves.

COMMON WRONG ANSWERS: A monolithic single library is almost always the wrong answer because it forces lowest-common-denominator abstractions and breaks native rendering. Another red flag is treating tokens and components as the same layer, which leads to cascading breaking changes when a color value shifts. Avoid answers that ignore dependency management or suggest manual copy-paste of values between platforms. Also be wary of claiming that React Native or Flutter eliminates the need for platform separation; the question asks about web, iOS, and Android specifically.

LIKELY FOLLOW-UPS: How do you handle a token change that breaks contrast ratios on one platform but not another? What is your strategy when iOS Human Interface Guidelines and Material Design conflict with the shared token values? How do you prevent version drift where one platform lags months behind the token library? What is your process for adding a new token, from design tool to production code?

ONE CONCRETE EXAMPLE: Imagine migrating from hex colors to an OKLCH color space. With a shared token library, you update the JSON source and regenerate platform outputs. Web consumes it via CSS custom properties, iOS via SwiftUI Color extensions generated from the same schema, and Android via Compose color objects. Each platform team updates their component library dependency, runs visual regression tests against their native components, and ships independently. If Android needs a slightly different surface tint for elevation due to Material You dynamics, the token remains shared but the component layer applies the platform-specific override without polluting the global token set.

Get five bites like this every day.

Tezvyn delivers a daily feed of 60-second tech bites with quizzes to lock in what you learn.