{"id":5397,"date":"2022-01-26T00:58:39","date_gmt":"2022-01-26T00:58:39","guid":{"rendered":"https:\/\/www.thisgoodboy.com\/site\/?p=5397"},"modified":"2022-01-27T00:30:49","modified_gmt":"2022-01-27T00:30:49","slug":"linear-ease-benefits-of-avoidance","status":"publish","type":"post","link":"https:\/\/www.thisgoodboy.com\/site\/2022\/01\/26\/linear-ease-benefits-of-avoidance\/","title":{"rendered":"Linear ease \/ Benefits of avoidance"},"content":{"rendered":"\n<p><strong>Linear ease<\/strong><\/p>\n\n\n\n<div class=\"hcb_wrap\"><pre class=\"prism line-numbers lang-csharp\" data-lang=\"C#\"><code>\/\/also known as\nfloat t =&gt; +t;<\/code><\/pre><\/div>\n\n\n\n<p>Lets start with the basic ease&#8230; NONE!<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"https:\/\/i.imgur.com\/KNm3FSd.png\" alt=\"\"\/><figcaption>Line goes up<\/figcaption><\/figure>\n\n\n\n<p>Ok so this might be a cheat you think&#8230; what ease? Why even have none? Surely it would look terrible , like my boss made this animation for his powerpoint presentation and things are just sliding around the screen. Why use it ever? Well there are reasons, benefits even.<\/p>\n\n\n\n<p><strong>Example 1: Robotics\/machinery\/ anything mechanical with no inertia<\/strong><\/p>\n\n\n\n<p>If you&#8217;ve got something being driven by a piston or something which exerts forces, sure you would need an ease, but if it&#8217;s something which has continuous movement an ease would actually ruin the effect. E.G. (<a href=\"https:\/\/www.trainairtram.com\/pamelas-animated-gifs---view-or-download\/trains-and-things\">source<\/a>)<\/p>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.thisgoodboy.com\/site\/wp-content\/uploads\/2022\/01\/pam-03_orig.gif\" alt=\"\" class=\"wp-image-5399\" width=\"344\" height=\"191\"\/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.thisgoodboy.com\/site\/wp-content\/uploads\/2022\/01\/gears.gif\" alt=\"\" class=\"wp-image-5401\" width=\"393\" height=\"300\"\/><figcaption>Notice how the exiting action at the front is being improved by having a calm moving gear at the front, almost as if to say &#8220;dont look at me im functioning great! It&#8217;s the eased one you should be worried about&#8221;<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"435\" height=\"250\" src=\"https:\/\/www.thisgoodboy.com\/site\/wp-content\/uploads\/2022\/01\/FalseIncompatibleCicada-size_restricted.gif\" alt=\"\" class=\"wp-image-5412\"\/><figcaption>Not sure if its the fps but here you can see there IS an ease which makes the cogs studder front and it feels really jaggedy like they&#8217;re busted<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img decoding=\"async\" src=\"blob:https:\/\/www.thisgoodboy.com\/3a8f696a-bc03-4bc0-9789-f79bd4ce26d8\" alt=\"\"\/><figcaption>Better! Nice and relaxing<\/figcaption><\/figure>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n\n\n\n<p><strong>Example 2: Flowing lines<\/strong><\/p>\n\n\n\n<p>Flowing lines or mography type paths work best when theres little to no easing. Yes sometimes a little ease adds some extra spice but in general the more things arent being eased into position the more relaxing it feels. It has a clean professional look, and its like a great neutral canvas to paint your focus area on to. Or to put fancier tweens at the front. But without the calm the exiting feels less exiting, the contrast needs to be there in my opinion otherwise its all icing no cake.<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"428\" height=\"240\" src=\"https:\/\/www.thisgoodboy.com\/site\/wp-content\/uploads\/2022\/01\/Wavy_WatersA.gif\" alt=\"\" class=\"wp-image-5404\"\/><figcaption><a href=\"https:\/\/watersafe.org\/sample-animations\">source<\/a><\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.thisgoodboy.com\/site\/wp-content\/uploads\/2022\/01\/star-illusion.gif\" alt=\"\" class=\"wp-image-5403\" width=\"377\" height=\"377\"\/><figcaption>Notice how the eased effect is created from color changes more than the line speed , which is mostly ease-less<\/figcaption><\/figure>\n\n\n\n<figure class=\"wp-block-image size-full is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/www.thisgoodboy.com\/site\/wp-content\/uploads\/2022\/01\/O6zt2cS.gif\" alt=\"\" class=\"wp-image-5402\" width=\"366\" height=\"264\"\/><\/figure>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"498\" height=\"126\" src=\"https:\/\/www.thisgoodboy.com\/site\/wp-content\/uploads\/2022\/01\/tenor-3.gif\" alt=\"\" class=\"wp-image-5409\"\/><figcaption>Notice in this one how the main action (moving right) is linear while the secondary action has an ease and the first emphasizes the second one really well <\/figcaption><\/figure>\n\n\n\n<p><strong>Example 3: continuous loops<\/strong><\/p>\n\n\n\n<p>This is more specialized(and overlaps with the lines one I mentioned often) but continuous loops and mind bending gifs need love too, and a looping gif feels perfectly in motion when the overlapping motion is linear. Sure you could put sub eases to individual elements but the more the main parts are linear the more \u201ccalm\u201d it feels (gifs from Giphy)<\/p>\n\n\n\n<p><\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"480\" height=\"480\" src=\"https:\/\/www.thisgoodboy.com\/site\/wp-content\/uploads\/2022\/01\/tenor-1.gif\" alt=\"\" class=\"wp-image-5408\"\/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"350\" height=\"250\" src=\"https:\/\/www.thisgoodboy.com\/site\/wp-content\/uploads\/2022\/01\/tenor.gif\" alt=\"\" class=\"wp-image-5406\"\/><\/figure>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"254\" height=\"254\" src=\"https:\/\/www.thisgoodboy.com\/site\/wp-content\/uploads\/2022\/01\/tenor-2.gif\" alt=\"\" class=\"wp-image-5407\"\/><\/figure>\n\n\n\n<p>There are many other uses for linear ease, these are just some I just wanted to make a point that lack of ease is sometimes very beautiful and is definetly something that<strong> should not <\/strong>be avoided<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Linear ease Lets start with the basic ease&#8230; NONE! Ok so this might be a cheat you think&#8230; what ease? Why even have none? Surely it would look terrible , like my boss made this animation for his powerpoint presentation [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[93,1],"tags":[95,97,96],"class_list":["post-5397","post","type-post","status-publish","format-standard","hentry","category-luckys-ramblings","category-uncategorized","tag-ease","tag-easing","tag-linear"],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.thisgoodboy.com\/site\/wp-json\/wp\/v2\/posts\/5397","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.thisgoodboy.com\/site\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.thisgoodboy.com\/site\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.thisgoodboy.com\/site\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.thisgoodboy.com\/site\/wp-json\/wp\/v2\/comments?post=5397"}],"version-history":[{"count":5,"href":"https:\/\/www.thisgoodboy.com\/site\/wp-json\/wp\/v2\/posts\/5397\/revisions"}],"predecessor-version":[{"id":5418,"href":"https:\/\/www.thisgoodboy.com\/site\/wp-json\/wp\/v2\/posts\/5397\/revisions\/5418"}],"wp:attachment":[{"href":"https:\/\/www.thisgoodboy.com\/site\/wp-json\/wp\/v2\/media?parent=5397"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.thisgoodboy.com\/site\/wp-json\/wp\/v2\/categories?post=5397"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.thisgoodboy.com\/site\/wp-json\/wp\/v2\/tags?post=5397"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}