Files
digital-psychology/.ai/product/feature-spec/cece-frontend-re/complete-design/10-page-home.md
T
jackyu66gitandCursor bd22d9dddd feat: P1 合盘/星座/问答与测测完整设计包及模拟器取证工具
落地 synastry/star/ask API 与 H5 页面,补齐 cece-frontend-re complete-design 证据文档,并加入 Android 模拟器截图抓取脚本。

Co-authored-by: Cursor <cursoragent@cursor.com>
2026-08-03 11:37:53 +08:00

6.2 KiB
Raw Blame History

10 · 首页完整设计

Route: /home · Tab: 首页 · Design Complete


1. 页面目标

  1. 分发工具(宫格)
  2. 推动建档(了解 TA
  3. 消费信息流 / 转化测评与会员
  4. 承接 UGC 玩法广场

2. UI 完整清单(分区)

2.1 顶区 HomeHeader E8

元素 ID 类型 文案/内容 行为
H-HDR-CHECKIN IconBtn 签到 → 签到/每日福利
H-HDR-SEARCH Search 运营占位轮播(例「锐评十二星座」) → 全局搜索
H-HDR-PLUS IconBtn + → 发布/快捷创建(待子页核对)
H-BANNER-TA 「输入生日,更加了解TA」 → 建档 other

2.2 自己卡片 HomeSelfCard E8 · 原「档案条」升格)

元素 行为
标题「自己」+「更多」 更多 → 档案/运势详情
今日心情分数 + 短解读 点卡片进入心情/运势
五维条:爱情 / 财富 / 事业 / 学习 / 人际 展示型;点击进详情(待核)

2.3 宫格 HomeToolGrid E8 真机 10.50.0 定稿)

横向两行可滑宫格(非 3×3):

key 标题 备注
1 1 mbti I人E人
1 2 star_sign 星座
1 3 natal 星盘
1 4 bazi 生辰
1 5 synastry 缘分合盘
1 6 ziwei 紫微 滑出可见
2 7 companion_star 陪伴小星
2 8 confide 倾诉
2 9 wisdom_card 智慧卡
2 10 natal_report 星盘报告 角标 New
2 11 bazi_cal 生辰历
2 12 soulmate 灵魂伴侣 滑出可见

宫格下方运营双卡(非第十格):

key 标题 说明
plaza AI玩法广场 大卡 + 运营副文案
shop_promo 商城运营卡 例:水晶手串
ai_disclaimer 脚注 「部分标题由AI生成,仅供参考」

「更多」入口:在「自己」卡片标题旁 / 工具二级页(见 free2/tools/更多.png);沙盘等未进首屏宫格的工具收入更多页。

2.3.1 「更多」页条目( E8 free2/tools/更多.labels.txt

分组实机可见(不完全等于 UI 分区文案):

条目
内容/玩法 推荐 · 测试 · 心情小镇 · 幸运地图 · 爱情树 · 聊天分析 · 关系网 · 解读 · 沙盘 · 星骰 · 智慧卡 · 日历
命理工具 星盘 · 星盘报告 · 缘分合盘 · 星座 · 生辰 · 生辰历 · 紫微 · 紫微历 · 星宿 · 政余 · 政余历 · 灵数 · 生肖 · 玛雅图腾 · 人类图
社交/商业 倾诉 · 灵魂伴侣 · 商城

2.4 运营位 HomePromo

  • 最多 1 个大 Banner(可关闭,24h 不再展示,本地记录)
  • 配置来自后台 banners

2.5 信息流 HomeFeed

卡片类型 字段 点击
fortune_today 标题、摘要、分数 运势详情
hot_test 封面、标题、人数 测评
expert 达人卡 达人详情
article 封面、标题 文章
video 封面 播放
plaza_hot 应用名、热度 广场应用
ai_entry 文案 → 问

交互:下拉刷新 · 上拉分页(cursor)· 负反馈「不感兴趣」(可选)。

2.6 「更多」二级页 ToolsMorePage

固定收录(可后台排序):爱情树、幸运地图、pick卡、塔罗、八字、紫微、生命数字、姓名分析…
每项:Icon · 标题 · 副标题 · 角标(热/新)。

2.7 AI 玩法广场 PlazaPage

元素 说明
标题区 Slogan:「全民手搓创意——精选应用」
排序 热度 / 最新
AppCard 名、热度、创作者、封面
点击 PlazaAppRuntime
空态 「暂无应用」
审核中 创作者端可见,C 端不可见

3. 交互细则

手势 对象 结果
Tap 宫格 路由跳转,埋点 home_grid_click
Tap 了解 TA 打开建档;未登录先 Auth
LongPress 宫格 D)无菜单,防误触
Pull Feed 刷新
Tap Feed 负反馈 减少同类(需登录)

倾诉点击:弹出 ActionSheet「和 AI 聊」/「找达人」→ ask / online。


4. 状态机

状态 UI
Loading Header 骨架 + 宫格骨架 + Feed 骨架
Ready 全量
FeedEmpty 宫格在,Feed EmptyState
Offline NetworkBanner,缓存宫格可点
Error 全页 Retry
AuthRequired AuthModal
stateDiagram-v2
  [*] --> Loading
  Loading --> Ready
  Loading --> Error
  Ready --> AuthRequired
  Ready --> Offline
  Offline --> Ready
  Error --> Loading

5. 接口契约(本页)

调用时机 API
进入 GET /v1/home/bootstrap → grid_config · banners · profile_summary
Feed GET /v1/home/feed?cursor=
负反馈 POST /v1/home/feed/{id}/dismiss
广场 GET /v1/plaza/apps?sort=heat

home/bootstrap Response(定稿):

{
  "profile_summary": {"id":"","name":"","sun_sign":"","has_birth_time":false},
  "grid": [{"key":"mbti","title":"I人E人","badge":null,"enabled":true}],
  "banners": [{"id":"","image_url":"","link":"","closable":true}],
  "ta_guide_visible": true
}

6. 异常

场景 处理
bootstrap 失败 使用本地默认宫格(写死上表 10 项)+ Error toast
feed 失败 保留宫格,Feed 区 Retry
配置缺宫格 合并默认,不丢星盘/合盘/问相关入口

7. 埋点

home_expose · home_grid_click{key} · home_ta_guide_click · home_feed_click{type} · home_feed_refresh · plaza_open · plaza_app_click


8. 模拟器校验 ID

ID 状态
V-H01 宫格文案与顺序 E8 已按上表改稿
V-H02 了解TA 文案 「输入生日,更加了解TA」
V-H03 广场形态 首页双大卡而非 slogan 条
V-H04 Feed / 达人卡 🟡 采集中 free/home/*
V-H05 更多页条目 🟡 采集中 free/tools/更多*
V-H06 自己卡片五维 爱情财富事业学习人际
V-H07 门禁弹层 未成年 / 每日领取

差分总表:evidence-20260803.md