凑一局产品系统Vibe Coding

我要开发同款
疯狂小狂风2026年10月14日
3阅读

技术信息

语言技术
CSS、JavaScript、Node.js、小程序
系统类型
小程序轻应用
行业分类
游戏、项目任务
参考价格
4000

作品详情

行业场景

线下娱乐的核心摩擦不是"找不到店",而是"凑不齐人"。(小程序形态,无网页演示;)

成员位可视化 + 「还差 N 人」,一眼看清
报价在发起时冻结,支付后生成核销码,到店核销
状态机区分「招募中 / 已满员 / 进行中 / 已完成 / 已取消」,退出有明确后果
发起时未来 7 天 × 9 时段可选,提交按钮上方实时报价预览

功能介绍

「凑一局」是一款面向线下娱乐的拼场组局小程序,把「发现剧本、选场次、加入拼局、支付、到店核销」做成完整闭环,共七个页面。首页是「今晚的局」,顶部为氛围页头,下方是问候语、搜索入口、题材快捷标签,主体卡片流按时间排出十二小时内开局的局,每张卡一眼可看到剧本名、开局时间、门店、地址、还差几人、人均价格和成员位。本子库支持关键词搜索,命中标题、题材标签与角色名三段,并提供题材、人数、时长、难度四组可组合筛选,每行还直接显示「这本现在可加入几场、最近一场什么时候」,不必点进详情再退出比较。本子详情展示主视觉、标签数值、剧情简介、角色列表与全部可拼场次。拼场详情是核心页面,承担加入、退出、取消、支付、完成、核销六个动作,信息结构为先信息、再凭证、后操作,支付完成后核销凭证升到操作区之前成为视觉主角,操作层收敛为一个主动作加四个次级动作,避免同一动作出现两个入口;页面还有独立的地点模块,无经纬度时按钮变成「复制地址」并明写「未接真实地图」,不做做不到的承诺。发起组局可选剧本与门店,从未来七天选日期、从每天九个时段选时间,两行均可横滑,再设人数区间、人均费用和备注,提交按钮上方始终显示实时报价预览。我的局顶部是「需要我处理」置顶区,把待支付、待核销、进行中的局按紧急度排在最前。我的展示昵称、头像与我发起的局,头像通过微信头像能力获取并持久化,重启后仍在。此外还有四项横切能力:分享(分享一个局,好友点开直接回到那个局)、下拉刷新(三个列表页)、四套差异化确认弹框(按风险分低、中、中高、最高四档,风险用文字标签直接写明,支付档摊开金额,退出档列出两条后果,取消整局要求逐字输入确认词)、以及状态机(局的招募中到已取消、订单的未支付到已核销,界面所有状态均由底层状态派生,不会出现存储与展示不一致)。

项目实现

本项目由我负责产品定义与技术方案,主导从方案冻结到交付验收的全过程,包括需求与范围定义、数据契约与设计规格冻结、模块划分与写域分配、关键设计裁定,以及每轮交付的验收与收口。执行层面采用 AI 协作推进编码,而让这套协作可交付的关键,是我建立的一整套可复跑机械验证体系。

技术栈是纯原生微信小程序,使用 WXML、WXSS、JavaScript 与 JSON,无框架、无 npm、无构建、无外链,导入即可运行;全工程唯一外部素材是六个 tabBar 图标共约七千字节,其余视觉全部由 CSS 与文本实现。

架构上做了三件事:状态单源化,存储层只有三种会话状态与三种订单状态,界面七个展示状态全部由纯函数派生、永不写回存储;数据访问单一入口,统一返回信封结构、绝不把异常抛到页面,且存储调用全工程只出现在一个文件里,换掉它即可接后端;错误分支必须界面可达,明确禁止用 disabled 表达操作被拒绝,被拒时置灰但保留可点击,由数据层给出真实原因。

亮点是自建的验证体系——二十八道静态门、三百九十八条数据层断言、二百四十条门自检,均可原样复跑,退出码严格区分通过、发现缺陷、跑不起来,每条判据都做双向对照;以及设计规格做到可计算,对比度、层级亮度差、令牌一致性、间距网格全部有公式可复算,并含去色口径,确保设计不依赖颜色单独表意。

难点有两个:防误操作的风险分档必须去读数据层真实行为,例如房主点退出实际执行的是取消整局,若按中高风险处理会显示假后果且两次点击即可毁掉整局;以及并发协作下「门全绿」只是某一时刻的结论,因此引入哈希基线,让未声明的改动可被机械检出。项目也明确砍掉了后端、登录、支付与门店经纬度,每条都写明理由并给出将来接入的位置。

示例图片

声明:本文仅代表作者观点,不代表本站立场。如果侵犯到您的合法权益,请联系我们删除侵权资源!如果遇到资源链接失效,请您通过评论或工单的方式通知管理员。未经允许,不得转载,本站所有资源文章禁止商业使用运营!
下载安装【程序员客栈】APP
实时对接需求、及时收发消息、丰富的开放项目需求、随时随地查看项目状态

评论