Matt Andryc is a Senior UX Design Engineer at Gradial with 7+ years of experience in frontend development, design systems, accessibility compliance, and data visualization. React expert specializing in composable component development and browser performance.

Education: MS Computer Science and Technology from Tsinghua University (HCI research, full scholarship). BA Chinese Language and Literature from Dartmouth College (Magna Cum Laude, Phi Beta Kappa).

Skills: TypeScript, React, Three.js, D3, Tailwind, Next.js, WCAG, WAI-ARIA, design tokens, Storybook, Radix UI, Shadcn, localization.

Selected Work

Decoding Hate — Data Visualization

Built at The Asian American Foundation (2020–2022). Interactive data visualizations using Three.js and React to visualize bias against Asian Americans during the pandemic. Recognized by Twitter Official Developer Platform. Also implemented accessible website and donation pipelines raising over $1B in pledges at launch.

MIUI Design Guidelines

Built at Xiaomi, Inc. (2013–2016). Mobile design guidelines and localization infrastructure applied at scale across mobile form factors and connected devices. Enabled expansion from 2 to 10 languages in under 6 months.

Table Component

Built at Assembled, Inc. (2022–present). A versatile, accessible table component for data-rich dashboards with column resizing, empty states, and design system integration. Part of a broader component library and design system effort including tokens, typography, and animation.

Curious, careful and
very
allergic to
sesame seedssesame seeds

Data visualization

Fragmented data pattern

Data visualization

Data visualization case study — interactive Three.js and React visualizations of anti-Asian bias during the pandemic, built at The Asian American Foundation

Phone line-up

Design guidelines

Design guidelines case study — mobile design patterns and localization infrastructure at scale for MIUI, built at Xiaomi

Repeated table pattern

Component design

Component design case study — accessible table component for data-rich dashboards with column resizing and design system integration, built at Assembled

Fragmented data pattern

Data visualization

Data visualization case study — interactive Three.js and React visualizations of anti-Asian bias during the pandemic, built at The Asian American Foundation

Design guidelines

Design guidelines case study — mobile design patterns and localization infrastructure at scale for MIUI, built at Xiaomi

Repeated table pattern

Component design

Component design case study — accessible table component for data-rich dashboards with column resizing and design system integration, built at Assembled