fix: match A01 v3 visual reference

2026-07-13 14:47:28 +08:00
parent b1b635c6ae
commit 225c5272b6
6 changed files with 128 additions and 268 deletions
@@ -8,16 +8,16 @@

 - 文件：[`screens/A01-启动登录引导-效果稿-v1-显式协议.png`](screens/A01-启动登录引导-效果稿-v1-显式协议.png)
 - 效果稿 v2：[`screens/A01-启动登录引导-效果稿-v2-独立注册.png`](screens/A01-启动登录引导-效果稿-v2-独立注册.png)，记录此前“四个独立按钮”的尝试；该入口结构已失效，不作当前方案依据。
- 当前效果稿 v3：[`screens/A01-启动登录引导-效果稿-v3-文字注册入口.png`](screens/A01-启动登录引导-效果稿-v3-文字注册入口.png)，体现本记录第 2 节的当前入口层级。
+- 当前效果稿 v3：[`screens/A01-启动登录引导-效果稿-v3-文字注册入口.png`](screens/A01-启动登录引导-效果稿-v3-文字注册入口.png)，体现本记录第 2 节的当前入口层级，也是 `pages/auth/entry.vue` 的运行时视觉源；不得再用 CSS 重画其中的家祠、云纹、标题、按钮框与山水。
 - 用途：保留本轮已确认的“家祠卷轴”欢迎页美术方向，不作为可直接还原的代码布局图，也不作为功能图标资产。
 - 画面方向：朱砂家祠红头、暖宣纸主体、古金细线与云纹、墨褐标题、两侧淡墨建筑/竹影与底部山水。登录欢迎页后续必须使用独立的红头/宣纸背景组合，不复用 G01 的列表页大山水底图。

 ## 2. 已确认的页面结构与交互

 - 标题区保留“家谱 / 为家族留存可传承的记忆”，使用美术锚点中的朱砂家祠红头、暖宣纸、古金云纹、墨褐文字与淡墨建筑/竹影层次。
- 操作区只保留两个大按钮和一个文字入口：朱砂主按钮“账号密码登录”、古金描边按钮“微信登录”，以及其下方的“还没有账号？注册账号”。“注册账号”仅为朱砂红可点击文字，不再作为独立大按钮。
- 入口顺序：账号密码登录为主入口；微信登录为次入口；注册账号为辅助文字入口。
- 已勾选协议后，“账号密码登录”前往 `A-02`，且 `A-02` 内固定使用“账号密码登录 / 手机验证码登录”双标签切换，默认显示账号密码登录。微信授权中、取消与失败回跳状态仍归 `A-03`，在 A-03 设计完成前当前入口只提示“微信登录功能准备中”。
+- 操作区只保留两个大按钮和一个文字入口：朱砂主按钮“登录”、古金描边按钮“微信登录”，以及其下方的“还没有账号？注册账号”。“注册账号”仅为朱砂红可点击文字，不再作为独立大按钮。
+- 入口顺序：登录为主入口；微信登录为次入口；注册账号为辅助文字入口。
+- 已勾选协议后，“登录”前往 `A-02`，且 `A-02` 内固定使用“账号密码登录 / 手机验证码登录”双标签切换，默认显示账号密码登录。微信授权中、取消与失败回跳状态仍归 `A-03`，在 A-03 设计完成前当前入口只提示“微信登录功能准备中”。
 - 注册账号入口仍归 `A-04`；忘记密码仍归 `A-05`。这两页完成设计前，当前入口只提示页面准备中，不伪造跳转。
 - 协议必须为用户主动勾选：初始未勾选，可分别打开《家谱用户协议》和《隐私政策》。不得使用“登录即表示同意”或任何默认同意文案；未勾选时登录操作应明确提示用户先确认协议。

