6.2 KiB
6.2 KiB
语言粒子系统 - Unity实现
概述
这是一个基于P5.js原型的语言粒子互动系统,在Unity中复现。系统通过文字粒子的连接和交互,表现情绪的传播与平复过程。
文件结构
Language/
├── LanguageParticleSystem_Summary.md # 效果总结文档
├── README.md # 使用说明(本文件)
├── TextParticle.cs # 文字粒子基类
├── FloatingTextParticle.cs # 背景浮动文字粒子
├── CandidateParticle.cs # 可交互候选粒子
├── WaveformPoint.cs # 波形点数据
├── EffectPropagation.cs # 效果传播系统
├── ConnectionRenderer.cs # 连接线渲染器
├── WaveformRenderer.cs # 波形渲染器
└── LanguageParticleManager.cs # 主管理器
使用步骤
1. 场景设置
- 创建一个空GameObject,命名为"LanguageParticleSystem"
- 添加
LanguageParticleManager组件
2. Canvas设置
系统会自动创建一个10x10的World Space Canvas,也可以手动配置:
- 创建Canvas(Render Mode: World Space)
- 设置Canvas尺寸为10x10
- 将Canvas拖到Manager的
worldCanvas字段
3. 参数配置
在Inspector中调整以下参数:
Canvas设置
- Canvas Size: Canvas大小(默认10)
- Text Margin: 文字区域边距(默认1)
粒子数量
- Floating Count: 背景浮动文字数量(默认100)
- Candidate Count: 候选粒子数量(默认50)
- Red Particle Count: 红色目标粒子数量(默认8)
游戏参数
- Connection Distance: 连接距离阈值(默认2,Unity单位)
- Target Sentence: 目标句子(默认"别过来我感觉害怕")
波形参数
- Waveform Amplitude: 波形振幅(默认0.3)
- Interaction Radius: 交互半径(默认0.5)
4. 依赖项
确保项目中已安装以下插件:
- TextMeshPro: Unity内置,用于中文文字渲染
- DOTween: 用于动画效果
- Shapes: 用于绘制连接线和波形
5. 运行
点击Play即可运行。系统会自动:
- 生成背景浮动文字
- 生成候选粒子
- 随机选择8个红色目标粒子
游戏玩法
第一阶段:连接红色粒子
目标:让所有红色粒子连接成一个整体,且与蓝色粒子分离
交互:
- 左键点击:产生排斥波,推开附近粒子
- 右键点击:产生涟漪,吸引附近粒子
机制:
- 红色粒子与蓝色粒子接触时,效果会传播(蓝色→橙色)
- 效果可以链式传播(最多8步)
- 橙色粒子字符变化加速,带有振动和光晕效果
第二阶段:文字揭示
完成第一阶段后:
- 红色粒子自动排列成水平一行
- 蓝色粒子淡出
- 红色粒子逐个揭示目标文字:"别过来我感觉害怕"
- 文字出现剧烈抖动(焦虑效果)
第三阶段:波形交互
文字显示完成后:
- 文字下方出现异常波形(基于Perlin噪声)
- 文字随波形剧烈抖动和漂浮
- 目标:通过鼠标抚平波形,平复文字的焦虑
交互:
- 按住鼠标左键并拖动,抚平附近的波形
- 波形有"抵抗力",需要持续按住(0.5-1.5秒)
- 拖动速度越快,抚平效果越强
效果:
- 波形从红色异常噪波→蓝色规律正弦波
- 文字抖动和漂浮逐渐减弱
- 波形完全稳定后,文字开始消散
- 所有文字消散后,游戏自动重置
技术要点
1. 粒子系统
- 使用TextMeshPro渲染中文字符
- 粒子具有速度、边界检测、相互排斥
- 字符定期随机变化
2. 连接检测
- 使用空间距离判断粒子间连接
- 连接关系存储在
connections列表中 - 用于效果传播和完成条件判断
3. 效果传播
- 红色粒子与蓝色粒子建立新连接时触发
- 使用队列实现链式传播
- 脉冲动画沿连接线移动
4. 波形系统
- 使用Perlin噪声生成异常波形(多层噪声叠加)
- 每个波形点关联一个文字粒子
- 波形点有独立的抚平进度和抵抗力
- 抚平后波形变为规律正弦波
5. 渲染系统
- 使用Shapes的ImmediateModeShapeDrawer
- 连接线:实时绘制粒子间连线
- 波形:使用Polyline绘制平滑曲线
- 效果:脉冲光点、箭头、进度环
性能优化建议
- 对象池:粒子频繁创建销毁时使用对象池
- 空间分区:粒子数量超过100时考虑Grid分区
- LOD:远距离粒子降低更新频率
- 批量绘制:Shapes已支持批量绘制
- 异步处理:连接检测可使用Job System
自定义扩展
添加新的文字内容
修改CandidateParticle.cs中的字符集:
protected static string chineseChars = "你的字符集...";
protected static string[] chineseWords = { "词组1", "词组2", ... };
修改目标句子
在Manager的Inspector中修改Target Sentence字段
调整波形特性
修改WaveformPoint.cs中的噪声参数:
noiseScale1 = 0.05f; // 低频噪声
noiseScale2 = 0.15f; // 中频噪声
noiseScale3 = 0.4f; // 高频噪声
添加音效
在以下关键事件添加音效:
TriggerEffectPropagation(): 效果传播时StartCompletionSequence(): 完成第一阶段时WaveformPoint.Update(): 波形抚平时(calmAmount >= 0.95f)ResetGame(): 游戏重置时
调试技巧
- 显示连接关系:在Scene视图中观察连接线
- 波形可视化:查看波形点的
calmAmount值 - 粒子状态:在Inspector中实时查看粒子的
isRed、isOrange等状态 - 帧率监控:粒子数量过多时注意帧率
常见问题
Q: 文字显示为方块?
A: 确保使用支持中文的字体,并在TextMeshPro Font Asset中生成中文字符
Q: 连接线不显示?
A: 检查Shapes插件是否正确安装,Camera是否正确配置
Q: 波形交互没反应?
A: 检查鼠标世界坐标转换是否正确,确保Camera能看到粒子
Q: 性能问题?
A: 减少粒子数量,或启用对象池和空间分区优化
许可
本项目基于P5.js原型复现,供学习和研究使用。