{"id":12,"date":"2023-06-01T15:35:37","date_gmt":"2023-06-01T10:05:37","guid":{"rendered":"http:\/\/blog.sarkgcreation.com\/?p=12"},"modified":"2023-06-01T15:49:50","modified_gmt":"2023-06-01T10:19:50","slug":"how-to-set-up-loop-animation-in-storyline-360-without-using-gif-and-web-objects","status":"publish","type":"post","link":"https:\/\/blog.sarkgcreation.com\/?p=12","title":{"rendered":"How to set up Loop Animation in Storyline 360 without using GIF and web objects"},"content":{"rendered":"\n

Are you struggling to setup a Loop Animation in Articulate Storyline 360?<\/p>\n\n\n\n

We notice most of the time client ask to add a loop animation on buttons and instructions text to get noticeable by users. So in this article we are creating a perfect Loop Animation on buttons, shapes and image.<\/p>\n\n\n\n

In this example we created an animated cover page<\/a> or you can say an animated poster that’s animate in loop without using any web objects or any GIF.<\/p>\n\n\n\n

We can use simple animation or path animation to make Loop Animation. See the below steps to follow:<\/p>\n\n\n\n

First let see how to apply Loop on simple animations.<\/strong><\/p>\n\n\n\n

Step 1: <\/strong>Select your object or image and then add animation from the animation section on top. Make sure you add both animation entrance and exit on same shape. Here you can see we have added wheel animation on entrance and exit.<\/p>\n\n\n\n

\"No<\/figure>\n\n\n\n

Step 2:<\/strong> Now add 2 triggers on the same shape<\/p>\n\n\n\n

Trigger 1:<\/p>\n\n\n\n

\"No<\/figure>\n\n\n\n

Trigger 2:<\/p>\n\n\n\n

\"No<\/figure>\n\n\n\n

Now let see how to apply Loop on Path Animations.<\/strong><\/p>\n\n\n\n

Step 1: <\/strong>Select your object or image and then add a path animation. See the image we added line motion path on the circle.<\/p>\n\n\n\n

\"No<\/figure>\n\n\n\n

Step 2: <\/strong>Then again on the same object add a new path animation by clicking on Add Motion Path button, this time select reverse path direction for this new path and set the pointer on same point as previously added.<\/p>\n\n\n\n

Step 3: <\/strong>Now add 2 triggers on the same shape.<\/p>\n\n\n\n

Trigger 1<\/p>\n\n\n\n

\"No<\/figure>\n\n\n\n

Trigger 2<\/p>\n\n\n\n

\"No<\/figure>\n\n\n\n

Demo Live<\/a><\/p>\n\n\n\n

If you want to see these kinds of informative articles and demos about storyline 360 please follow us.<\/p>\n\n\n\n

<\/figure>\n","protected":false},"excerpt":{"rendered":"

Are you struggling to setup a Loop Animation in Articulate Storyline 360? We notice most of the time client ask to add a loop animation on buttons and instructions text to get noticeable by users. So in this article we are creating a perfect Loop Animation on buttons, shapes and image. In this example we […]<\/p>\n","protected":false},"author":1,"featured_media":14,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[8],"tags":[3,6,5,7,2],"_links":{"self":[{"href":"https:\/\/blog.sarkgcreation.com\/index.php?rest_route=\/wp\/v2\/posts\/12"}],"collection":[{"href":"https:\/\/blog.sarkgcreation.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.sarkgcreation.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.sarkgcreation.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.sarkgcreation.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=12"}],"version-history":[{"count":2,"href":"https:\/\/blog.sarkgcreation.com\/index.php?rest_route=\/wp\/v2\/posts\/12\/revisions"}],"predecessor-version":[{"id":16,"href":"https:\/\/blog.sarkgcreation.com\/index.php?rest_route=\/wp\/v2\/posts\/12\/revisions\/16"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.sarkgcreation.com\/index.php?rest_route=\/wp\/v2\/media\/14"}],"wp:attachment":[{"href":"https:\/\/blog.sarkgcreation.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=12"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.sarkgcreation.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=12"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.sarkgcreation.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=12"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}