{"id":732,"date":"2014-09-18T09:49:56","date_gmt":"2014-09-18T16:49:56","guid":{"rendered":"http:\/\/www.imaginary-institute.com\/blog\/?p=732"},"modified":"2014-09-18T13:10:22","modified_gmt":"2014-09-18T20:10:22","slug":"the-joy-of-easy-motion-blur","status":"publish","type":"post","link":"https:\/\/www.imaginary-institute.com\/blog\/2014\/09\/18\/the-joy-of-easy-motion-blur\/","title":{"rendered":"The Joy of Easy Motion Blur"},"content":{"rendered":"
\"A

Motion blur on the left, no motion blur on the right<\/p><\/div>\n

Any time I make an animation where things are moving quickly on the screen, I think about adding motion blur to my sketch. We’re used to seeing a trail behind fast-moving objects when watching film or video, and when we don’t see it the animation can feel jerky or just vaguely “wrong” (for more discussion, with examples, see Imaginary Institute Technical Note #7, “Fields and Cameras,” available here<\/a>). Sometimes I’ve bothered to invest the time to write motion blur code yet again, sometimes I haven’t.<\/p>\n

In my AU Library (now available in beta through this post<\/a>), I’ve implemented a high-quality camera model that is super-easy to use (though it has lots of options for advanced users). One of its built-in features is motion blur. I wrote a little animation yesterday, and thought I’d add motion blur. I included the library and added three trivial lines, and it was done! Less than a minute of work and I had fully motion-blurred results that look great. After the break you can watch the animation with and without motion blur.<\/p>\n

On the left is the version with motion blur. On the right, without motion blur. If the animations aren’t already running, just click on them to get them to go. To really see the difference, watch one of the isolated outermost dots in each version. <\/p>\n

\"NoBlurAnim\"<\/a>

Animation without motion blur<\/p><\/div>\n

\"MotionBlurAnim\"<\/a>

Animation with motion blur<\/p><\/div>\n

Here’s a skeleton for using the camera in this way. Note that the camera object takes care of saving the frames for you.<\/p>\n

\r\nimport AULibrary.*;\r\nAUCamera Camera;  \/\/ declare the global camera\r\n\r\nvoid setup() {\r\n  size(...);\r\n  Camera = new AUCamera(this, 360, 5);  \/\/ 360 frames, each of 5 snapshots\r\n}\r\n\r\nvoid draw() {\r\n  float time = Camera.getTime(); \/\/ get time [0, 1)\r\n  \/\/ draw the picture for this value of time\r\n  Camera.expose();  \/\/ process this snapshot\r\n}\r\n<\/pre>\n","protected":false},"excerpt":{"rendered":"
Any time I make an animation where things are moving quickly on the screen, I think about adding motion blur to my sketch. We’re used to seeing a trail behind fast-moving objects when watching film or video, and when we don’t see it the animation can feel jerky or just vaguely “wrong” (for more discussion, […]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[1],"tags":[],"class_list":["post-732","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/www.imaginary-institute.com\/blog\/wp-json\/wp\/v2\/posts\/732","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.imaginary-institute.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.imaginary-institute.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.imaginary-institute.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.imaginary-institute.com\/blog\/wp-json\/wp\/v2\/comments?post=732"}],"version-history":[{"count":23,"href":"https:\/\/www.imaginary-institute.com\/blog\/wp-json\/wp\/v2\/posts\/732\/revisions"}],"predecessor-version":[{"id":760,"href":"https:\/\/www.imaginary-institute.com\/blog\/wp-json\/wp\/v2\/posts\/732\/revisions\/760"}],"wp:attachment":[{"href":"https:\/\/www.imaginary-institute.com\/blog\/wp-json\/wp\/v2\/media?parent=732"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.imaginary-institute.com\/blog\/wp-json\/wp\/v2\/categories?post=732"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.imaginary-institute.com\/blog\/wp-json\/wp\/v2\/tags?post=732"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}