目的
输出Twitter注册登录PRD,分析功能设计逻辑
模块
启动页
| 页面 | 包含元素 | 功能 | 目的 | 交互 |
|---|---|---|---|---|
| 欢迎页/启动页 | - Twitter Logo - 诱导注册文案 - 创建账户按钮 - 登录 |
注册(核心) | 拉新,保持用户增长 | - 点击【create account】按钮,判断网络是否可用: - 不可用,展示报错文案,引导重试 - 可用,切换至注册账号页 |
| 登录(次要) | 老用户身份验证,保护账号安全 用户使用App核心功能入口 |
- 点击【log in】按钮,发起登录请求,判断请求结果: - 请求失败,展示报错文案,引导重试 - 请求成功,切换至登录页 |
注册页

| 功能 | 目的 | 功能设计 |
|---|---|---|
| 姓名输入 | 用户侧: - 为用户打上标签,方便好友识别,利于用户迅速建立社交圈 - 方便用户记住账号,减少后期遗忘/丢失寻回成本 - 模拟现实陌生人见面场景,优先询问姓名,减少用户陌生感 - 尊重用户展示个性习惯 |
产品侧:
- 便于区分用户
- 推荐好友
| a)输入规则
- 支持输入内容:数字、文字、特殊符号、Emoji
- 输入字符数量:[1,50]
- 输入字符为空时,【next】不可点击
- 输入字符数量>50时,展示报错文案:输入数量应该在50以内,并标红;
- 文案位置:输入框下方
- 实时判断输入字符数量,当字符数量超出范围时,报错文案持续展示;当在范围内时,隐藏红色报错文案
- 支持录入输入字符数量超过50
b)展示规则:
- 失焦时,输入字符数量<41时,输入内容完整展示;字符数量>41时,前41个输入内容完整展示,超出范围展示’…’;
- 聚焦时,光标自动定位至已录入的末位字符末端,完整展示末位字符前41个;
- 光标定位输入框时,对输入内容进行实时校验
c)校验规则:
- 首先判断当前网络是否可用:
- 不可用,实时校验不可用,展示提示文案‘网络不可用’
- 可用,调用实时校验,判断输入框输入字符数量是否大于等于1:
- 否,不调用实时校验
- 是,判断输入字符数量是否在[1,50]范围间:
- 在范围内,展示‘通过’图标;
- 超出范围,展示‘不通过’图标及报错文案,文案标红,置于账号输入框下方
- 输入框字符数量由[1,n)变为0时,清空原有校验结果
|
| 联系方式输入
(邮箱/手机号) | 用户侧:
- 选择用户高频使用的联系方式注册,用户记忆成本低,易唤起
- 考虑用户隐私敏感度差异,提供手机/邮箱两种注册方式
- 便于后期账户寻回
产品侧:
- 邮箱/手机具有唯一性,利于区分用户
- 利于获取用户联系人列表,推荐用户
- 用户使用手机号注册时,区分用户所在地域,推动精准推送
| a)手机号注册:
- 输入字符类型:仅支持纯数字
- 实时校验规则
- 当输入字符数量大于等于7时,开始调用实时校验,此时判断用户是否输入完毕(光标停留并闪烁2次):
- 否,输入框末端展示加载图标,当用户输入完毕时,返回实时校验结果
- 是,判断当前输入字符类型是否为纯数字:
- 否,返回校验‘不通过’结果,展示‘不通过’图标,并在联系方式输入框下方展示报错文案‘请输入有效手机号’,文案标红
- 是,判断手机号是否有效(指存在于数据库且已激活号码):
- 无效,展示报错文案‘请输入有效手机号’
- 有效,展示校验通过图标
- 当输入字符数量由大于等于7更改为小于7时,清空实时校验结果及展示文案(若有)
b)邮箱注册
- 点击【Use email instead】切换邮箱注册
- 要求格式: xx@yy.com / xx@yy.cn
- xx可输入字符类型:纯字母、纯数字、部分特殊符号(如!/&/_/-/+等)
- yy可输入字符类型:纯字母、纯数字
- 实时校验规则
- 当输入字符数量>0(包含已敲出但未键入字符),且光标闪动3次仍未输入新字符时,调用实时校验
- 判断输入字符格式是否符合要求格式:
- 符合,判断邮箱是否已注册:
- 未注册,实时校验通过,返回‘通过’图标
- 已注册,实时校验不通过,返回‘不通过’图标,文案提示:该邮箱已被注册
- 不符合,实时校验不通过,返回‘不通过’图标,输入框下方展示提示文案‘请输入有效邮箱’,并标红
- 当修改已有字符时,隐藏已有校验结果图标,当光标闪动3次后,再次判断更改后字符是否符合要求格式,此时图标显示加载状态:
- 符合,展示‘通过‘图标
- 不符合,实时校验不通过,返回‘不通过’图标,及提示‘请输入有效邮箱’文案;文案置于输入框下方,标红
|
| 出生日期 | 用户侧:
- 用户可能会思考平台意图,引起探索兴趣
- 让年轻用户产生参与感
产品侧:
- 根据用户年龄确定后期推送内容
- 当用户为低龄儿童/青少年时,需根据法规,特殊保护
- 传递平台关心用户一切的形象/价值主张
| a)出生日期选择
- 点击输入框,自动呈现滚轮式时间控件,时间具体到年月日;滚轮停止滚动时,所展示的时间自动填充至输入框
- 滚动更改单个时间单位时(年/月/日),仅更改输入框中对应的时间单位;如单次仅更改月,那么输入框需更改时间单位仅为‘月’
- 滚动更改2个及以上时间单位时,同时更改输入框对应的时间单位;如同时滚动年&月,则同时更改输入框中展示的年&月
- 有效时间范围:1900/12/1—当前年月日;选择时间超出有效时间范围,【Next】置灰,不可点击;
思考:可选时间范围如何确定?
b)日期有效性实时校验规则
- 校验时间点:滚轮停止滚动,展示时间自动更新至输入框时,调用实时校验
- 实时校验判断规则
- 当选择时间超出有效时间范围,实时检验不通过,检验结果展示为空
- 当选择时间在有效时间范围内,实时检验通过,结果展示‘有效’图标
- 当选择时间从有效时间范围外到范围内时,实时检验通过,结果展示‘有效’图标
- 当选择时间从有效转为无效时,实时检验不通过,清除原有‘有效’图标
|
个人数据使用授权
| 功能 | 目的 | 图示 | 功能设计 |
|---|---|---|---|
| 授权平台获取个人浏览数据 | 用户侧: - 获取更多新潮、个性化的内容推荐 |
产品侧:
- 分析用户浏览数据,获取用户喜好,精准推送内容,增加停留时常
- 根据用户数据,精准推送广告,提升转化,实现盈利
|
| a)授权含义
- 已授权:说明新用户成功注册账户并激活后,允许平台获取并分析个人浏览数据
- 未授权:说明新用户成功注册账户并激活后,不允许平台获取任何个人浏览数据
b)功能包含模块
- 授权文案
- 开关按钮
- 帮助中心入口
- Next按钮
c)交互
- 开关按钮
- 默认关闭;
- 点击后开启,说明用户已授权;再次点击关闭,说明用户停止授权
- 帮助中心入口
- 点击后跳转帮助中心—自定义设置账户页面
- 点击返回,跳转授权页面
- Next按钮
- 点击后,跳转注册信息确认页
|
注册信息确认页
| 功能 | 目的 | 图示 | 功能设计 |
|---|---|---|---|
| 二次确认注册信息正确性 | 用户侧: - 二次确认已填写信息是否有误 |
产品侧:
- 二次校验必填字段信息,判断是否符合规则
| 
| a)功能包含模块
- 注册账户标题
- 必填字段信息:用户名/联系方式/出生日期
- 确认注册说明文案:包含服务条款/隐私政策/数据使用/隐私选项
- 注册按钮
b)交互
- 必填字段信息
- 同步注册页必填字段信息
- 点击任一字段后跳转至注册页,光标自动定位点击字段处,唤起输入键盘
- 若用户进行修改,判断修改后是否符合校验规则:
- 符合,实时校验返回通过结果
- 不符合,实时校验返回不通过结果,并报错
- 编辑完毕,再次返回注册信息时同步修改后内容
- 注册说明文案
- 作用:向新用户说明确认注册后,个人信息使用规则
- 其中服务条款/隐私政策/数据使用/隐私选项可点击
- 服务条款:点击后跳转服务条款说明H5页面;点击返回,跳转注册信息确认页
- 隐私政策:点击后跳转隐私政策说明H5页面;点击返回,跳转注册信息确认页
- 数据使用:点击后跳转数据使用H5页面;点击返回,跳转注册信息确认页
- 隐私选项:点击后跳转隐私选项页面
- 页面包含两个选项:允许他人通过邮箱寻找到“我”/允许他人通过手机号寻找到“我”
- 选项默认开启,用户再次点击关闭,停止授权
- 点击Done,跳转注册信息确认页
- 注册按钮
- 点击后,发起生成账户请求,对必填字段信息再次进行校验,判断校验结果:
- 校验通过,跳转邮箱验证页
- 校验不通过,不生成账户,报错提示:“当前无法完成注册”;关闭提示,自动返回注册页,清空已有信息
|
邮箱验证页
| 功能 | 目的 | 图示 | 功能设计 |
|---|---|---|---|
| 注册联系方式验证 | 用户侧: - 绑定邮箱/手机 |
产品侧:
- 确认用户上传的联系方式是否真实/可用
|
| a)功能包含模块
- 文案:说明验证方式
- 验证码输入
- 无法收到验证码
- Next
b)交互
- 验证码输入
- 仅支持输入数字,限定6位;输入数字不加密
- 区分已输入/未输入状态
- 无法收到验证码
- 点击后页面底部弹出浮窗,提供选择:a)重新发送邮箱;b)使用手机号
- 点击重新发送邮箱,判断发送结果:
- 发送成功,页面返回成功icon
- 发送失败,页面返回失败icon
- 最多可连续发送3次,超出3次,暂时锁住该账号的注册功能,并且弹窗提示:‘已超出尝试次数,请稍后再试’,关闭弹窗返回注册确认页
- 点击使用手机号,跳转注册页,光标自动定位联系方式输入处,清空已有内容
- Next
- 输入数字小于6位时,Next不可点击;输入数字为6位时,Next可点击;超出6位时,取输入数字的前6位
- 最多可点击8次,第9次点击,文案提示:超出尝试次数;自动跳转启动页
- 点击时,校验验证码正确性,判断校验结果:
- 校验通过,返回注册通过结果,进入app主页
- 校验失败,输入框下方呈现报错文案:‘输入字符有误,请重新输入’;3s后自动清除已输入数字
|
Q&A
1.与FB相比,Twitter对新用户注册必填字段信息采用实时校验,原因及优劣势?
| 产品 | 校验机制差异 | 目的 | 优点 | 不足 |
|---|---|---|---|---|
| FB | 注册新账号时,填写完所有必填字段,点击确认注册对所有已填信息进行统一校验 部分字段填充信息校验不通过时,返回错误页面 |
引导用户完成长链路的注册流程 |
| 用户
a)填写过程中不被打扰/中断,体验佳
产品
a)不中断用户注册流程,保证用户体验
b)缩短每一注册节点耗时,保持用户耐心
c)按必填字段顺序调统一接口校验,可能减少服务器压力 |
- 用户
a)当填充信息多处有误,需多次返回修改时,与用户点击确认注册行为的期待互斥
b)延长注册停留时间
- 产品
可能需多次执行多字段重复校验,校验时间长,无法及时返回校验结果 |
| Twitter | 注册新账号时,对所有必填字段信息进行实时校验
字段填充信息通过校验时,才能进入下一页面 | 及时纠错,减少注册流程后续环节耗时 |
- 用户
及时获取每一步操作的结果反馈,及时更正不满足要求操作
- 产品
避免集中校验对系统造成的压力;教育用户平台的注册规则 |
- 用户
a)可能在某一环节某一必填项上多次试误,失去耐心,退出注册,流失;b)多次试误失败引起反感,用户体验差
- 产品
集中多次调查询结口,对系统造成访问压力 |
2.重新发送验证码为什么最多只能发3次?
原因:
1)基于大部分用户点击重新发送验证码并验证成功的次数,设定尝试阈值为3次
2)多人多次点击重新发送,对数据库造成密集访问压力,影响用户正常使用
3)防止暴力破解验证码,生成无效账户恶意攻击;6位数的验证码组合有100万种,每个验证码锁定期为5min,可以通过自动程序多次尝试不同破解验证码
3.为什么验证码校验最多只能验8次?
原因:防止恶意尝试输入,保护用户的账户安全

