tezvyn:

🎨Design & UX

UI design, UX research, and design systems

1133 bites

More in Design & UX — page 9

Design Systems75 sec read

Design tokens for multi-brand button theming

WHAT IT TESTS: token fundamentals and tiered theming. OUTLINE: tokens as named design decisions, primitive-versus-semantic layers, per-brand themes mapping semantic to primitive. RED FLAG: hardcoding hex values per brand instead of a shared semantic token.

Design Systems77 sec read

End-to-end process for a Modal props API break

WHAT IT TESTS: the full lifecycle of a breaking API change. OUTLINE: justify and design the change, additive rollout with deprecation, major release plus codemod, comms and adoption tracking.

Design Systems79 sec read

Measuring designer efficiency from Figma data

WHAT IT TESTS: quantifying design-side ROI with real instrumentation. OUTLINE: library component usage and detach rates from Figma, time-to-mockup, override frequency via the API. RED FLAG: measuring only code adoption and ignoring the design tool entirely.

Design Systems72 sec read

Linking form-component adoption to fewer a11y bugs

WHAT IT TESTS: designing a sound measurement, not just claiming impact. OUTLINE: define both variables, segment by adoption level, control confounders, watch correlation-versus-causation.

Design Systems75 sec read

Gradual design system adoption in legacy code

WHAT IT TESTS: incremental migration of a large legacy codebase. OUTLINE: coexistence strategy, codemods for mechanical swaps, lint rules to block regressions, prioritize high-traffic surfaces.

Design Systems73 sec read

Measuring design system adoption and health

WHAT IT TESTS: quantifying adoption with concrete, automatable metrics. OUTLINE: component coverage and version spread from code scans, usage analytics, issue and satisfaction signals.

Design Systems72 sec read

Technical and comms plan for a Button break

WHAT IT TESTS: pairing technical migration tooling with communication. OUTLINE: additive-first then deprecate, major semver, codemod and guide, multi-channel early comms with adoption tracking.

Design Systems78 sec read

Critical a11y fix requiring a breaking API change

WHAT IT TESTS: balancing urgent accessibility risk against breaking-change discipline. OUTLINE: ship a safe interim fix, plan the breaking API as a major with deprecation and codemod, communicate urgency.

Design Systems75 sec read

Design systems across micro-frontends

WHAT IT TESTS: adapting a design system to independently deployed front ends. OUTLINE: shared singletons and version alignment, token-based theming, distribution via shared scopes, stronger governance.

Design Systems75 sec read

Governance for accessibility regressions

WHAT IT TESTS: a repeatable a11y governance loop across consuming products. OUTLINE: detection via audits and monitoring, triage with severity and ownership, remediation SLAs, prevention feedback.

Design Systems74 sec read

Automated a11y testing in CI and its limits

WHAT IT TESTS: building a11y checks into CI while knowing their ceiling. OUTLINE: axe-core in unit and story tests, fail the build on violations, plus manual screen-reader and keyboard testing.

Design Systems77 sec read

Architecting a federated documentation site

WHAT IT TESTS: aggregating docs from many repos into one site. OUTLINE: docs-as-code with a manifest, CI publishing artifacts, a build that pulls and merges, unified deploy. RED FLAG: manually copy-pasting docs between repos with no automated aggregation.

Design Systems76 sec read

Documenting accessibility per component

WHAT IT TESTS: making accessibility actionable, not a generic page. OUTLINE: per-component a11y sections, keyboard tables, ARIA roles and states, live examples. RED FLAG: one global accessibility page with no component-specific keyboard or ARIA detail.

Design Systems70 sec read

Composite components versus layout primitives

WHAT IT TESTS: balancing consistency against flexibility in API design. OUTLINE: primitives give flexibility and composition, composites enforce consistency, choose by reuse and variation.

Design Systems77 sec read

Rolling out a breaking change to a shared Button

WHAT IT TESTS: managing a breaking change in a high-blast-radius component. OUTLINE: major semver bump, deprecation period, codemod and migration guide, staged comms. RED FLAG: forcing an immediate hard cutover with no deprecation window or upgrade tooling.

Design Systems80 sec read

Versioning and shipping design tokens via NPM

WHAT IT TESTS: package versioning discipline for a shared dependency. OUTLINE: semver, deprecate-before-delete with aliases, codemods and migration guides. RED FLAG: silently renaming tokens and bumping a minor version, breaking every consumer.

UX Research2 min read

How would you track clicks on a new 'Export Data' button?

Tests prod analytics design beyond console.log. Outline: typed event schema, client validation, beacon or queue with batching, and queryable storage. Red flag: fire-and-forget tracking without retry, sampling, or privacy checks.

UX Research2 min read

Outline a research plan to diagnose low adoption despite positive usability tests

Tests distinguishing usability from adoption drivers. Strong answers hypothesize discoverability, motivation, and timing gaps; use behavioral triangulation, contextual inquiry, and surveys. Red flag: blaming users or redesigning before diagnosing the funnel.

UX Research2 min read

How would you secure a moderated screen-sharing session end to end?

WHAT IT TESTS: Privacy architecture for sensitive streaming data and stored artifacts. ANSWER OUTLINE: Cover encrypted WebRTC transport, KMS-backed storage, access controls, PII redaction, and retention policies.

UX Research2 min read

UX researcher finds usability issues in your feature. Your process?

It tests triaging qualitative UX feedback with telemetry and cross-functional collaboration. Reproduce the issue, correlate with logs, isolate UI or backend causes, then co-design a fix via prototype or A/B test.