10 KiB
10 KiB
A-01 启动 / 登录引导设计记录
状态：A-01 文字注册入口方案、四尺寸静态验收、本地 UI 与 412 × 915 运行时视觉基准已完成并获用户验收；A-02 双标签本地 UI 已完成并获用户验收。A-03 已删除；协议页去向、A-04 至 A-06 的设计、认证接口与 Android 全尺寸回归验收仍未完成，D2 继续进行中。
本页设计事实的唯一归档位置为本文件。旧的
2026-07-13-a01-login-guide-design.md与2026-07-13-a01-login-guide.md仅保留为失效历史，不可作为实现或推进下一页的依据。
1. 已归档的美术锚点
- v1–v3 早期整页效果稿已于 2026-07-17 上传前清理；历史入口结构保留在本记录与项目外完整归档中，不再作为当前方案依据。
- 当前可恢复美术源：
assets/a01-vnext/source/A01-layered-source-v1.psd与a01-psd-manifest.json。 - 当前运行时视觉基准：
screens/A01-启动登录引导-栅格验收-412x915.png，用于 A-01 协议未勾选状态的同尺寸像素比对；pages/auth/entry.vue必须使用真实页面结构还原，不得将整张效果图作为页面内容。 - 用途：保留本轮已确认的“家祠卷轴”欢迎页美术方向，不作为可直接还原的代码布局图，也不作为功能图标资产。
- 画面方向：朱砂家祠红头、暖宣纸主体、古金细线与云纹、墨褐标题、两侧淡墨建筑/竹影与底部山水。登录欢迎页后续必须使用独立的红头/宣纸背景组合，不复用 G01 的列表页大山水底图。
2. 已确认的页面结构与交互
- 标题区保留“家谱 / 为家族留存可传承的记忆”，使用美术锚点中的朱砂家祠红头、暖宣纸、古金云纹、墨褐文字与淡墨建筑/竹影层次。
- 操作区只保留两个大按钮和一个文字入口：朱砂主按钮“登录”、古金描边按钮“微信登录”，以及其下方的“还没有账号？注册账号”。“注册账号”仅为朱砂红可点击文字，不再作为独立大按钮。
- 入口顺序：登录为主入口；微信登录为次入口；注册账号为辅助文字入口。
- 已勾选协议后，“登录”前往
A-02，且A-02内固定使用“账号密码登录 / 手机验证码登录”双标签切换，默认显示账号密码登录。微信授权取消、失败与受限状态以后归A-06；当前入口继续提示“微信登录功能准备中”，不新增真实授权跳转。 - 注册账号入口仍归
A-04；忘记密码仍归A-05。这两页完成设计前，当前入口只提示页面准备中，不伪造跳转。 - 协议必须为用户主动勾选：初始未勾选，可分别打开《家谱用户协议》和《隐私政策》。不得使用“登录即表示同意”或任何默认同意文案；未勾选时登录操作应明确提示用户先确认协议。
3. 固定布局与状态边界
- 页面采用纵向滚动；
320 × 568下两个按钮、注册文字和协议行可以滚动，但任一按钮文字、注册文字、协议行和底部内容不得被系统导航区遮挡。 - A-01 的登录与微信功能图标均需采用独立本地透明 PNG；微信标志只使用官方或许可来源的原色透明 PNG，不自行重绘或改色。账号密码与手机号验证码的表单图标归 A-02 设计时确定。
- A-01 只设计欢迎、入口与协议未勾选提示。账号密码与手机号验证码表单均归
A-02，微信授权取消、失败与受限结果归A-06，注册归A-04，忘记密码归A-05。绑定手机号以后归个人中心安全设置。 - A-01 正常态必须展示两个按钮、注册文字入口和未勾选协议；点击任一需要授权的入口但未勾选协议时，仅提示“请先阅读并同意相关协议”，不视为用户已同意。
- 页面根容器宽度必须为 100%，不可写死为
750rpx或使用整张效果图。固定设计画布仍以750rpx为测量基准，运行时由真实 DOM 按当前屏宽响应式还原。
412 × 915 运行时校准表
| 元素 | 412 × 915 像素基准 | 750rpx 实现基准 |
|---|---|---|
| 朱砂家祠头图 | 高 139px | 高 253rpx |
| 红头谱印 | 比头图顶边低约 38px | top: 70rpx |
| 标题区起点 | 红头后约 82px | padding-top: 150rpx |
| 标题两侧云纹 | 紧贴标题两侧，不扩张标题组宽度 | 独立透明素材 auth-title-cloud-v1.png，64rpx × 40rpx，标题左右各 12rpx |
| 标题分隔饰线 | 宽约 234px，中心为对称小结 | 宽 426rpx；中结使用独立透明素材 auth-divider-knot-v1.png，上、下间距独立 |
| 两个按钮 | x=60px，宽约 291px，高约 65px | margin: 95rpx 110rpx 0，高 118rpx |
| 两按钮间距 | 约 28px | margin-top: 51rpx |
| 按钮内框与内容组 | 内框距外边约 3px，四角有卷草角花；图标与文字整体偏左 | inset: 6rpx；四角使用同一张 auth-button-corner-v1.png 镜像；内容组 translateX(-20rpx) |
| 注册入口 | 微信按钮后约 56px；无左右短线 | margin-top: 98rpx |
| 协议行 | 注册入口后约 77px；复选框与全部文案同一水平线 | margin-top: 141rpx，字号与行高均为 20rpx / 30rpx，复选框 30rpx，align-items: center、white-space: nowrap，加安全区 |
- 上表是 A-01 运行时布局数值的唯一所有者。320 × 568 时页面允许纵向滚动，根容器不得以
overflow: hidden截断协议行或系统安全区；底部内边距包含env(safe-area-inset-bottom)。 - 仅作静态设计验证，不代表 uni-app 运行时验收；页面实现后仍须在 Android 320 × 568、360 × 640、360 × 800、412 × 915 上重新验收。
| 状态 | 触发 | A-01 可见结果 | 去向 |
|---|---|---|---|
| 初始未勾选 | 首次进入 | 两个按钮、注册文字与空复选框 | 留在 A-01 |
| 未同意协议 | 点击登录、微信登录或注册账号 | 提示“请先阅读并同意相关协议”，不跳转、不改变勾选状态 | 留在 A-01 |
| 登录已确认协议 | 点击“登录” | 结束 A-01 引导 | A-02，默认账号密码登录标签 |
| 微信已确认协议 | 点击“微信登录” | 提示“微信登录功能准备中” | 留在 A-01；真实授权取消、失败与受限状态以后归 A-06 |
| 注册已确认协议 | 点击“注册账号”文字 | 提示“注册页面准备中” | 留在 A-01，等待 A-04 设计完成 |
A-01 资产清单
| 资产 | 用途 | 来源或生成提示 | 尺寸与验收 |
|---|---|---|---|
docs/design/assets/a01-vnext/source/A01-layered-source-v1.psd |
A-01 可恢复视觉源 | 当前分层 PSD 与清单 | 页面以真实 DOM 和导出位图还原，不把整页设计图作为页面内容 |
static/assets/backgrounds/auth-ancestral-header-v1.png、auth-rice-paper-v1.jpg、auth-ink-scenery-v1.png |
A-01 分层页面背景 | 2026-07-13 内置图像生成 | 当前 A-01 使用；不得复用 G-01 背景 |
static/assets/icons/auth/login-outline-v1.png、static/assets/icons/auth/wechat-licensed-v1.png |
A-01 两个按钮图标 | 登录图标复用项目既有资产；微信图标来源与许可见旧记录 | 当前 A-01 使用；微信图标免费使用须在应用“关于/设置”及应用商店描述中保留 Icons8 署名链接 |
static/assets/foundation/opaque/a01-primary-button.png、a01-secondary-button.png |
A01 登录与微信登录的完整按钮皮肤 | 2026-07-13 以运行时视觉基准的比例与画风生成；不裁切设计图 | 1877 × 418px、1881 × 419px 不透明 PNG；分别承担底色、双线边框和四角纹样，DOM 仅叠放图标与文案 |
static/assets/icons/auth/auth-divider-knot-v1.png |
标题上下金线的中心对称中结 | 2026-07-13 根据 412 × 915 视觉基准生成，去绿幕后保存 | 160 × 96px 透明 PNG；不得改用长祥云 |
static/assets/icons/auth/auth-title-cloud-v1.png |
“家谱”标题左右祥云 | 2026-07-13 根据 412 × 915 视觉基准生成，去绿幕后保存 | 200 × 120px 透明 PNG；右侧只允许镜像该素材 |
4. 静态设计验收与剩余缺口
- 静态设计验收已覆盖 320 × 568、360 × 640、360 × 800、412 × 915；四个尺寸均保持两个大按钮与单行文字注册入口。
412 × 915图是 A-01 协议未勾选状态的运行时像素基准；A-01 本地页以真实 DOM 还原其层级和比例，运行时仍须截图对比，不得以整图页面替代。 - 归档文件：320 × 568、360 × 640、360 × 800、412 × 915。
- 此结论只验证设计稿与固定栅格，不替代 uni-app 页面实现后的 Android 运行时验收。
- 2026-07-13 用户已验收当前连续背景、完整按钮边框与单行协议区的
412 × 915运行截图，A-01 当前视觉基准标记为完成；本轮不再授权继续微调视觉细节。 - 页面实现阶段仍须按本记录在 Android 实机或同等运行环境复核四个尺寸的安全区、滚动与文字折行。
- A-01 的协议最终页面去向及 A-04 至 A-06 的设计仍未完成；A-03 已删除。这些后续范围不影响当前 A-01 视觉基准的验收结论。
5. 推进约束
A-01与A-02的本地 UI 已按本记录及实现合同落地并获用户视觉验收；A-03 已删除，后续仅在 A04--A06 获得明确授权后推进。- 当前 A-01 视觉基准已完成；后续只在协议页面、认证接口或新页面范围获得明确授权后继续推进。
- 用户已于 2026-07-13 授权落地 A-01 欢迎入口与 A-02 双标签登录页的本地 UI；仍不接接口、不执行真实登录、不改 Android 打包配置。实现细节的唯一所有者见
docs/superpowers/specs/2026-07-13-a01-a02-static-ui-implementation-design.md。