触发方式
目录悬停播放,详情自动流动。开启指针交互后,移动指针或键盘聚焦可局部晕染。
起点与终点
画布 320 × 230;平移 0, 0px;缩放 1。纹理持续变化,无倒放阶段。
时序
线性基础时钟 12000 ms,延迟 0 ms,流动速度 0.6×。跨循环累计时间,避免纹理突然跳回。
进入与退出
持续流动。目录离开恢复静态预览;指针离开清除局部晕染。指针交互已关闭。
重复操作与打断
工具栏暂停保持纹理,再次播放从原进度继续。颜色、外观与速度调节保留累计时间;观察倍速和指针位置不写入 JSON。
减少动态效果
遵循系统减少动态效果设置,显示静态水彩,关闭流动与指针晕染。
水彩设置
颜色 #0A0A0A / #E0E0E0;速度 0.6;图案缩放 0.6;扭曲速度 0.08;不透明度 1;RGB 亮度偏移 0.15;指针交互 false;指针强度 1。
版本
此版使用六层值噪声、纸面细颗粒和分层晕染。与无颗粒的水彩融合、细度水彩融合相比,保留更明显的纸面肌理。三个版本共用参数格式,但使用不同渲染器,recipeId 决定导入与导出时保留哪个版本。
默认配置
这些数值来自当前维护的默认配置;编辑器草稿和调整后的导出可以不同。
{
"schemaVersion": 2,
"recipeId": "watercolor-original",
"durationMs": 12000,
"delayMs": 0,
"easing": [
0,
0,
1,
1
],
"offsetX": 0,
"offsetY": 0,
"scale": 1,
"loop": true,
"interruption": "retarget",
"tracks": [
{
"part": "watercolor",
"property": "watercolorTime",
"values": [
0,
12
],
"times": [
0,
1
],
"start": 0,
"span": 1
}
],
"watercolor": {
"color1": "#0A0A0A",
"color2": "#E0E0E0",
"speed": 0.6,
"scale": 0.6,
"warpSpeed": 0.08,
"opacity": 1,
"brightness": 0.15,
"cursorInteraction": false,
"cursorIntensity": 1
}
}源码与复用
GitHub 对应示例提供公开渲染源码、默认配置和运行入口。复用前请阅读交互说明,并保留随源码附带的第三方与字体许可;完整网页编辑器由独立工程维护。
用于自己的项目
进入编辑器运行真实预览并比较调整;本说明页不另造一份近似演示。把导出用于自己的项目后,重新检查内容、输入、焦点与布局。
目录来源标注:原创实现. 第三方示例保留自己的许可与署名;公开仓库包含全部当前动效的渲染源码;完整编辑器由独立工程维护。