@@ -27,16 +27,16 @@
 - A-01 的登录与微信功能图标均需采用独立本地透明 PNG；微信标志只使用官方或许可来源的原色透明 PNG，不自行重绘或改色。账号密码与手机号验证码的表单图标归 A-02 设计时确定。
 - A-01 只设计欢迎、入口与协议未勾选提示。账号密码与手机号验证码表单均归 `A-02`，微信授权结果归 `A-03`，注册归 `A-04`，忘记密码归 `A-05`。
 - A-01 正常态必须展示两个按钮、注册文字入口和未勾选协议；点击任一需要授权的入口但未勾选协议时，仅提示“请先阅读并同意相关协议”，不视为用户已同意。
- 固定设计画布为 `750rpx` 宽；内容宽度 638rpx，左右各 56rpx。朱砂家祠头图高 196rpx；标题与副标题区域从头图下方开始，操作区首按钮顶边固定为 646rpx。
- 主按钮高度 108rpx，微信按钮高度 108rpx，二者间距 30rpx；注册文字在微信按钮下方 56rpx，字号 28rpx，整行居中且不得换行。两个按钮文字字号 36rpx，均单行居中。
- 协议行使用 26rpx 字号，页面最小底部内边距为 `calc(32rpx + env(safe-area-inset-bottom))`。320 × 568 时页面允许纵向滚动，协议行与任一入口均不得落入系统导航区。
+- 固定设计画布为 `750rpx` 宽。v3 原图尺寸为 `852 × 1846px`，运行时按宽度等比显示为 `750 × 1625rpx`；原图中的朱砂家祠、标题、按钮、注册文字、协议行和山水留白均为不可拆分的可见视觉层。
+- 运行时只在 v3 对应位置叠加不可见热区：登录、微信登录、注册文字、协议勾选和协议文字。主按钮文案固定为“登录”，不得再替换为“账号密码登录”。
+- 320 × 568 时页面允许纵向滚动；不可使用根容器 `overflow: hidden` 截断 v3 底部协议行或系统安全区。
 - 仅作静态设计验证，不代表 uni-app 运行时验收；页面实现后仍须在 Android 320 × 568、360 × 640、360 × 800、412 × 915 上重新验收。

 | 状态 | 触发 | A-01 可见结果 | 去向 |
 | --- | --- | --- | --- |
 | 初始未勾选 | 首次进入 | 两个按钮、注册文字与空复选框 | 留在 A-01 |
 | 未同意协议 | 点击登录、微信登录或注册账号 | 提示“请先阅读并同意相关协议”，不跳转、不改变勾选状态 | 留在 A-01 |
-| 账号密码登录已确认协议 | 点击“账号密码登录” | 结束 A-01 引导 | A-02，默认账号密码登录标签 |
+| 登录已确认协议 | 点击“登录” | 结束 A-01 引导 | A-02，默认账号密码登录标签 |
 | 微信已确认协议 | 点击“微信登录” | 提示“微信登录功能准备中” | 留在 A-01，等待 A-03 设计完成 |
 | 注册已确认协议 | 点击“注册账号”文字 | 提示“注册页面准备中” | 留在 A-01，等待 A-04 设计完成 |

@@ -44,15 +44,13 @@

 | 资产 | 用途 | 来源或生成提示 | 尺寸与验收 |
 | --- | --- | --- | --- |
