山东大学软件学院创新实训(四)
日期:2026 年 4 月 20 日—— 5 月 3 日
项目:绘画 AI 博弈小游戏 —— 人机对抗绘画猜词与心理解读系统
一、本期整体进度
本阶段团队正式完成游戏全流程闭环开发,实现从 “选词→绘画→猜词→AI 识别→结算→下一回合” 的全自动稳定运行。前后端联调全部打通,多人联机流畅无卡顿。
本阶段核心成果:
1.后端实现完整回合状态机,事件链稳定驱动,自动结束猜词、防重复提交、防重复触发
2.前端完成撤销系统、移动端触摸适配、坐标精准转换
3.AI 模块升级画风建模,新增玩家记忆机制,让 AI 越玩越准
4.全流程联调通过,所有阶段数据同步、状态一致
5.修复多项高风险 Bug:重复结束、输入框异常、计时器错位、移动端偏移
模块一:游戏回合流程与状态同步(后端核心)
完成游戏全回合时序与事件链开发,由服务端统一驱动状态流转,实现多人联机强一致性、全自动、无卡顿的对局体验。
1. 完整回合时序
设计并实现标准六阶段游戏闭环,所有阶段由后端统一控制:
- 选词阶段(pick_word_phase):画家从候选词中选择绘画目标,其他玩家进入等待状态
- 绘画阶段(round_start):开启实时笔触同步,所有玩家观看画家绘画过程
- 完成绘画(drawing_complete):画家结束绘画并上传图片,服务端启动 AI 识别任务
- 猜词阶段(guessing_phase):玩家提交猜词答案,服务端实时校验正误并更新状态
- 结果阶段(round_result):广播正确答案、AI 猜测结果、玩家猜词记录与得分变化
- 下一回合(next_round):自动轮换画家,重置对局状态,进入新一轮游戏
2. 核心机制
- guessed_users 集合:记录已提交猜词的玩家 ID,防止重复提交、重复计分
- round_ended 状态锁:标记回合是否结束,避免猜词阶段被重复触发、多次结算
- 全局 socketio.emit:解决后台线程、定时器无请求上下文无法发送消息的问题
3. 核心代码
实现 _do_end_guessing 和 _start_new_round 等函数,支撑整局游戏自动流转。
模块二:游戏全流程联调与测试
主要负责前后端联调、数据流追踪、功能验证及 Bug 修复,聚焦游戏全流程的稳定性与一致性,通过多场景测试、多维度验证,确保游戏从选词到结束的每一个环节都能稳定运行、数据同步无误,为玩家提供流畅的联机体验。
1. 完整流程联调
围绕 “选词→绘画→猜词→结果→下一回合→游戏结束” 全链路开展联调,逐环节验证前后端交互逻辑,对每条 Socket 事件、每一个数据字段进行一致性校验,确保后端下发的状态与前端展示完全匹配。同时通过多窗口模拟多玩家联机场景,验证所有玩家的画面同步、阶段切换、数据更新完全一致,无延迟、无错乱。
2. 测试用例全覆盖
设计全面的测试用例,覆盖游戏核心场景与边界情况,确保功能无遗漏:包括画家选词后阶段正常切换、绘画过程笔触实时同步流畅无卡顿、玩家猜词后正确 / 错误反馈及时、所有玩家猜完后系统自动结束猜词阶段、超时场景下正常结束猜词、回合与画家轮换逻辑正确、玩家猜词重复提交被有效屏蔽,以及多局连续运行无异常、数据不丢失。
3. 关键 Bug 修复
针对联调过程中发现的核心问题,逐一排查并修复,保障流程顺畅:
- 猜词完成未自动结束:新增全量提交检测逻辑,实时判断所有非画家玩家是否均已提交猜词,满足条件则自动触发结束流程;
- 输入框 disabled 状态未重置:优化新回合初始化逻辑,强制将猜词输入框恢复为可用状态,避免影响下一轮操作;
- 计时器错位:统一页面计时器 DOM ID,在阶段切换时清理旧计时器、重新初始化,解决计时混乱问题;
- 重复触发 round_result:引入 round_ended 状态锁,标记回合是否已结束,防止重复触发结果广播,避免前端展示错乱。
模块三:Canvas 画板升级(撤销系统 + 移动端适配)
聚焦 Canvas 画板的用户体验优化与跨端适配,重点完成撤销系统开发与移动端触摸交互升级,解决原有画板操作卡顿、移动端适配不佳、行为数据采集不完整等问题,大幅提升绘画流畅度、操作便捷性与跨端一致性,同时完善绘画行为数据采集,为后续心理分析模块提供更全面的数据支撑。
1. 撤销系统(30 步回溯)
基于 Canvas 绘图特性与用户操作习惯,设计并实现支持 30 步回溯的撤销 / 恢复系统,兼顾操作流畅性与数据可追溯性,核心实现逻辑与功能如下:
- 底层实现:采用 Canvas base64 快照栈 机制,玩家每完成一笔绘画操作(松开画笔 / 结束触控),自动将当前画布完整状态转为 base64 编码,存入快照栈中,栈容量上限设为 30 步,超出上限时自动移除最早的快照,确保系统轻量化运行。
- 核心功能:支持「撤销」(回溯至上一步画布状态)、「恢复」(还原至撤销前状态)、「清空画布」(重置画布至初始状态,同时清空快照栈并记录清空操作),操作响应延迟控制在 50ms 内,无卡顿、无画面错乱。
- 数据联动:实时记录玩家每局游戏的撤销次数、撤销间隔、清空次数等操作数据,同步存入行为采集库,为后续心理分析(如绘画犹豫程度、决策果断性)提供精准的数据支撑,实现 “操作即采集” 的无缝联动。
- 体验优化:添加撤销 / 恢复操作反馈(如小图标提示、轻微震动反馈),避免误操作;当达到撤销上限或无操作可撤销时,自动禁用对应按钮,提升用户操作体验。
2. 移动端触摸适配优化
针对移动端(手机、平板)绘画时出现的滚动冲突、坐标偏移、触控延迟等问题,进行全方面适配优化,实现桌面端与移动端绘画体验统一,具体优化内容如下:
- 解决页面滚动冲突:在触摸绘画事件中添加
e.preventDefault()阻止默认页面滚动行为,确保玩家在移动端绘画时,手指滑动仅作用于画布,不触发页面上下滚动,避免绘画操作被干扰。 - 精确坐标映射:针对不同移动端设备(不同屏幕尺寸、像素密度),建立画布坐标与屏幕触摸坐标的映射算法,消除因设备差异导致的绘画偏移、笔触错位问题,确保移动端绘制的笔触位置、大小与桌面端完全一致。
- 触控响应优化:优化触摸事件监听逻辑,采用
touchstart「触摸开始」、touchmove「触摸移动」、touchend「触摸结束」全事件监听,减少事件触发延迟;同时对触摸轨迹进行平滑处理,避免因手指抖动导致的笔触断裂、锯齿问题,实现移动端流畅绘图。 - 跨设备兼容:适配主流移动端浏览器(Chrome、Safari、微信内置浏览器),测试不同设备(手机、平板)的绘画体验,确保触控响应无延迟、笔触精准无偏差,满足多场景使用需求。
3. 升级成果
经过本次升级,Canvas 画板实现桌面端与移动端的全场景适配,整体体验与功能完整性大幅提升,具体成果如下:
- 跨端一致性:桌面端(鼠标绘画)与移动端(触摸绘画)操作逻辑、绘画效果完全统一,笔触精准度、流畅度无差异,玩家可在不同设备间无缝切换对局。
- 操作稳定性:撤销系统运行稳定,30 步回溯无错乱、无卡顿,清空、恢复操作响应及时;移动端触摸无偏移、无滚动干扰,触控响应流畅,满足长时间绘画需求。
- 数据完整性:绘画行为数据(笔触速度、撤销次数、清空次数、绘画时长)采集全面、精准,完全支撑后续心理分析模块的开发需求,实现 “绘画操作→数据采集→心理解读” 的链路闭环。
- 体验提升:整体绘画操作更流畅、便捷,解决了原有画板的核心痛点,提升了玩家的绘画体验与游戏沉浸感,为多人联机绘画、人机博弈提供了稳定的交互基础。
模块四:AI 识别升级 —— 画风建模与游戏记忆
对 AI 模块进行架构级创新规划,设计 让AI 从 “单局识图” 升级为 “学习玩家画风” 的智能对手。
1. 核心创新设计:玩家个性化画风建模
依托前端采集的绘画行为数据,为每位用户建立独立画风特征档案,系统性记录玩家绘画行为习惯,涵盖多维度特征:
起笔位置偏好:统计玩家习惯从画布左上、居中、右下等区域开始作画的分布规律;
笔触绘制速度:区分慢速精细勾勒、快速潦草涂鸦等不同绘画风格;
构图分布区域:记录画面元素集中在局部构图还是全屏散点构图;
有效笔画数量:统计常规作画的笔画总量,区分简约简笔画与复杂细节绘画;
操作撤销频率:记录单次对局内撤销、清空重画的次数,反映绘画犹豫程度;
高频混淆图形归档:整理玩家经常画得相似、容易产生识别歧义的图形类别,建立歧义图库。
所有画风特征结构化存储至数据库,形成永久留存的个人绘画画像,为后续 AI 动态适配提供数据支撑。
2. 对局记忆联动:实现 AI 动态自适应优化
基于构建好的玩家画风档案,设计Prompt 动态拼接机制:
AI 在每次识别绘画时,不再使用固定通用提示词,而是自动读取当前作画玩家的画风数据,将玩家绘画习惯、常见构图特点、易混淆图形等信息嵌入多模态请求 Prompt 中。
通过历史对局记忆叠加画风特征约束,让 AI 能够贴合个人绘画风格进行定向识别,解决简笔画抽象、画风个性化导致的识别不准问题。随着对局场次增加,玩家画风数据不断累积更新,AI 识别准确率持续提升,真正实现越玩越懂、越猜越准的人机博弈体验。
3. 基于 AI 画风能力的新玩法模式拓展思考
限定画具模式:仅开放基础几何图形供玩家创作,用有限表达提升 AI 识别难度,实现约束条件下的人机博弈。
反向猜词模式:玩家与 AI 角色互换,系统逐笔回放历史画作,结合画风建模匹配差异度高的作品提升难度,笔画越少猜对得分越高。
接力绘画模式:两名玩家接力作画,利用画风差异干扰 AI 识别,实现协作对抗 AI 的全新玩法。
二、团队技术架构总结(第 4 阶段)
后端架构
后端采用 Flask + Flask-SocketIO 作为核心技术栈,构建高实时性、强一致性的多人联机服务:
- 长连接通信:基于 WebSocket 全双工通道,实现房间内低延迟广播、事件精准推送;
- 房间状态机:统一管理房间生命周期与回合阶段(waiting/picking/drawing/guessing/result),确保全局状态唯一可信;
- 内存状态缓存:使用
active_rooms存储高频动态数据(回合、画家、队列、计时、猜词记录),大幅提升响应速度; - 全自动回合流转:后端自主驱动选词→绘画→猜词→结算→下一回合全流程,无需前端干预;
- 高可靠保障机制:包含防重复提交、防重复结算、状态锁、超时保护、异常拦截,确保服务不冲突、不卡死、不乱序。
前端架构
前端以稳定交互与实时同步为目标,完成高可用画板与状态同步体系:
- Canvas 高性能画板:支持流畅笔触、颜色 / 粗细切换、橡皮擦、一键清空,运行稳定无卡顿;
- 30 步撤销 / 重做系统:基于快照栈实现,操作可回溯、数据可采集,支持心理分析埋点;
- 全端适配能力:完成桌面端鼠标绘图 + 移动端触摸绘图适配,坐标精准、无偏移、无页面滚动冲突;
- 强同步机制:全程监听后端事件,自动更新界面与游戏阶段。
AI 模块架构
设计新模式:让AI 从基础识图升级为可学习、可进化、可博弈的智能核心
- 玩家画风建模:采集绘画习惯(起笔、速度、构图、撤销频率、混淆图形),生成个人绘画档案;
- 游戏记忆机制:基于历史画风动态优化 Prompt,让 AI 越玩越准、越对局越智能;
- 双模型协同:GLM-4V 负责猜词,DeepSeek 负责画风分析与心理报告,形成完整 AI 能力闭环。
联调架构
前后端 AI 三方完全打通,实现全自动、无阻塞、强一致的联调体系:
- 全流程自动化:从房间创建到游戏结束,无需人工触发,后端自动推进所有环节;
- 事件链路稳定:选词、绘画、猜词、结算、下一回合事件链无丢失、无乱序、无延迟;
- 多人强同步:所有玩家画面、阶段、计时、结果完全一致,无不同步问题;
- 低延迟高流畅:笔触同步、状态切换、结果广播响应迅速,整体体验无阻塞、无卡顿;
- 可测可验可复现:全流程可追踪、可复现、可稳定演示,达到项目验收标准。
三、本周整体总结
本周项目实现从 “功能可用” 到 “完整可玩” 的质变:
- 游戏流程全自动闭环
- 联机同步稳定一致
- 绘画体验大幅提升
- 全流程联调无阻塞、无异常
- 针对用户反馈提出画风建模方案,提出新的玩法思考
AtomGit 是由开放原子开源基金会联合 CSDN 等生态伙伴共同推出的新一代开源与人工智能协作平台。平台坚持“开放、中立、公益”的理念,把代码托管、模型共享、数据集托管、智能体开发体验和算力服务整合在一起,为开发者提供从开发、训练到部署的一站式体验。
更多推荐

所有评论(0)