微信小游戏布局案例：证据、拆解与设计推导
核查日期：2026-10-31。本文与布局研究主文档、设计评审清单配套。七个产品用于比较设计结构，不是榜单、现版评测或效果排名。
1. 案例选择与证据表
优先复用项目内有来源的图，再补充关卡益智案例。选择依据是布局差异和资料可验证程度，不按知名度推断设计质量。一款产品可以属于多个玩法结构；本文选取与当前问题相关的界面片段。
| 案例 | 对应结构 | 来源／资料时间 | 图像性质 | 可分析的范围 |
|---|---|---|---|---|
| 抓大鹅 | 棋盘／消除 | 研发方产品页确认产品类型和微信平台；7k7k 微信专页提供现有图 | 宣传加工图；未确认对应游戏构建版本 | 物件堆叠、暂存槽的表现，不能测量实机按钮大小 |
| 浪漫餐厅 | 棋盘／合成 | 7k7k 微信专页，页面标注 2026-08-31；该日期不作为构建版本证据 | 宣传加工图，证据弱于原生微信实机图 | 网格、订单与装修主题的关系；无法确定原生横竖屏 |
| 蛇它虫 | 关卡益智 | Cocos 团队专访，2019-01-25 | 带微信胶囊的四幅关卡拼图，历史版本 | 关卡内容、规则说明与工具区的空间关系 |
| 寻道大千 | 放置养成 | Cocos 官方案例，2025-02-07 | 界面拼图；其中含社区页面，需分面板判断 | 主循环入口、外观预览、网格、功能入口；不把社区页当局内 HUD |
| 时光杂货店 | 模拟经营 | 同上，2025-02-07 | 微信界面拼图 | 场景、资源与经营管理入口的并置 |
| 动物餐厅 | 模拟经营，对照样本 | Cocos 2019 案例，2019-12-17 | 带微信胶囊的历史单屏界面 | 对象气泡、固定资源与底部导航的分工 |
| 迷雾大陆 | 动作／生存布局参照 | Cocos 官方案例，2025-02-07 | 微信界面拼图，含战斗、技能、开始与职业选择 | 实时战斗空间与局外构筑空间的分离；不据此覆盖所有生存玩法 |
“微信界面”判断结合来源上下文与可见胶囊；它不能确认后台构建版本或当前线上一致性。第三方专页的微信归属说明不能证明宣传图中所有界面都等同于微信原生显示。资料获取日与资料发布日期分别记录，均不等于实机采集日。
1.1 如何读每个案例
每例按五步展开：玩家任务 → 直接观察 → 设计推导 → 改版候选 → 验证缺口。观察只描述图中可见内容；使用“建议”“可能”“假设”的段落是本文推导。动效、操作后果和用户偏好没有从静态图片中得到验证。
图片保留来源原貌，未裁切、未叠加设计标记。图旁分析按拼图从左至右定位；可点击图片查看原尺寸。逐图出处、原始地址、日期和修改状态保存于项目的 static/game-cases/sources.json；原图权利归各自权利人，研究引用不代表获得商业素材授权。
2. 抓大鹅：物件选择与容量反馈
来源与边界：图来自微信小游戏专页，带大面积标题和推广文案。研发方官方产品页确认它包含微信版本、三消玩法及寻找相同物品的任务；本文不把宣传中的通关比例当作统计事实。
玩家任务：辨认物件并进行同类选择，同时留意有限暂存容量。这里关注“选择压力怎样被空间表达”。
| 定位 | 直接观察 | 设计推导 |
|---|---|---|
| 中央容器 | 大量不同形态的物件交叠，部分轮廓被遮挡 | 轮廓、材质和可见面积共同影响辨认；扩大容器不一定改善被遮挡物件的命中 |
| 容器下方 | 可见七个近似等宽的灰色槽位 | 离散槽位可以直接表达剩余容量；是否有额外临时槽需实机验证 |
| 槽位下方 | 能看到道具图标上部和数量，部分内容被推广文案遮住 | 不能据此完整描述道具名称、热区、广告条件或失败弹窗 |
可迁移方法：当容量决定失败风险时，让容量持续可见；物件区、容量反馈与辅助操作形成清楚分区。对视觉接近的物件，在小显示尺寸下测试轮廓识别，不能只在放大的美术稿上比较。
改版候选，非原作评价：假设出现“点了却不知道进了哪个槽”的问题，可以短暂高亮目标槽，并让转移轨迹避开槽位数字；如果出现“底部道具误触”，先检查物件拾取边界与道具热区是否相交，再考虑改位置。不能凭宣传图认定原作存在这些问题。
验证缺口：需要微信指定版本的拾取、满槽、道具使用和失败录像，判断命中、反馈时机与广告状态。当前图片不支持任何关于误触率或通关率的结论。
3. 浪漫餐厅：棋盘产出如何对应订单
来源与边界：来自7k7k 微信专页。这些是拼接、标题加工后的宣传图；横向画幅不能证明微信原生版本就是横屏，图中的位置关系只用于观察任务如何被表达。
玩家任务：在物品空间内识别、组织产出，将其对应到订单；装修场景再呈现经营成果。具体合成规则和订单提交行为尚未实机核对。
| 定位 | 直接观察 | 设计推导 |
|---|---|---|
| 棋盘网格 | 物品采用近似统一单元，部分有绿色底和勾选标记 | 统一单元便于比较；可提交或选中状态若只靠绿色会有辨认风险，勾选有补充作用 |
| 右侧订单 | 顾客头像、目标物品和奖励数字被放在同一区块 | 目标和收益相邻有助于对照；若订单太多，滚动与当前订单定位需要规则 |
| 底部进度 | 进度条显示 8/10，并伴随奖励形象 | 数值和进度形态共同表达状态；无法从单图判断计数含义与发奖条件 |
| 装修宣传图 | 底部出现选择卡片，上方是场景呈现 | 选择与预览的空间关系值得借鉴，但不能据此推定确认、取消和购买逻辑 |
可迁移方法：让玩家从目标反查物品，也能从物品理解它服务哪个目标；未匹配、可提交、已提交需要不同状态。合成链的相近等级可以通过轮廓、容器和附加标记区分，而不是全部依靠色彩渐变。
改版候选：若竖屏容纳不下完整订单区，可比较“上方单张重点订单＋可展开订单列表”和“横向订单带”两种结构。前者减少常驻占用，后者便于横向比较；测量完成指定订单时的来回查看次数与错误选择，而不是只比较哪张稿更清爽。
验证缺口：原生窗口方向、棋盘实际行列、拖拽方式、订单滚动、能量耗尽、满格和装修取消。示意中的横向并置不能作为微信版尺寸测量样本。
4. 蛇它虫：完整局面与工具区分离
来源与边界：Cocos 团队专访，2019-01-25；对应原图。这是历史版本，不代表现版是否仍可访问。文章确认其微信创意小游戏背景；图中四个面板均可见微信胶囊。
玩家任务：理解不同对象的规则，在有限局面内规划移动。专访介绍其结合贪吃蛇与推箱子机制；本文仅分析静态界面的信息分布。
| 定位 | 直接观察 | 设计推导 |
|---|---|---|
| 面板上部 | 关卡数字较大，胶囊位于右上；数字与谜题之间有留白 | 将进度身份与解题空间分开；留白可以用于不同形状的关卡，但不能自动视为浪费 |
| 四个中央区域 | 谜题外形和对象密度不同，均完整放在各自画幅中 | 保护整体关系可以支持全局推演；更复杂局面是否仍完整可见，需要其他关卡证据 |
| 谜题下方 | 两行规则文字与底部工具图标分开 | 规则阅读与步骤操作有各自区域；图标具体行为仍要交互确认 |
| 画幅两侧 | 可见独立推广入口，部分与关卡区域相邻 | 历史益智界面也可能有外围入口；低密度主体不等于没有注意力竞争 |
可迁移方法：关卡边界、可移动对象与规则文字应有明确视觉分工。不同形状关卡可以在统一容器内居中，不要求每关填满容器；布局稳定与全图可见可能比“充分利用每个像素”更重要。
改版候选：对完全掌握规则的玩家，可比较“常驻规则文字”与“简短规则＋按需展开”两种方式。收起文字释放空间，却增加忘记规则时的查询操作；应按新手与回访玩家分别验证。底部图标若需要长期记忆，可测试文字提示对寻找时间的影响。
验证缺口：底部图标的真实含义、撤回边界、重试后果、长关卡、最短支持屏幕及提示操作。本研究不把可见图标直接命名为已经确认的具体功能。
5. 寻道大千：主循环与多系统成长
来源与边界：Cocos 2025 年官方案例。以图内可见面板为观察单位；第三幅社区信息流不能被当成游戏主场景的布局或证据。
玩家任务：在重复核心动作与装备、外观等成长系统之间切换。本例关注“怎样维持主循环方向感”，不尝试还原完整养成体系。
| 面板 | 直接观察 | 设计推导 |
|---|---|---|
| 第一幅上部 | 资源读数和多排功能／活动图标围绕场景上方分布，多个图标带角标 | 入口数量与提示会竞争注意力；不能仅凭数量确定原作用户感到拥挤 |
| 第一幅中下部 | 角色与树构成显著场景，下方有装备网格，底栏中央动作按钮较突出 | 场景表现、物品与动作形成垂直关系；突出动作可维持循环焦点 |
| 第二、第四幅 | 大形象预览在上，网格条目在下，并显示激活／解锁操作 | “选项—预览—条件—操作”可构成完整的局部决策单元 |
可迁移方法：主场景承载重复动作，详情页承载比较；不必把所有成长条件常驻主屏。网格选中、预览对象和操作对象需要始终对应，离开后回到原位置，能减少重复寻找。
改版候选：若用户测试发现“进入活动后忘记刚才要升级什么”，可测试保留原选中项与滚动位置；若入口寻找时间长，可比较固定分组和全量常驻两种方案。收纳方案需要同时观察被收纳功能是否更难被发现。
验证缺口：新手与长期玩家的入口差异、红点的真实含义、不同活动期间的布局、升级不足与返回。本文没有证据宣称某种入口数量能提高或降低收入。
6. 时光杂货店与动物餐厅：经营场景的两种信息表达
6.1 时光杂货店：场景与管理面板
来源：Cocos 2025 年官方案例。观察到建筑、角色和场景细节，与屏幕资源、功能和人物相关信息并置；拼图能展示多个视图，不能证明它们同时出现在一个屏幕。
设计推导：经营布局至少有两个坐标体系——跟随场景移动的对象，以及固定于屏幕的总资源与管理入口。进入某个对象的管理视图时，应说明自己正在管理谁、消耗什么、完成后返回哪里。
改版候选：假设多建筑同时可升级，先测试“场景状态标记＋选中后详情”，再与“所有成本常驻场景”的方案比较。前者减少遮挡，后者减少点开次数；需要同时记录找到目标建筑与完成升级的表现。
6.2 动物餐厅：气泡把任务放到对象旁
来源：Cocos 2019 年案例，2019-12-17。文章明确指向微信内体验；图片右上可见胶囊。这里仅分析历史版本，不据它描述现版。
直接观察：左上两种资源以固定底板展示；顾客旁有食物气泡；场景中央占据主要空间；左右边缘有方向形态入口；底部包含菜单、任务、宣传等带文字的操作。
设计推导：气泡让“谁需要什么”保留对象关联，固定读数负责全局状态，底栏负责系统级操作。这三种信息没有被强迫塞进同一种按钮容器。场景仍有较多可见地面，图形对比相对突出；是否足以支撑高峰任务密度需要动态证据。
改版候选：当顾客变多时，比较气泡错位、按选择显示、聚合订单三种方法。错位保持一眼看到各自任务，但连线或距离过大可能破坏对应；聚合节省空间，却增加从列表回到顾客的成本。
6.3 两个经营样本能说明什么
它们共同支持一个观察方向：经营界面往往需要协调场景对象与屏幕管理信息；不能由两个产品推导整个品类的统计规律，也不能用 2019 与 2025 的图片宣称行业密度变化趋势。
进一步验证时，应保持任务一致，例如“找到一个等待处理的顾客并完成服务”或“升级指定建筑”。不能用经营场景的入口数与另一个产品详情页的入口数直接比较优劣。
7. 迷雾大陆：实时危险与局外构筑分开
来源与边界：Cocos 2025 年官方案例。它是动作 ARPG 样本，用于讨论动作／生存结构的实时空间约束，不把两类玩法当作完全相同。
| 面板 | 直接观察 | 设计推导 |
|---|---|---|
| 第一幅 | 技能节点通过连线组织，下方有条目和关闭形态入口 | 构筑决策需要展示前置关系；它比一排技能图标更能表达结构，但需要处理缩放和状态差异 |
| 第三幅 | 角色周围呈现场景与敌人；上方有小地图，下部出现圆形操控形态区域和功能入口 | 视野与操控并存；静态图不能确定操控区是固定、浮动还是仅为触点反馈 |
| 第四幅 | 职业大预览、多个职业选项、说明和“开启冒险”操作构成独立选择界面 | 将慢速阅读与战斗操作分开，可以释放局内注意力；切换与返回仍需验证 |
可迁移方法：把不需要实时处理的复杂比较放到安全节点；在实时界面保留足以支持反应的读数。敌人来向、角色状态和手指遮挡应一起评审，不能只画 HUD 对齐线。
改版候选：若出现“操控时看不见脚下危险”，比较移动操控区、调整相机目标位置或提高危险提示层级。三者会分别影响肌肉记忆、世界空间感和提示噪声，需要真实战斗片段；不能凭单张图决定应把摇杆放在哪里。
验证缺口：触点轨迹、满特效战斗、技能选择是否暂停、关闭面板后的恢复、微信切后台及广告返回。没有上述证据，不估算反应时间、帧率或死亡率。
8. 跨案例比较：把规律转化为可验证假设
| 比较维度 | 观察与推导 | 设计假设 | 怎样检验 |
|---|---|---|---|
| 目标与操作距离 | 棋盘需要对照订单，养成需要对照收益 | 让必要信息更接近当前操作，可以减少反复寻找 | 用相同任务比较查看次数、寻找时间及理解错误 |
| 完整局面与扩展规模 | 蛇它虫样图保留完整谜题，经营可有局部场景 | 需要全局推演的玩法更依赖整体可见 | 比较完整视图与可平移视图的任务理解，记录遗漏线索 |
| 对象附着与固定 HUD | 动物餐厅气泡与资源使用不同位置体系 | 对象任务附着、全局资源固定，可能减少对象对应错误 | 增加场景密度，记录选错对象和遮挡冲突 |
| 常驻与按需显示 | 成长入口和战斗构筑需要不同信息量 | 把低频比较移到局外可减少局内干扰 | 同时记录局内表现与局外功能发现率 |
| 视觉面积与触摸空间 | 宣传图和拼图均不能直接测真实热区 | 只有在实际显示尺寸中才能判断热区是否可靠 | 指定设备、窗口和构建版本，记录触摸点与命中结果 |
这些是假设，本文没有预设改善百分比。某个布局在一类任务中更快，也可能使另一类任务更难。每次改版明确主要目标和需要保住的次要指标，避免把“更清爽”当作所有体验都更好的证据。
9. 下一轮实机采集表
本轮已完成公开资料和静态原图研究；以下是补强证据的工作模板，未伪装为已完成的测试。采集应使用有权访问的微信版本，不混入同名其他平台版本。
| 字段 | 记录要求 |
|---|---|
| 身份与环境 | 产品名称、开发者／主体、可见版本或构建信息；不可取得时写未确认；日期、设备、系统、微信版本、方向 |
| 画面尺寸 | 原始截图宽高、当前窗口、安全边界与胶囊位置的获取方式；截图像素与逻辑单位分别记录 |
| 用户阶段 | 新用户／回访、进度、已解锁系统、活动状态；避免把不同阶段截图当同一状态比较 |
| 任务流程 | 进入 → 主界面 → 准备 → 核心操作 → 成功／失败 → 成长 → 返回；省略或不适用的节点注明原因 |
| 压力状态 | 资源最大显示、满格、长文案、密集对象、最低支持窗口、多个提示同时出现 |
| 中断状态 | 暂停、微信前后台切换、广告完成／中断／无填充、网络失败与恢复；记录返回时保留的上下文 |
| 证据定位 | 原图／录像文件名、未加工原件、时间戳、面板或帧位置、来源与允许的使用范围 |
每个发现附“事实—问题—候选调整—验证方法”。示例：“同一任务中三次点错相邻入口”是观察；“热区太近”仍需排查；“加大间距”是方案；在同类设备、任务下重新记录误触才形成验证。
10. 阅读与使用
设计新界面时，先用主文档中的五类原型定位主要约束，再选择本篇对应案例；改版时直接带着评审清单检查指定流程。既有产品案例目录讨论更多玩法与实现成本，本篇补充设计层面的证据拆解，两者口径不同，数量不合并计算。