一个组件的诞生

https://whimsical.com/component-flow-QBMNNCjmj819HCZcnH1c95

收集需求、评估

• PMC 同学从 issue、论坛或业务使用群中收集新组件需求，PMC 周例会上提出讨论，协商一致确定新组件满足“通用性”与“必要性”的要求。
• 向设计师同学同步新组件设计需求，需要提供必要的组件功能说明、业务使用样例截图或业界其他组件库中类似组件的链接等
• 设计师同学排期安排产出交互稿，确定后续负责设计稿的设计同学
• 在主仓库 roadmap 里新增组件类型，状态标记为“待启动”

准备阶段

• 在 TDesign 周报、内部论坛、issue、内外部群等渠道持续招募各角色贡献者：UI 开发同学、API 制定者、各技术栈开发同学（角色只用于明确开发职责，可以都是同一位同学，招募时可以询问是否愿意承担相应的职责）
• UI 开发、API 制定及某个技术栈开发角色招募到位后，就可以拉企业微信群介绍组件相关情况，包括但不限于：宣讲各参与人职责、交互稿地址、相关开发、设计指引文档等。API 制定者需要根据现有设计稿及业界类似组件实现，制定一份 API 初稿，并约相关组件参与者进行线上会议评审
• 线上评审会
  • 必需参与的角色：技术栈 PMC 负责同学、交互设计师、视觉设计师、UI 开发同学、API 制定者、各技术栈开发同学
  • 讨论内容：API 设置是否满足业务场景需求，是否留有扩展空间（组件易用性与灵活性 trade-off）；API 描述等是否框架无关，能够在多个技术栈中实现；交互稿是否满足需求，是否提供了所有场景的 demo
  • 会后需要明确交互稿调整后定稿时间
• 交互设计师撰写该组件的设计指南（例：https://tdesign.tencent.com/vue-next/components/button?tab=design）
• 视觉设计师根据调整后的交互稿，产出设计稿及时在群中同步
• 负责组件进展的 PMC 同学录入 API 管理平台：https://github.com/Tdesignoteam/tdesign-api

开发阶段

• clone 仓库：https://github.com/TDesignOteam/tdesign-api，按照仓库 README 中指令操作说明拉取对应组件 API 相关文件至本地
• 负责 UI 开发的同学按照设计稿独立在 common 中开发组件 UI（HTML + CSS），UI demo 需要包括交互稿中给出的各类使用场景的静态样式。提交 PR 后在群中同步信息，如果有其他技术栈开发同学需要与 PMC 同学一起 CR UI 实现，没问题后合入 PR
• 组件开发：各技术栈开发同学使用 cli 工具拉取生成本技术栈的组件 API 定义相关文件（例：https://github.com/Tencent/tdesign-vue/blob/develop/src/button/props.ts），根据定义文件和 UI 实现进行组件逻辑开发
• 开发完成后提交 PR，各 CI 环节执行通过后需要邀请 PMC 同学进行 CR，如果在提交 PR 过程中遇到问题，可以先参考指引：https://tdesign.tencent.com/about/contributing

验收阶段

• CR 问题修复后，邀请交互、视觉设计师同学参与走查验收，对照 PR 上预览官网地址走查组件 demo 实现情况
• 视觉设计师需要设计该组件的一个缩略图，以在 组件概览 页展示
• PMC 同学上传缩略图到 TDesign 公共 COS 服务，生成图片链接给组件开发同学，在 common overview 文档中新增组件预览入口，并更新该分类下组件数量
• PR 合入 develop，准备发布
• PMC 同学收集各位参与同学 GitHub 账号，更新到贡献者维护系统中

发布