kham.udom work fast

FAST — UI framework for the web

AccessibilityFASTWeb ComponentsOpen SourceReactTypeScriptCSSHTML
fast.design ↗ GitHub ↗

The work. FAST is Microsoft's open-source project for building adaptive, standards-based web components. I contributed to building and maintaining accessible components with React and Web Component technology, collaborating with design and engineering to own, build, and maintain Web Components across multiple Microsoft Edge web experiences using FAST and Fluent UI Web Components.

case.scope — what I owned

Scope

  1. Edge web experiences. Owned, built, and maintained Web Components for multiple Edge surfaces, working across design and engineering with FAST and Fluent UI Web Components.
  2. The FAST website. Contributed to creating fast.design while leading a few interns. I built the navigation and section-header components.
  3. High contrast, both libraries. Owned the high-contrast accessibility work for both the FAST and Fluent UI component libraries.
  4. Assistive-tech verification. Tested components in high contrast, keyboard navigation, and screen readers (VoiceOver, Narrator, and JAWS) against the patterns in the ARIA Authoring Practices Guide.

case.website — the front door

The FAST website

I contributed to building fast.design, the project's public face, while mentoring a few interns through their contributions. I owned the site navigation and the section-header components.

The fast.design website hero: The adaptive interface system for modern web experiences, over flowing wave artwork
fig 1 — fast.design.

case.a11y — the biggest contribution

Accessibility in mind

My biggest contribution was owning the high-contrast work for both the FAST and Fluent UI libraries. I made sure components met accessibility standards by testing where it counts: in Windows high contrast, with keyboard-only navigation, and in real screen readers (VoiceOver, Narrator, and JAWS), building against the best practices and patterns of the ARIA Authoring Practices Guide.

Then I wrote it down: a guidance document to help the open-source community and internal partners build accessible components with high contrast in mind, so the standard didn't depend on me being in the room.

case.today — open source keeps moving

FAST, then and now

FAST has changed a lot since I worked on it, which is what you want from a healthy open-source project. The components I built shipped to Edge users, and I'm still on the contributor list.

case.transfer — what this work makes me good at

What transfers

I test with actual screen readers, VoiceOver, Narrator, and JAWS, because automated checks miss most of what matters. High contrast is the kind of work many engineers avoid, and I ended up owning it for two libraries. I mentored interns while shipping. And I documented the accessibility guidance so the standard wouldn't depend on me.

This is the site's live theme editor. Each control below is a design token: a named style decision, like the accent color or corner radius, that every part of this page derives from. Change one and watch the whole system follow.

Reset to defaults

This drawer is a ch-dialog, the radios are ch-radio, and every button, card, and badge on this page is a Charm component. The sliders mutate Charm's token layer directly, and the system re-themes itself live. Under the hood, each token is a CSS custom property on :root, and your changes are saved in this browser. Go ahead, break it.