案例概览
项目背景
XPODIUM 是一个以综合体能赛事为核心、同时经营线下合作场馆的健身运动品牌。赛事季有大量选手需要完成报名、组队、缴费与成绩查询;平日里场馆要处理会员卡销售、团课与私教排期、教练管理。两条业务线节奏完全不同,此前报名靠表格收集、约课依赖微信群接龙,赛季高峰期运营人力吃紧,会员与订单数据也难以沉淀。
信诚峰创承接该项目后,把赛事与场馆两条业务线搬进同一套小程序系统:会员一个入口完成买卡、约课、参赛,运营方一个后台管全流程。
解决方案:三端一底座
系统采用「三端一底座」结构:会员端小程序、教练端「明星计划」、运营管理后台三个前端,共用一套会员账户与支付底座,赛事与场馆业务在同一套账户体系上运转。
- 会员端小程序:注册与体测资料、赛事报名、场馆浏览、会员卡购买、课程预约、个人中心
- 教练端「明星计划」:学员管理、训练计划制定与下发、成绩上传、积分与学员订单
- 运营管理后台:赛事与团队管理、订单支付流水与退费、门店课务、会员账号治理
- 业务底座:统一会员账户(含多人共用邮箱的账号映射规则)、微信支付 V3 支付中心、赛事与场馆两套数据模型
设计语言:暗色竞技运动风
整套界面围绕「训练场」的沉浸感展开:深色底营造健身房灯光下的专注氛围,单一品牌紫驱动全部关键操作,金色只用于会员权益与荣誉表达,让用户在任何页面都能第一时间识别「哪里可以点、哪里是重点」。信诚峰创设计团队把这套视觉沉淀为可复用的设计 token,后续新增卡种、新增页面直接取用组件,不再从零画起。
色彩体系
| Token | 色值 | 用途 |
|---|---|---|
| 品牌紫 | #7C50D0(渐变 #8058D8 → #6840C0) | 主按钮、选中态、进度与高亮,全站唯一操作强调色 |
| 深空底 | #1C1D2C | 全局页面背景,承载训练场景的沉浸氛围 |
| 暗紫卡面 | #39395B | 卡片、弹层与功能分区表面 |
| 竞技金 | #F0C050 | 会员卡徽章、权益与荣誉表达,不做操作色 |
| 动力绿 | #10D090 | 支付成功、开通成功等正向反馈 |
| 极浅文字 | #E7E6EA / 次级半透明浅灰 | 两级文字层级,保证深色底上的可读性 |
版式与组件规范
- 字阶:展示级训练数字、页面标题、卡片标题、正文、辅助说明五级字号,数字用加宽字距突出数据感
- 栅格:8pt 间距体系,页面左右 16pt 安全边距,卡片圆角 12–16px、弹层 24px、按钮全圆角胶囊
- 组件库:主/次/文字三级按钮、底部动作弹层、列表项、状态徽章(可约 / 已满 / 排队 / 已购)、周历时间轴选课器、会员卡卡面
- 状态设计:预约、报名、支付等关键界面的默认、置灰、已满、排队、审核拒绝五种状态均有对应设计稿
- 多端一致:会员端与教练端共用同一套 token 与组件,教练工作台与会员界面一眼可辨为同一品牌
功能模块与设计稿
以下为各业务域的高保真设计稿节选,点击「查看完整设计板」可浏览该模块全流程界面。
账号与体测资料
手机号验证码注册登录,资料除基本信息外收录身高、体重、上下装尺码、鞋码等体测字段,既用于赛事服发放,也作为教练制定训练计划的依据。
查看完整设计板 →
赛事中心:组队 · 报名 · 成绩
赛事按「列表 → 详情 → 选分组 → 组队 → 支付」完成。支持团队赛与个人赛:团队赛由队长建队拉队员,个人赛下单即自动完成报名;成绩按队伍上传,排行榜按分组实时生成。
查看完整设计板 →
合作场馆与会员卡商城
会员按城市切换门店,查看营业时间、地址电话、相册与教练团队;会员卡按「次卡 / 期限卡」两类建模,团课卡、自助卡均为参数组合,新增卡种无需改代码。
查看完整设计板 →
课程预约:团课与私教
团课与私教共用「教练 × 时段」排期模型:选门店、选课程类型、挑教练、在周历上点时段。满员可转排队;持会员卡预约直接核销次数,散客可单次购买。
查看完整设计板 →
个人中心
「我的」按业务线分区:预约记录、我的会员卡、我的订单、训练计划、赛事服务、场馆服务、入会协议与合同在同一页面全部可达。
查看完整设计板 →
教练端「明星计划」
教练的学员管理、训练计划、成绩上传与积分搬进手机:上课即打卡、课后即可更新训练计划,学员在会员端同步可见,形成教与练的双向闭环。
查看完整设计板 →
运营管理后台
后台沿用成熟权限模型二次开发:赛事、分组、团队与成绩管理;报名费、会员卡、课程订单统一流水并与微信侧对账;门店信息、教练档案、课程排期与会员卡商品统一维护。
适用角色
系统围绕四类角色设计,各角色在同一套账户体系下使用不同功能面,权限边界清晰。
买卡、约课、报名赛事、组队参赛、查成绩与个人训练数据。
管理学员、下发训练计划、上传成绩、积累积分。
维护门店与教练信息、排课与会员卡商品、处理预约变动。
掌管赛事配置、订单流水与退费处理、账号管理。
| 功能域 | 会员 / 选手 | 教练 | 场馆运营 | 平台管理员 |
|---|---|---|---|---|
| 注册登录与资料 | 主用户 | 同账户体系 | 后台维护 | 账号治理 |
| 赛事报名与组队 | 报名 / 建队 / 缴费 | 成绩上传 | 名单核对 | 分组与名额配置 |
| 会员卡商城 | 浏览 / 购买 / 续费 | — | 商品上下架 | 价格与规则配置 |
| 课程预约 | 约课 / 取消 / 排队 | 排期与上课 | 排期维护 | 规则配置 |
| 订单支付与退费 | 支付 / 查单 | — | 门店订单 | 流水对账 / 退费处理 |
关键技术
- 微信支付 V3 与对账:公钥模式验签,下单、回调、查询全链路;退款遵循「先完成微信侧退款、再更新系统状态」,避免状态错位
- 报名 · 组队 · 参赛三链路解耦:报名记录、队伍成员关系、成绩上传资格分属三类实体独立校验,防止重复占名额与退费后换人再报
- 多人共用邮箱的账号映射:以「同邮箱 + 角色后缀」规则区分队长与队员,登录账号唯一、密码各自独立,后台保留人工核查入口
- 账号与数据安全:密码 BCrypt 单向加密存储,敏感操作遵循「先备份 → 事务写入 → 逐项验证 → 记档」流程
项目成果
平台于 2026 年 7 月正式上线,会员端、教练端与管理后台同步投入运营,支撑 XPODIUM 赛事、场馆、会员三条业务线在同一套系统中运转。报名从表格收集转为线上组队与支付,会员卡销售与课程预约实现会员自助,教练服务过程数字化留痕;信诚峰创同步交付数据库结构说明、账号与备份流程,保障客户团队自主运营。
信诚峰创