# 用户旅程与设计规范 round6(Leader 草案,待用户验收方向后执行) ## 0. 诊断 round5 "乱" 根源:功能堆叠无信息层级,无 spacing/typography 规范,每屏同时回答太多问题。 ## 1. 登录旅程主线(每屏只回答一个问题) 1. **登录页** → 唯一任务:进入。邮箱+密码+主按钮,无其他链接噪音。 2. **我的项目(首页)** → 唯一任务:选一个项目。首屏只放「新建项目」+ 项目卡列表(名称/最近回测/一句话状态 badge),顶部一行问候+指标摘要(不做成 4 张大卡,做成一行小字)。 3. **项目内(三 Tab)**:数据 → 策略 → 回测 → 结果,Tab 栏保持,页首面包屑一行。 - **数据 Tab**:数据集卡列表;主 CTA「接入数据」。 - **策略 Tab**:当前策略版本详情为主视图,右侧/下方历史版本 Table;主 CTA「AI 改进」。 - **回测 Tab**:参数表单(Capital/Commission/Slippage + 数据集/策略版本 Select)置顶 + 「开始回测」大按钮;历史回测 Table 下方。 - **结果 Tab**:**首屏只回答三个问题**:投入多少 / 现在值多少 / 赚亏多少(capital-reporting 三卡,大字);第二屏才是图表;第三屏交易明细 Table(分页)。 4. **数据集 / 实验记录 / 我的**(TabBar 保留):维持现状卡片列表,统一 Card 规范。 ## 2. 统一 token(tailwind 直接写死用法,写进 mobileCss 守门测试) - spacing:卡片内 `p-4`,卡片外间距一律 `gap-4`(375) /`gap-6`(768+);**禁止 gap-2/gap-3 出现在顶级容器** - 字级:页题 `text-lg font-semibold`,卡题 `text-sm font-medium`,指标数字 `text-2xl font-bold tabular-nums`,辅文 `text-xs text-muted-foreground`;**禁止任意其它字号 token(text-xs/lg/2xl/xl 之外)** - 颜色:语义色只允许 `text-primary / text-destructive / text-muted-foreground / bg-background / bg-card`;禁止 tailwind 原色调(slate/blue/green 等) - 圆角/边框:一律走组件默认(Card/ Button 自带),页面不写 rounded-* - 空态/加载/失败:每屏必写三态(Skeleton / Alert destructive / 空文案 + CTA),由数据层统一返回 state ## 3. 验收硬标准(round6 hire-level) - svelte-check 0 error;vitest 全绿(更新 mobileCss 守门 token 白名单) - 真浏览器 probe:登录→项目→数据→策略→回测→结果 全旅程 1 次每步无 pageError,375/768/1440 截图落 artifacts/ui-round6/ - 我(Leader)亲自 vision/像素抽检 4 屏:登录页/项目列表/结果页三卡/ TabBar 在 375 不得溢出 ## 4. 不做清单(保持克制) - 不改主题色、不加暗色切换、不加亿级动画;priori 保持 b6t6C6CTw preset 原样 - 不新增页面、不合并账户/管理员入口、不改后端 API