Neave

Neave是什么

Neave 是一组运行在浏览器里的交互工具与视觉实验集合。主打实时图形渲染、物理模拟与音画联动，不依赖安装包，打开网页即用。

底层基于 WebGL 与 Canvas 2D 双通道渲染。部分模块调用 Web Audio API 做音频分析。输入以鼠标、键盘、麦克风为主。

有一点需要注意，不同模块的算力占用差异较大，低端设备跑复杂粒子场景会掉帧。

Neave主要功能

• 实时图形渲染：用 WebGL 着色器逐帧计算像素，输出动态全屏画面，支持 60fps 上限，分辨率跟随窗口尺寸自动缩放。
• 物理模拟：基于质点弹簧模型计算粒子间作用力，输入为初始坐标与引力参数，输出连续运动轨迹，粒子数超过 2000 时帧率下降明显。
• 音频可视化：通过 Web Audio API 抓取麦克风或音频文件的频谱数据，映射为几何形变，输入支持 44.1kHz 采样，输出柱状或波形图形。
• 交互式沙盒：鼠标拖拽生成临时力场，键盘按键切换参数预设，输出即时反馈画面，单次会话不保存状态。
• 生成式图案：用噪声函数与递归算法合成纹理，输入种子值决定图案差异，输出可截图的静态图像，单张渲染耗时约 80ms。
• 光效模拟：叠加多层高斯模糊与辉光通道，输入亮度阈值控制光晕范围，输出带泛光的合成画面，移动端默认关闭该通道。

Neave使用要求

浏览器需支持 WebGL 1.0 以上。Chrome、Firefox、Safari 近三年版本均可运行。Canvas 2D 模块兼容性更宽，老设备也能跑。

麦克风相关功能要授权音频输入权限。不授权就只能用预设音频文件。

硬件方面，独立显卡跑高粒子数场景更稳。集成显卡建议把粒子数控制在 1000 以内。内存占用随画布尺寸线性增长，4K 全屏下约吃掉 300MB。

Neave核心优势

跨平台零安装。所有运算在浏览器端完成，不经过服务器中转。打开链接就能操作，换设备不用重新配置。

参数实时可调。滑块与键盘映射直接绑定渲染变量，改一个值下一帧就生效，不用重新编译着色器。

Neave如何使用

拖动鼠标改变力场方向与强度。滚轮缩放视野范围。

按数字键 1 到 9 切换预设参数组。按空格暂停或恢复动画。

音频模块里点麦克风图标启动采集。没有麦克风就点文件图标加载本地音频。

截图用浏览器自带功能。右键保存画布或按系统截屏键。

Neave同类竞品对比

Neave应用场景

视觉灵感采集。调参数看实时反馈，比翻图库快。

教学演示。物理模拟模块能直观展示力与运动关系。音频可视化用来讲频谱映射也合适。

直播背景。全屏跑生成式图案，画面不重复。这里有个细节，长时间运行建议关掉光效通道省 GPU。

Neave适用人群

前端开发者用来试 WebGL 效果。设计人员找动态图形参考。教师做课堂演示。对参数调试有耐心的普通用户也能玩。

首页截图