设计中心

跨团队与产品规模化设计系统的架构与治理。

消除“代码里看起来不一样”漂移的规格、令牌与评审闭环。

渐进保真阶段、验证门与设计探索工具链。

Stories、MDX 文档与 addon 配置，构建活的组件文档。

贡献模型、变更请求工作流与决策权，维持设计系统健康。

设计系统包的 semver 策略、monorepo 发布与消费者升级路径。

迁移消费者、度量采用、维持组织内认同的策略。

量化影响：采用率、设计到代码时间、包大小、无障碍覆盖率。

分层文档：快速开始、组件 API、用法指南、决策日志，保持同步。

令牌分层、品牌资产管线、多租户产品的运行时主题切换。

复合组件、渲染属性、无头 hooks 和多态模式，构建灵活的 UI 库。

基于令牌的主题、闪烁预防与系统偏好检测，构建稳健暗色模式。

时间曲线、手势反馈与减弱动效模式，构建愉悦且无障碍的 UI。

带键盘箭头、ARIA 角色与受控/非受控模式的无障碍 tablist。

单开 vs 多开手风琴、高度动画、可折叠区段的 ARIA 接线。

递归数据、展开/折叠、多选、层级导航的 ARIA tree 角色。

仅渲染可见切片以窗口化 1 万+ 行，带稳定 key 与动态高度。

带键盘对等、放置指示、乐观持久化的指针重排序。

ContentEditable 陷阱、文档模型、为何应直接用 ProseMirror/TipTap 而非 contentEditable。

嵌入带语言模式、lint、懒加载控包大小的代码编辑器。

选图表类型、编码感知、带视觉摘要的无障碍数据表。

构建满足 WCAG 2.2 AA 合规的无障碍 Web 界面的实用指南。

为前庭敏感或偏好用户禁用非必要动画。

达文本 4.5:1、UI 3:1、用工具测试、修常见失败。

约束 Tab 循环在覆盖内并在关闭时恢复焦点。

首个可聚焦的 '跳到主内容' 链接，让键盘用户绕过导航。

向屏幕阅读器播报异步状态变化（toast、搜索结果、表单错误）。

跨平台可扩展的令牌管线、命名约定与组件组合策略。

从单种子构建 50-500-900 色阶、语义角色、对比安全配对。

模块化字号阶、行高比、响应式 clamp() 字号，处处可读文本。

基 8 间距阶使 padding、margin、gap 决策自动化且一致。

表达深度与层级一致的 elevation 阶与圆角令牌。

使动效一致、有目的、reduced-motion 安全的时长、缓动、弹簧令牌。

持久化用户主题选择、避免 FOUC、与系统偏好同步。

基于 Tailwind 的设计系统的断点策略、流式间距与容器模式。

组件驱动响应式：适配父容器而非视口。

让子级参与父栅格使列跨嵌套组件对齐。

媒体加载前预留空间以消除布局偏移（CLS）。

为头、工具提示、覆盖选对 position 值，无布局意外。

令牌化 z-index 阶与堆叠上下文，终结 z-index 军备竞赛。

立即显示预期结果并在服务器响应时对账。

通过命令栈可逆编辑 — 撤销弹出并反转，重做再应用。

让用户稍后保存项，含乐观 UI、持久化、空状态。

防抖查询、键盘导航、最近搜索、结果分组。

对所有动作和页面的键盘优先搜索 — 高级用户到一切的快捷方式。

组织偏好、即时 vs 应用时存、搜索设置模式。

令牌化渐变停止点与预设使渐变保品牌一致。

模糊、饱和、混合模式 — 及其性能与 a11y 代价。

感自然的缓动曲线与时长 — 及保持一致的令牌。

跟踪并偿还设计系统与已发布之间的差距。