Articles

• 界面设计系统

  2026年8月13日design

  源自 You Don't Have a Design System 及与 AI 展开的方法论

  大多数人以为自己有「设计系统」，其实他们只有一个组件库和 design token。就像没有图纸的积木，每次 AI 搭出的结果都可能完全不同。

  问题的核心是将已有的决策固定，Atomic Design 十年前就提出了一套自下而上的设计结构来实现：

  1. atoms: 组件库
  2. molecules: 原子组件加行为。ConfirmableSwitch = switch + 有重要代价需要确认
  3. organisms: 布局关系，molecules 的摆放方式
  4. templates: 页面骨架，organisms 的摆放方式
  5. pages: 完整的页面

  这套结构过去让团队不需要从零判断界面长什么样，放到现在，可以更新为两点：

  1. 固定好决策的高层组件。规定每个部分该是什么样子
  2. 配套规则和 lint。限制 AI 绕过组件自己拼

  高层组件的设计原则只有一个：尽可能少的 props。每少一个 prop，就少一个 AI 要做的决策，结果也更可控。

  命名上必须遵守：命名即文档。ValidatedInput 代表会自...(阅读全文)

• 自动化测试思路

  2026年8月4日design

  自动化测试的目标，是确认用户实际使用的功能可用。

  很多 AI 生成的项目，AI 已经测过，为什么第一次真正上手时，功能仍然大多不可用？因为 AI 更偏向测试底层接口。按钮能不能点、弹窗能不能关闭、页面切换后状态是否正常，这些都可能没有被覆盖。底层接口通过了，交互层却成了盲盒。

  一套有效的自动化测试策略，至少需要满足两点：

  第一，模拟用户的真实操作。《杀戮尖塔 2》没有给自动化测试机器人 API 或额外权限。它只能识别窗口中的可交互组件，模拟玩家真实操作。测试必须经过用户实际路径。例如，如果让机器人失败后继续游戏，测试效率提高了，但整个失败流程也被跳过了。放到产品中一样。支付接口能用，不代表用户点击按钮，页面跳转、状态加载、支付取消、失败等过程正常。

  但仅仅模拟真实操作还不够。

  第二，不预设固定流程。用户不会一直按照产品设计者设想的顺序操作。他们可能中途返回、重复点击、跳过步骤、停留很久，也可能在流程完成前关闭页面。如果自动化测试只执行几条固定脚本，它验证的只是预设路径，而不是产品面对真实用户时的稳定性。因此，《杀戮尖塔 2》的测试机器人不按照固定策略出牌，在可行操作中随机选择，覆盖尽可...(阅读全文)