-| `static/assets/backgrounds/auth-ancestral-header-v1.png` | 独立朱砂家祠头图 | 2026-07-13 内置图像生成：朱砂红、古金家祠线稿、无文字无徽标的浅横幅 | `750 × 196px` PNG；不复用 G-01 背景 |
-| `static/assets/backgrounds/auth-rice-paper-v1.jpg` | 独立暖宣纸底纹 | 2026-07-13 内置图像生成：暖象牙色宣纸、低对比纤维与边缘暗纹、中心留白 | `750 × 1334px` JPG；不复用 G-01 背景 |
-| `static/assets/backgrounds/auth-ink-scenery-v1.png` | 独立淡墨建筑、竹影与山水叠层 | 2026-07-13 内置图像生成：淡灰米色、底部山水亭台、右侧竹影、中心留白 | `750 × 1334px` PNG；不复用 G-01 背景 |
-| `static/assets/icons/auth/login-outline-v1.png` | A-01 登录按钮的线性人物图标 | 项目既有 `static/assets/icons/tab/profile-v4.png` 的本地复用，未改色、未重绘 | `96 × 96px` RGBA PNG；透明角与可见像素审计通过 |
-| `static/assets/icons/auth/wechat-licensed-v1.png` | A-01 微信登录按钮的微信图标 | Icons8 的 `https://img.icons8.com/color/96/weixing.png`，获取日期 2026-07-13；使用条件见 `https://icons8.com/license` | `96 × 96px` RGBA PNG；透明角与可见像素审计通过；免费使用须在应用“关于/设置”及应用商店描述中保留 Icons8 署名链接 |
+| `docs/design/screens/A01-启动登录引导-效果稿-v3-文字注册入口.png` | A-01 当前完整可见视觉源 | 已归档并由用户确认的 v3 效果稿；页面通过本地导入按宽度等比显示 | `852 × 1846px` PNG；当前 A-01 必须直接使用，不重绘拆分元素 |
+| `static/assets/backgrounds/auth-ancestral-header-v1.png`、`auth-rice-paper-v1.jpg`、`auth-ink-scenery-v1.png` | 先前手工分层方案的保留资产 | 2026-07-13 内置图像生成 | 不删除；当前 A-01 不消费，后续页面若使用须另行设计确认 |
+| `static/assets/icons/auth/login-outline-v1.png`、`static/assets/icons/auth/wechat-licensed-v1.png` | 先前手工按钮方案的保留图标 | 登录图标复用项目既有资产；微信图标来源与许可见旧记录 | 不删除；当前 A-01 的图标已包含在 v3 视觉源内；若后续单独使用微信图标，仍须保留 Icons8 署名链接 |

 ## 4. 静态设计验收与剩余缺口

- 静态设计验收已覆盖 320 × 568、360 × 640、360 × 800、412 × 915；四个尺寸均保持两个大按钮与单行文字注册入口。
+- 静态设计验收已覆盖 320 × 568、360 × 640、360 × 800、412 × 915；四个尺寸均保持两个大按钮与单行文字注册入口。A-01 本地页的可见层以当前效果稿 v3 直接显示，防止运行时重新拼装后偏离该验收画面。
 - 归档文件：[320 × 568](screens/A01-启动登录引导-栅格验收-320x568.png)、[360 × 640](screens/A01-启动登录引导-栅格验收-360x640.png)、[360 × 800](screens/A01-启动登录引导-栅格验收-360x800.png)、[412 × 915](screens/A01-启动登录引导-栅格验收-412x915.png)。
 - 此结论只验证设计稿与固定栅格，不替代 uni-app 页面实现后的 Android 运行时验收。
 - 仍未确定《家谱用户协议》与《隐私政策》的最终页面去向及返回路径；在这两页完成设计前，A-01 不得标记为完整设计完成。
@@ -107,3 +107,4 @@ powershell -ExecutionPolicy Bypass -File tests\vue3-entry.ps1
 - 所有后续页面效果图必须先保存到 `docs/design/screens/`，并在对应页面设计记录写明用途、状态和验收缺口；未完成归档不得展示为可推进的设计成果。
 - G-01 已于 2026-07-13 经用户确认结项；当前进入 D2 / A-01 的设计工作，接口、真实登录和 Android 打包仍暂停。
 - A-01 入口页与 A-02 双标签登录页已于 2026-07-13 落地本地 UI：路由入口为 `pages/auth/entry`；只有在 A-01 显式勾选协议后才可进入 A-02。页面不调用接口、不写登录态、不跳转家谱；微信、注册、协议、忘记密码和验证码仅提示待相应页面或能力完成。A-01/A-02 运行时四尺寸验收仍待执行。
+- A-01 首次本地预览与 v3 效果稿存在红头高度、按钮宽度和垂直节奏偏差。现已改为直接使用 `docs/design/screens/A01-启动登录引导-效果稿-v3-文字注册入口.png` 作为可见视觉层，并仅保留透明交互热区；下一次 Android 预览必须以该 v3 截图作同尺寸对比。