[css-animation] Motion Blur

### Why Professional polish of motion graphics often includes the application of motion blur. In most cases, it's a boolean toggled at the layer level, that then tells the engine to set a blur amount based on the speed of the pixels. This effect makes animations much closer to real life, among other nice benefits. CSS currently is incapable of such an effect. Instead, a strobing, ghosted type effect is often what we get instead. Motion blur, as is found in motion graphic tooling like After Effects, is not possible with current filters because each pixel is evaluated, not the entire layer. Each pixel is evaluated for velocity and blurred contextually. CSS blur() can only apply to the entire layer. <br> #### Use Cases / Contexts/ Value Props - **Brand fidelity** - Broadcast industry - Animation industry - Release dependency on movie files for fidelity - **Tooling** - Animation tooling (framer, marvel, etc) - Web video editing (caption animations, etc) - **Strobing pacification/correction** - Lower framerate scenarios can be less janky - Closer to the physical world - Soften an animation - **Classic animation technique enablement** - Taught in schools as a healthy technique - Enable animators and mographers to port more of their work to the web - **Fluid interfaces** - All the above can help lead to more fluid interfaces - Will be very interesting to see motion blur paired with 2d transforms and touch interactions, especially if they have physics <br>

Posted by argyleink on Apr 17, 2019, 8:42 PM

Tags

• github (Other)

Related issues

• struct's lifetime requirements can be bypassed via covariant field assignment
• Proposal to Reorganize the Moderation Team and Review Moderation Policies
• Progressive FPS degradation appears to be related to dota2.com — blocking the domain prevents the performance loss
• proposal: container/...: generic collection types
• Better Custom Endpoint BYOK
• A concrete policy for backward compatibility until Godot 5.0