一个动作模糊的简单实现💨💨坐标系统
重新计算了坐标系统：
vec2 p = (2.0*fragCoord-iResolution.xy)/iResolution.y;
因为都以短边iResolution.y为单位长度，窗口分辨率变化也不会影响图片比例，且可以保证图形居中。对于昨天书写的函数都进行了更正，参见basic shapes v1（猫猫shader因为定位点不好调就不改了）。
坐标变换
- 斜切
vec2 bevel(vec2 p, float x,float y){
vec2 q;
q.x = p.x + p.yx;
q.y = p.y +p.xy;
return q;
}
基础变换矩阵，太没劲了..整点动感：
// animate
float tt = mod(iTime,1.5)/1.5;
float ss = pow(tt,.2)0.5 + 0.5;
ss = ss1.sin(tt6.283.0 + p.y0.5)exp(-tt4.0);
float c = rectangle(bevel(p,.7*ss,0.),vec2(-.3,.5),vec2(.3,-.5),BLUR);
动画效果参考了iq大大热情似火的心心。mod()控制周期，sin()提供振幅，exp()效果衰减。
动作模糊
👉参考案例 - 1Pass下的动作模糊👈
动作模糊效果的产生是为了模仿摄像机曝光过程中物体快速移动留下的残影。仔细端详了一下案例代码，实现的方式非常“原理化”，就是将过去的N帧进行叠加。效果的实现有两个控制因素：回退的帧数(amount)和回退的时间(timescale)。
案例中的三组分别展示了60，30，15FPS下的motionblur，但非常有欺诈性的是三组的amount分别是8，16和32，所以总的Timescale是不一样的.拖尾长度和FPS其实并没有直接的联系。😇
因为没有用buffer，所以要求是物体的运动仅与时间相关，输入时间即可算出对应位置。
核心的代码实现也很简单，其中scene(vec2 uv,float time)是包含动画效果的函数。
//motionblur
for(int i = 0; i < int(amount); i++){
blurCol += scene(uv, iTime - float(i)*timescale/amount))/amount;
}
今天就水一个不太冷静的瞎子，用到了bevel的小动画+y坐标的动画。
👉完整代码👈
Today's Tips
- iMouse.z > 0:鼠标按下
ODOS —— One Day One Shader 努力日更的学习计划。 包括但不限于基于[Shadertoy][22]、UnityShaderLab等平台的shader学习笔记
by ERIN.Z