Three.js 粒子星系：从曲线到有机质感的探索

从曲线到粒子

最初版本用 BufferGeometry 画出了完美的螺旋曲线，干净、精准，但用户反馈"太像 logo，缺少宇宙的有机感"。

曲线版的问题：太规整、太干净、像工业设计产品，不像真正的星系。

粒子系统方案

核心参数

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11


const params = {
  count: 150000,      // 粒子数量
  size: 0.02,         // 粒子大小
  radius: 5,          // 星系半径
  branches: 5,        // 旋臂数量
  spin: 1,            // 旋转强度
  randomness: 0.5,    // 随机扩散
  power: 3,           // 聚集强度
  insideColor: '#ff6030',   // 内核暖色
  outsideColor: '#1b3984',  // 边缘冷色
}

关键经验

幂函数控制聚集：Math.pow(randomnessPower, 3) 让粒子在内核更密集
双色渐变：内核用暖色（橙/白），边缘用冷色（蓝/紫），模拟真实星系光谱
透明度混合：depthWrite: false + transparent: true 实现粒子叠加光效

配色迭代

版本	主色	辅色	效果
v1	纯白	蓝	太单调
v2	绿 + 白	红/橙/蓝	抖音星轨风格
v3	橙 + 白	蓝紫	接近真实星系

🎨 粒子特效源码已打包，关注后续更新获取。