👋 欢迎页
核心页面📋 欢迎页 — 产品需求文档
页面编号:P-WELCOME | 版本:v1.0 | 更新日期:2026-05-02
1. 页面定位与目标
欢迎页是用户首次打开 App 时看到的 品牌引导页,旨在向新用户展示 Dafapay 品牌形象,并提供快速注册/登录入口。适用于 未登录状态 的用户。
🧱 2. 模块拆解与功能说明
2.1 顶部导航栏
- 左侧:品牌标志(渐变紫色圆形图标)+ "Dafapay" 品牌名
- 右侧:语言切换按钮组(EN / हिंदी),当前语言高亮显示
2.2 品牌视觉区域
- 中心区域留白(等待设计完善插画),起到视觉缓冲作用
2.3 品牌文案
- 品牌名:"Dafapay" — 2.8rem 超大字体 800 字重,右上角绿色小方块装饰(10px,圆角 2px)
- 标语:"认识 Dafapay,今天最轻松的一步 / 进行您的首次投资"(两行居中)
2.4 行动按钮区域
- "立即开始" 主按钮 — 深色圆角大按钮,点击进入注册流程
- "已有账号?登录" 文字链接 — 点击跳转登录页
⚙️ 3. 交互规则与跳转
| 交互元素 | 触发 | 行为 | 跳转 |
|---|---|---|---|
| 立即开始 | 点击 | 进入注册流程 | → 注册页面 |
| 登录 | 点击 | 已有账号用户登录 | → 登录页面 |
| 语言切换 | 点击 | 切换 App 语言 | 页面内切换 |
📐 4. 设计规范
| 元素 | 规格 |
|---|---|
| 页面背景 | 纯白 #fff |
| 品牌名字号 | 2.8rem / 800 字重,字间距 -1.5px |
| 品牌装饰 | 右上角绿色方块 10×10px,背景色 #0ecb81,圆角 2px |
| 标语 | 1rem,颜色 t3 灰色,行高 1.8 |
| 主按钮 | 全宽,圆角 14px,背景色 #1a1a2e,内边距 14px,投影 0 4px 16px rgba(0,0,0,.15) |
| 语言切换 | 圆角 16px 胶囊按钮组,选中项紫色背景白色文字 |
📏 5. 通用规则
- 展示条件:仅在用户未登录状态下展示,已登录用户自动跳转首页
- 语言切换:默认根据系统语言自动匹配,用户可手动切换
- 品牌一致性:页面配色与 App 整体视觉风格保持一致(紫色主色调)
🔐 登录页
核心页面登录
📋 登录页 — 产品需求文档
页面编号:P-LOGIN | 版本:v1.0 | 更新日期:2026-05-02
1. 页面定位与目标
登录页是已注册用户的 身份验证入口,通过手机号 + 密码方式完成登录。页面设计简洁,减少用户操作步骤。
📝 注册页
核心页面创建您的账号
📋 注册页 — 产品需求文档
页面编号:P-REGISTER | 版本:v1.0 | 更新日期:2026-05-02
1. 页面定位与目标
注册页是新用户创建 Dafapay 账号的入口页面,通过手机号 + 密码方式完成注册。页面需引导用户完成必要信息填写,并确保合规(年龄确认 + 协议同意)。
🧱 2. 模块拆解与功能说明
2.1 表单输入区域
- 手机号输入框 — 占位文案"手机号",无图标
- 密码输入框 — 占位文案"密码",右侧眼睛图标切换显隐
- 确认密码输入框 — 占位文案"确认密码",右侧眼睛图标切换显隐
2.2 推荐人邀请码
- "推荐人的邀请码(选填)" — 普通输入框样式,与其他输入框一致
- 选填字段,不填写不影响注册
2.3 操作按钮
- "加入 Dafapay" 主按钮 — 全宽胶囊按钮
- 未勾选协议时按钮置灰(#d0d3dc),勾选后变为深色(#1a1a2e)
- 底部 "已有账号?登录" 链接 — 左对齐,登录为紫色带下划线
⚙️ 3. 交互规则与跳转
| 交互元素 | 触发 | 行为 | 跳转 |
|---|---|---|---|
| 返回按钮 | 点击 | 返回上一页 | → 欢迎页 |
| 输入框 | 点击/聚焦 | 边框高亮为紫色 | — |
| 密码眼睛图标 | 点击 | 切换密码明文/密文 | — |
| 推荐人邀请码 | 点击/聚焦 | 边框高亮为紫色,输入邀请码 | — |
| 协议勾选框 | 点击 | 切换勾选状态,同时按钮变色 | — |
| 用户协议/隐私政策 | 点击 | 打开对应协议页面 | → 协议详情页 |
| 加入 Dafapay | 点击 | 已勾选协议:提交注册;未勾选:提示勾选 | → 首页 |
| 登录 | 点击 | 跳转登录页 | → 登录页 |
🏠 首页
核心页面📋 首页 — 产品需求文档
页面编号:P000 | 版本:v2.4 | 更新日期:2026-05-02
1. 页面定位与目标
首页是用户登录后的 默认落地页,承载分享赚钱推广功能。目标是引导用户完成首次操作并持续活跃。
🧱 2. 模块拆解与功能说明
2.1 分享赚钱卡片
- 分享图标 + "分享赚钱"标题
- 副标题展示奖励:直接邀请1人 ₹10 / 间接邀请1人 ₹5
- 点击跳转分享赚钱详情页
⚙️ 3. 交互规则与跳转
| 交互元素 | 触发 | 行为 | 跳转 |
|---|---|---|---|
| 分享赚钱卡片 | 点击 | 进入分享赚钱详情页 | → 分享赚钱详情 |
📐 4. 数据规格
| 字段 | 来源 | 示例 |
|---|---|---|
| 邀请奖励标准 | 后端配置 | 直接 ₹10 / 间接 ₹5 |
📐 5. 设计规范
| 元素 | 规格 |
|---|---|
| 功能卡片 | 圆角 10px,左侧图标 40px 圆角方形,紫色淡底 |
📏 6. 通用规则
- 登录态:本页仅对已登录用户展示,未登录用户自动跳转欢迎页
- 卡片加载:各功能卡片数据独立加载,某一卡片接口失败不影响其他卡片展示
🏠 首页 V2-新手活动状态
核心页面📋 首页 V2-新手活动状态 — 产品需求文档
页面编号:P000-B | 版本:v2.4 | 更新日期:2026-05-02
1. 页面定位与目标
首页V2在V1基础上新增 新手任务卡片,引导新用户完成关键操作流程。完成后自动发放 ₹5 现金奖励,消息中心推送奖励通知,卡片永久消失。
🧱 2. 新增模块:新手任务卡片
2.1 卡片结构
- 位置:分享赚钱卡片下方
- 标题行:左侧勾选图标(40px 紫色淡底圆角方形)+ "新手任务"标题
- 副标题:"完成全部任务可获得 ₹5 现金奖励"(₹5 绿色高亮)
2.2 任务列表
- 任务一:完成添加 UPI KYC — 副标题"添加支付收款工具"
- 任务右侧显示状态标签:"未完成"(灰底灰字)/"已完成"(紫色淡底紫色字)
- 已完成任务:直接隐藏该任务条目,不再展示
2.3 完成奖励横幅
- 系统自动将 ₹5 现金奖励发放至用户账户余额
- 消息中心同步推送一条"新手任务奖励"通知
- 奖励发放完成后,新手任务卡片自动永久消失,不再展示
⚙️ 3. 交互规则
| 交互元素 | 触发 | 行为 |
|---|---|---|
| 卡片消失 | 自动 | 奖励发放完成后,卡片自动永久消失 |
* 在原型演示中,点击任务状态标签可模拟系统自动完成任务的效果。实际产品中由后端接口判定。
📐 4. 数据规格
| 奖励项 | 金额 | 发放条件 | 发放方式 |
|---|---|---|---|
| 现金奖励 | ₹5 | 任务全部完成 | 自动发放至账户余额 |
📏 5. 通用规则
- 任务卡片生命周期:新用户注册后自动展示 → 任务完成后自动发放奖励 → 卡片永久消失,不再展示(后端记录状态)
- 状态持久化:任务完成状态由后端存储,刷新页面后保持最新状态
- 重复触发保护:已完成的任务不重复发放奖励
- 其余通用规则:与首页 V1(P000)第 6 节一致
👤 我的
二级页面📋 我的 — 产品需求文档
页面编号:P-PROFILE | 版本:v3.1 | 更新日期:2026-05-02
1. 页面定位与目标
"我的"页面提供用户中心入口,用户可查看和编辑个人信息。
⚙️ 3. 交互规则与跳转
| 交互元素 | 触发 | 行为 | 跳转 |
|---|---|---|---|
| 用户中心 | 点击 | 打开用户中心浮层页 | → 用户中心 |
✏️ 用户中心
二级页面用户中心
📋 用户中心 — 产品需求文档
页面编号:P-EDITPROFILE | 版本:v1.0 | 更新日期:2026-05-02
1. 页面定位
用户中心页面用于查看和编辑用户个人信息,从"我的"页面点击"用户中心"按钮进入。
🧱 2. 模块拆解
2.1 顶部导航
- 返回按钮(返回"我的"页面)+ 标题"用户中心"
2.2 信息字段列表
- 用户编号 — 只读展示,右侧复制图标,点击复制到剪贴板
- 邀请码 — 只读展示用户专属邀请码,右侧复制图标,点击复制到剪贴板
- 昵称 — 展示当前昵称,右侧箭头,点击进入修改昵称页。备注:用户注册后默认以手机号作为临时昵称,中间四位脱敏显示(如 1239***1896)
- 邮箱 — 未添加时显示"未添加"灰色文字,右侧箭头,点击进入添加邮箱流程
- 添加邀请码 — 未添加时显示"未添加"+ 提示文字"账号只能添加一次邀请码";添加成功后显示邀请码值,提示变为绿色"已添加",箭头消失,不可再次点击
⚙️ 3. 交互规则
| 交互元素 | 触发 | 行为 | 跳转 |
|---|---|---|---|
| ‹ 返回按钮 | 点击 | 返回"我的"页面 | → 我的 |
| 用户编号 | 点击 | 复制用户编号到剪贴板,弹出"用户编号已复制"轻提示 | — |
| 邀请码 | 点击 | 复制邀请码到剪贴板,弹出"邀请码已复制"轻提示 | — |
| 昵称 | 点击 | 弹出修改昵称弹窗,输入新昵称后确认保存 | —(弹窗) |
| 邮箱 | 点击 | 弹出添加邮箱弹窗,输入邮箱地址后确认保存 | —(弹窗) |
| 添加邀请码 | 点击 | 首次点击:弹出输入框添加邀请码;添加成功后变为不可点击状态 | — |
| 退出登录 | 点击 | 弹出确认弹窗,确认后清除登录态跳转欢迎页 | → 欢迎页 |
📏 4. 通用规则
- 用户编号 / 邀请码复制:点击后调用系统剪贴板接口,复制成功后弹出轻提示(2 秒后自动消失)
- 昵称修改:弹窗内输入框预填当前昵称,用户修改后点击确认保存;空值时提示"请输入内容";成功后轻提示"昵称修改成功"
- 邮箱添加:弹窗内输入框占位文案为"请输入邮箱地址";提交时校验邮箱格式,格式错误时提示"请输入正确的邮箱地址"
- 邀请码一次性:邀请码只能添加一次,添加成功后:值变为已添加的邀请码、提示文字变为绿色"已添加"、箭头消失、点击失效
- 退出登录二次确认:弹出确认弹窗包含警告图标 + "确认退出登录?" + "退出后需要重新登录才能使用" + 取消/退出登录 双按钮
- 弹窗遮罩:所有弹窗均有半透明黑色遮罩(45% 透明度),点击遮罩可关闭弹窗
✉️ 消息中心
二级页面Message
📋 消息中心 — 产品需求文档
页面编号:P008 | 版本:v1.3 | 更新日期:2026-05-02
1. 页面定位
消息中心页面展示系统推送的奖励通知、活动通知和系统公告。消息按时间倒序排列,最新消息在最上方。
🧱 2. 消息类型
- 消息类型覆盖系统内所有奖励通知:
• 直接邀请奖励 — ₹10 现金 + 1张抽奖券
• 间接邀请奖励 — ₹5 现金 + 1张抽奖券
• 新手任务奖励 — ₹5 现金 + 1张抽奖券
• 交易达标奖励 — 1张抽奖券
• 分享领钱奖励 — ₹5,000 现金
• 抽奖中奖通知 — 显示具体奖项名称与金额
📐 3. 数据规格
| 字段 | 来源 | 示例 |
|---|---|---|
| 消息标题 | 后端推送,按奖励类型自动生成 | 直接邀请奖励 |
| 时间戳 | 消息创建时间 | 2026-04-28 10:35 |
| 内容预览 | 后端推送,包含具体奖励金额 | 完成直接邀请,被邀请者完成新手任务,+₹10 |
📏 4. 通用规则
- 消息排序:按消息创建时间倒序排列,最新消息在最上方
- 分页加载:每页加载 20 条消息,滚动到底部触发加载更多,无更多数据时显示"没有更多数据"
- 空状态:若无任何消息,展示空状态插画 + "暂无消息"文案
- 删除确认:删除操作即时生效(无二次确认),弹出轻提示"消息已删除"
- 实时推送:支持消息推送服务推送新消息,新消息到达时自动插入列表顶部