关于 developer-signup-flow
这项设计技能帮助产品团队减少开发者注册到开始编码之间的阻碍,涵盖 OAuth 选项、API 密钥展示、渐进式资料收集、个性化引导和转化衡量。
主要功能
- 01按受众选择 OAuth 选项
- 02减少注册表单字段
- 03在注册后展示 API 密钥
- 04逐步收集资料
- 05个性化引导路径
- 06衡量注册与激活漏斗
适用场景
- 01设计开发者产品的注册流程
- 02决定何时收集用户资料
- 03规划 API 密钥展示和引导
- 04查找注册漏斗中的流失点
安装
复制下面的命令,在终端中运行。
npx skills add https:/ / github.com/ jonathimer/ devmarketing-skills --skill developer-signup-flow安装后在 Claude Code 中输入/developer-signup-flow确认已加载。
附带文件README.md
详细介绍
开发者注册流程
打造尊重开发者时间、让他们尽快开始编写代码的注册体验。
概述
开发者注册是你展示自己了解开发者的第一个机会。每一个不必要的表单字段、每一次额外点击、每一条“继续前请验证邮箱”,都在传递一个信息:你并不重视他们的时间。最好的开发者注册体验几乎让人感觉不到它的存在——开发者从“我想试试这个”到“我正在编写代码”,不到 60 秒。
本技能涵盖 OAuth 集成、API 密钥生成体验、渐进式信息收集,以及如何衡量真正重要的注册转化指标。
开始之前
查看 /devmarketing-skills/skills/developer-audience-context 技能,了解你的目标开发者细分群体。针对周末探索的爱好者和为公司评估工具的企业开发者,注册优化方式有很大差异。
有效的 OAuth 选项
优先使用 GitHub 的方式
对于开发者工具,GitHub OAuth 应该是你的首选。原因如下:
- 内置身份验证——活跃的 GitHub 账号有提交历史、代码仓库和社交证明
- 熟悉授权范围——开发者了解 GitHub 的权限模型
- 个人资料数据——你可以获取用户名、邮箱,并根据公开活动推断经验水平
- 信任信号——开发者本来就活跃在 GitHub 上
良好的实现(Vercel):
- 页面上最醒目的是一个“使用 GitHub 继续”按钮
- 提供邮箱选项,但将其作为次要选项
- 无需创建密码
- OAuth 后立即跳转到仪表板
糟糕的实现:
- GitHub、Google、Twitter、LinkedIn、邮箱和“使用手机号注册”都同等醒目
- 即使使用 GitHub OAuth,也要求验证邮箱
- 在显示仪表板前要求填写额外的个人资料信息
OAuth 选项优先级
根据你的受众确定优先级:
| 受众 | 首选 | 次选 | 避免 |
|---|---|---|---|
| 开源开发者 | GitHub | 邮箱 | Google Workspace |
| 初创公司开发者 | GitHub | 企业 SSO | |
| 企业开发者 | SSO/SAML | Google Workspace | 社交账号登录 |
| 数据科学家 | GitHub | ||
| 移动开发者 | GitHub |
Google OAuth 注意事项
以下情况适合使用 Google OAuth:
- 你的工具集成了 Google Cloud 服务
- 你的目标用户是 Android 开发者
- 你的受众包括非技术利益相关者(产品经理、设计师)
以下情况不适合使用 Google OAuth:
- 开发者使用个人 Gmail,但需要使用工作身份注册
- 你的工具没有集成 Google 生态系统
- 你需要 Google Workspace 专用授权范围
邮箱注册:适用场景
应提供邮箱 + 密码注册,但不要将其作为主要选项。它适用于:
- OAuth 受限的企业环境中的开发者
- 限制第三方访问、注重隐私的开发者
- GitHub/Google 账号无法体现职业身份的情况
如果支持邮箱注册:
- 只需邮箱即可注册——发送魔法链接,无需创建密码
- 显示仪表板前绝不要求验证邮箱
- 为偏好使用魔法链接的开发者提供“稍后设置密码”选项
减少表单字段
零字段理想方案
最好的注册不包含自定义字段。你需要的信息都可以通过 OAuth 获取:
- 姓名(来自 OAuth 个人资料)
- 邮箱(来自 OAuth 个人资料)
- 用户名/昵称(来自 GitHub 用户名)
- 头像(来自 OAuth 个人资料)
必须提问时
如果确实需要收集信息,请将其延后:
不佳:阻塞注册
Create Account
- Email
- Password
- Company Name (required)
- Role (required)
- Team Size (required)
- How did you hear about us? (required)
[Create Account]
良好:渐进式收集
Continue with GitHub
[Immediate dashboard access]
[Later, contextually in dashboard]
"To customize your experience, what are you building?"
[ ] API/Backend
[ ] Web app
[ ] Mobile app
[ ] Data pipeline
[Skip for now]
字段筛选清单
对于要添加的每个字段,请回答:
- 能否从 OAuth 个人资料数据中推断?
- 能否根据注册后的行为推断?
- 能否等到相关情境出现时再询问?
- 这个字段能帮助做出什么必须现在就做的决策?
- 这个字段会带来多大的转化成本?
研究表明,每增加一个必填字段,转化率就会降低 5-10%。
API 密钥生成体验
立即生成密钥
开发者注册是为了编写代码。立即向他们显示 API 密钥。
良好的实现(Stripe):
- 完成 OAuth
- 控制面板立即显示测试 API 密钥
- 无需额外点击即可查看和复制密钥
- 生产密钥采用“显示”模式,测试密钥则无需此模式
糟糕的实现:
- 完成 OAuth
- “欢迎!请完善个人资料以开始使用”
- 必须填写个人资料表单
- “创建你的第一个项目”向导
- 项目设置页面
- “生成 API 密钥”按钮
- 终于看到密钥
密钥显示最佳实践
Your API Key
sk_test_xxxxxxxxxxxxxxxxxxxx [Copy]
[Show in cURL example] [Show in SDK example]
- 使用等宽字体显示密钥
- 提供一键复制按钮
- 在使用情境中显示密钥(代码示例)
- 默认显示测试密钥
- 生产密钥需点击“显示”才能查看
- 切勿要求将密钥下载到文件中
多个密钥和密钥管理
等到开发者有此需求时再提供。首次注册时应只显示一个密钥。
在以下情况下引入密钥管理:
- 开发者创建第二个项目
- 开发者邀请团队成员
- 开发者询问密钥轮换事宜
个性化引导流程
基于使用场景的路径
提出一个问题,然后自定义体验:
问题(注册后显示,可跳过): “你正在构建什么?”
- 与现有应用集成
- 构建新项目
- 为团队评估
- 只是随便看看
路径自定义:
| 选择 | 控制面板重点 | 首个 CTA | 默认文档 |
|---|---|---|---|
| 与现有应用集成 | SDK 和集成 | “安装 SDK” | 集成指南 |
| 构建新项目 | 快速入门教程 | “开始教程” | 入门指南 |
| 为团队评估 | 定价和功能 | “预约演示” | 使用场景 |
| 只是随便看看 | 交互式 Playground | “试用 Playground” | API 参考 |
检测框架/语言
如果使用 GitHub OAuth,请检查公开仓库中的语言使用模式:
Primary language: Python (45% of repos)
Also uses: JavaScript (30%), Go (15%)
→ Show Python SDK first in docs
→ Default code examples to Python
→ Suggest Python quickstart
基于行为的个性化
注册后,跟踪行为并进行调整:
| 行为 | 调整 |
|---|---|
| 复制 cURL 示例 | 显示更多 cURL 示例,减少 SDK 示例 |
| 提前查看定价页面 | 在控制面板中展示免费层级限制 |
| 创建多个项目 | 推荐团队功能 |
| 频繁访问文档 | 添加“遇到问题?”帮助小组件 |
渐进式资料收集
收集内容和时机
注册(仅 OAuth):
- 姓名、电子邮件、头像(来自 OAuth)
首次会话(可选,在相关情境中):
- 主要使用场景(点击一次即可选择)
- 首选语言(推断或点击一次即可选择)
首次 API 调用后:
- 公司名称(用于企业功能)
- 团队规模(用于协作功能)
达到免费层级限制后:
- 电话号码(用于计费)
- 账单地址(用于开具发票)
升级后:
- 完整公司资料(用于账户管理)
- 行业/垂直领域(用于案例研究)
让渐进式资料收集显得自然
不佳:随机弹窗
[Popup after 3 days]
Help us serve you better!
Company: ___
Role: ___
Team size: ___
How did you hear about us: ___
良好:结合情境进行询问
[When developer invites first team member]
To set up your team workspace, what should we call it?
Company/Team name: ___
[When developer hits rate limit]
To increase your rate limit, we need to verify your account:
Phone: ___
衡量注册转化率
核心指标
注册开始率
- 点击“注册”或“开始使用”的访客
- 基准:占着陆页访客的 5-15%
注册完成率
- 完成 OAuth 或提交表单的用户
- 基准:注册开始用户中的 70-90%(OAuth)
- 基准:注册开始用户中的 30-50%(表单)
注册耗时
- 从点击注册到进入控制面板所用的秒数
- 基准:OAuth 少于 30 秒,表单少于 60 秒
激活指标(注册后)
API 密钥复制率
- 复制 API 密钥的用户
- 基准:首次会话中达到 60-80%
首次 API 调用率
- 至少发起一次 API 调用的用户
- 基准:前 24 小时内达到 30-50%
首次 API 调用所需时间
- 从注册到首次 API 调用所需的分钟数
- 基准:设计良好的引导流程应少于 10 分钟
漏斗分析
跟踪完整漏斗:
Landing page visitors: 10,000
├── Clicked signup: 1,000 (10%)
├── Completed signup: 800 (80% of clicks)
├── Copied API key: 600 (75% of signups)
├── First API call: 300 (50% of key copies)
└── Second day return: 150 (50% of first call)
找出开发者在哪个环节流失,以及原因:
- 放弃 OAuth 权限页面
- 电子邮件验证延迟
- 对控制台感到困惑
- 找不到 API 密钥
- 首次 API 调用失败
A/B 测试优先级
按以下顺序测试(从影响最大到最小):
- 显示的 OAuth 选项数量
- 表单字段数量
- 电子邮件验证时机
- 控制台上 API 密钥的位置
- 默认快速入门语言
- 欢迎邮件发送时机
真实开发者工具案例
优秀的注册流程:Vercel
- “使用 GitHub 继续”选项最醒目
- 一键完成 OAuth
- 立即显示可导入项目的控制台
- 不询问任何问题
- 60 秒内即可完成首次部署
优秀的注册流程:Stripe
- 使用电子邮件注册,但流程精简
- 进入控制台前无需验证电子邮件
- 立即显示测试 API 密钥
- 引导式设置为可选
- 清晰区分测试模式和生产模式
糟糕的注册流程:[应避免的常见模式]
- “完善个人资料”阻止用户访问控制台
- 必须先验证电子邮件才能查看任何内容
- 必须填写公司名称和团队规模
- 必须验证电话号码
- 无法跳过的“创建首个项目”向导
- API 密钥藏在多层导航之后
工具
分析与测试
- Amplitude/Mixpanel - 漏斗分析和群组跟踪
- LaunchDarkly/Split - OAuth 流程 A/B 测试
- FullStory/LogRocket - 通过会话回放调试注册流程
- Customer.io/Intercom - 引导邮件序列
身份验证提供商
- Auth0 - 功能全面,但会增加复杂度
- Clerk - 面向开发者,默认设置合理
- WorkOS - 需要企业 SSO 时使用
- Supabase Auth - 简单的开源选项
- Firebase Auth - 适合移动端优先的场景
API 密钥管理
- Unkey - API 密钥管理即服务
- Custom - 大多数开发者工具都会自行构建
相关技能
/devmarketing-skills/skills/developer-onboarding- 注册后会发生什么/devmarketing-skills/skills/developer-audience-context- 了解注册用户是谁/devmarketing-skills/skills/free-tier-strategy- 他们注册是为了什么