3.5 KiB
3.5 KiB
A05 向 A01 视觉体系收拢设计
设计决定:2026-07-16 用户确认采用完整收拢方案。本文只约束 A05 的视觉资产与字体迁移,不改变接口边界和重置密码业务流程。
目标
把 A05 重设密码页仍在使用的旧认证视觉替换为 A01 已确定的新体系,使 A01、A04、A05 在品牌 Logo、字体、标题分隔、主按钮和项目自定义 Toast 上保持一致。
唯一视觉真源
- A01 当前真实运行视觉与
docs/design/screens/handoff/2026-07-16/A01-current-password-sms-contact-824x915.png。 - 全局字体合同:
styles/global.scss中的"STKaiti", "KaiTi", serif。 - Logo:
static/assets/foundation/transparent/brand-seal.png,A05 使用与 A01 相同的184×221rpx槽位、top: 64rpx和水平居中规则。 - 标题分隔:
static/assets/modules/auth/transparent/a01-vnext-divider-v1.png,使用aspectFit,不得拉伸。 - 朱砂主按钮:
static/assets/foundation/transparent/a01-scroll-primary-v3.png,用于“确认重设”和成功结果中的“返回登录”,使用aspectFit。 - 浅色卷轴 Toast:
static/assets/foundation/transparent/a01-scroll-toast-v3.png,使用九宫格border-image,不得用绝对定位图片层拉伸。
页面结构
- 保留现有红色宗祠水墨底图、返回按钮、标题、副标题、四字段表单、获取验证码入口、重设提示和返回登录入口。
- 删除 A05 内所有局部
font-family,统一继承项目全局楷体。 - Logo 缩小到 A01 已确认尺寸;不改底图,不把 Logo 烘焙进背景。
- 标题分隔线、页面主按钮和成功结果按钮换成 A01 新资产;按钮文字仍由真实 DOM 承担。
- Toast 删除旧
feedback-toast__skin图片层,改用新浅色卷轴九宫格背景。
行为验证与结果态边界
- A05 仍在“获取验证码”前校验手机号。
- 真实滑动验证必须使用后续接口组件自带样式;旧
a02-login-panel.png验证面板不作为最终视觉证据。 - 本轮移除旧自定义验证面板的最终视觉依赖。手机号通过后只显示“滑动验证待接口接入”的项目自定义 Toast,不伪造滑块完成、验证码发送成功或倒计时。
- 四字段本地校验和成功结果层继续保留,用于当前页面视觉流程审核;成功结果层换用
a01-scroll-dialog-v3.png作为国风卷轴容器,但该资产在滑动验证场景仍不得冒充真实组件。 - 返回登录仍使用
/pages/auth/a01-entry,不恢复已删除的 A02。
不变范围
- 不接短信、滑动验证、重置密码或登录接口。
- 不新增路由,不修改 A01、A04 或其他页面。
- 不改变手机号、验证码、新密码、确认新密码的字段和现有就近错误文案。
- 不新增深色主题,不压缩 320×568;短屏继续自然纵向滚动。
- 不使用
uni.showToast、uni.showModal、uni.showLoading或uni.showActionSheet。
验收标准
- 静态合同要求 A05 引用新 Logo 尺寸、标题分隔、两处朱砂按钮与九宫格 Toast,且不再引用旧主按钮、旧次按钮、旧登录面板或局部字体。
- 运行时覆盖默认空表单、手机号错误、滑动验证待接入 Toast、全字段错误、密码不一致和成功结果层。
- 320×568、360×640、360×800、412×915 无横向溢出;320×568 允许纵向滚动。
- 只保存一张 412×915 代表图或一张复杂状态联系表;H5 只作为候选证据。
- Android/HBuilderX、真实滑动验证和真实接口结果继续待审,A05 保持
[~],不冻结。