Genarrative/docs/design/PLATFORM_HOME_MOBILE_FEED_CARD_REDESIGN_2026-04-28.md

平台首页移动端信息流与作品卡设计

更新时间：2026-04-28

1. 本次目标

1. 桌面端首页布局保持现有顶部栏、侧边导航、Hero、趋势区与下方网格结构，不调整桌面端区块顺序。
2. 移动端首页改为参考图式信息流：顶部搜索框、横向频道 Tab、纵向作品列表、底部主导航。
3. 双端公开作品卡统一结构：上方 16:9 封面图，下方作品名称、作者信息、作品描述与玩法类型。
4. 点赞数必须来自作品读模型字段，前端只负责展示，不把游玩数或评分临时改名成点赞。

2. 数据契约

2.1 统一字段

公开作品卡和创作中心复用的作品摘要都增加：

likeCount: number;

当前阶段只做只读展示，不新增点赞按钮和点击 reducer。后端对尚未接入真实点赞表的作品返回 0，保证接口 shape 稳定，后续可无 UI 结构迁移地接入真实互动计数。

2.2 各玩法映射

1. RPG 公开广场：CustomWorldLibraryEntry 与 CustomWorldGalleryCard 返回 likeCount，当前由 Rust facade 返回 0。
2. 拼图公开广场：PuzzleWorkSummary 返回 likeCount，当前由 Rust facade 返回 0，playCount 继续仅表示游玩次数。
3. 大鱼公开广场：BigFishWorkSummary 返回 likeCount，当前由 Rust facade 返回 0，playCount 继续仅表示游玩次数。
4. 前端聚合类型 PlatformPublicGalleryCard 透传 likeCount，WorldCard 不再依赖 badge/metaLabel 决定主要信息结构。

2.3 首页读链路核对

首页公开作品流的读取链路固定为：

RpgEntryHomeView
→ platformPublicGalleryClient / puzzleGalleryClient / bigFishGalleryClient
→ Rust api-server
→ spacetime-client 生成绑定
→ spacetime-module procedure
→ SpacetimeDB 表

1. 公开读取必须匿名可用，前端 GET 列表与详情统一传 skipAuth: true、skipRefresh: true，避免未登录首页被刷新 token 链路阻断。
2. 拼图公开广场走 list_puzzle_gallery / get_puzzle_gallery_detail，返回 coverImageSrc、summary、themeTags、playCount、remixCount、likeCount。
3. 大鱼公开广场走 list_big_fish_works(published_only=true)；由于部分已部署模块会在公开列表分支前仍校验 owner_user_id 非空，客户端与模块内部公共列表输入都使用 public-big-fish-gallery 占位 owner。该字段在 published_only 分支不参与筛选，只用于兼容旧校验。
4. 自定义世界公开广场走 list_custom_world_gallery_entries，当前主云数据为空时应返回成功空列表，而不是错误态。

2.4 作者头像读取策略

1. 首页“推荐”和“今日游戏”作品卡不把 avatarUrl 固化到作品读模型里，避免作者修改头像后旧作品卡继续展示过期头像。
2. 前端首页在聚合公开作品后，按作品摘要中的 authorPublicUserCode 优先读取公开用户摘要；没有公开用户码的玩法摘要，使用 ownerUserId 读取公开用户摘要。
3. 作者头像查询必须走匿名公开接口，并在首页组件内按作者维度缓存；单个作者在推荐与今日游戏中重复出现时不能重复请求。
4. 公开用户摘要返回 avatarUrl 时，作品卡展示真实头像；头像缺失、读取失败或作者身份字段缺失时，继续使用作者昵称首字占位。

3. 移动端布局

1. 移动端首页只在 RpgEntryHomeView 的 mobile content 内重排。
2. 第一屏顺序：
   • 搜索框
   • 频道横滑 Tab：推荐、今日游戏、游戏分类、PC游戏、即点即玩
   • 作品信息流
3. 作品信息流使用单列纵向列表，卡片宽度填满容器，卡片之间保留短间距。
4. 不新增功能说明类长文案；空态仍沿用现有短状态文案。
5. 移动端卡片视觉允许接近参考图的深色信息流，但仍走平台主题 token，避免写死不可维护的大面积色块。

4. 作品卡结构

每张公开作品卡固定为：

1. 封面区域：aspect-ratio: 16 / 9，图片 object-cover；无封面时使用轻量主题底。
2. 封面左上角不展示“推荐”标签，也不展示作者昵称标签，避免遮挡作品主视觉。
3. 封面右下角展示三项轻量指标：游玩、改造、点赞；统一为图标 + 紧凑数字，例如 128、1.2万，不写额外说明长文案。
4. 信息区域：
   • 第一行：作品名称，右侧展示玩法类型。拼图玩法展示“拼图”，大鱼玩法展示“大鱼”，RPG 作品展示题材短标签。
   • 第二行：原副标题位置展示作者头像和昵称。当前公开列表只返回作者昵称时，头像使用昵称首字生成的轻量头像；后续接入作者头像 URL 后复用同一位置。
   • 第三行：作品描述，两行截断。
   • 第四行：最多三个标签。
5. 点赞数仍必须来自作品读模型字段，只是展示位置从信息区右侧迁移到封面右下角。
6. 不展示作品号；作品号仍只在详情页或分享路径中使用。

5. 验收

1. 390px 移动端首页不横向溢出，能看到搜索、频道和纵向作品列表。
2. 桌面端首页布局区块顺序不变，只替换公开作品卡内部结构。
3. RPG、拼图、大鱼三类公开作品卡都有 likeCount 字段，前端聚合后能统一展示。
4. 运行编码检查、前端定向测试和必要的 Rust 检查。
5. HTTP 验收需覆盖：
   • GET /api/runtime/custom-world-gallery 成功返回 entries。
   • GET /api/runtime/puzzle/gallery 成功返回 items 且包含 likeCount。
   • GET /api/runtime/big-fish/gallery 成功返回 items，旧部署模块不再因 big_fish.owner_user_id 不能为空 阻断首页。