{"id":134,"date":"2024-10-02T14:09:44","date_gmt":"2024-10-02T17:09:44","guid":{"rendered":"https:\/\/tilbuci.com.br\/site\/?page_id=134"},"modified":"2024-10-02T14:24:11","modified_gmt":"2024-10-02T17:24:11","slug":"transition-animations","status":"publish","type":"page","link":"https:\/\/tilbuci.com.br\/site\/getting-started-with-tilbuci\/transition-animations\/","title":{"rendered":"Transition animations"},"content":{"rendered":"\n<p>TilBuci animates transitions between scenes and even between their keyframes. In this guide we will understand how this works.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Getting started with TilBuci chapter 3: transition animations\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/VoXlQkJ0oso?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-group has-global-padding is-layout-constrained wp-block-group-is-layout-constrained\">\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--1\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/02-2-1024x576.png\" alt=\"\" class=\"wp-image-136\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/02-2-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/02-2-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/02-2-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/02-2-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/02-2.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>Start by opening your first movie and your first scene.<\/p>\n\n\n\n<p>Start by opening your first movie and your first scene. When TilBuci finds the same image in two scenes, it interpolates their properties, such as size and position between them.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--2\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/05-e-06-1024x576.png\" alt=\"\" class=\"wp-image-137\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/05-e-06-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/05-e-06-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/05-e-06-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/05-e-06-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/05-e-06.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>See this example with our circle and its properties in both scenes.<\/p>\n\n\n\n<p>On transition, TilBuci will animate a change in size from 800&#215;800 to 2000&#215;2000 and in position from 560&#215;140 to -1000x-1000.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--3\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/07-2-1024x576.png\" alt=\"\" class=\"wp-image-138\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/07-2-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/07-2-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/07-2-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/07-2-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/07-2.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>This applies to other properties as well, such as colors and sound volume.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--4\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/08-2-1024x576.png\" alt=\"\" class=\"wp-image-139\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/08-2-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/08-2-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/08-2-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/08-2-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/08-2.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>And how does TilBuci know that the image is the same in both scenes? The secret is in the menu on the right, under Intances and Current instance.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--5\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/09-2-1024x576.png\" alt=\"\" class=\"wp-image-140\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/09-2-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/09-2-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/09-2-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/09-2-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/09-2.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>For each image added to the stage, TilBuci gives a unique name which we call the instance name.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--6\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/10-1-1024x576.png\" alt=\"\" class=\"wp-image-141\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/10-1-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/10-1-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/10-1-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/10-1-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/10-1.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>If there is another image in the new scene with the same instance name, TilBuci will perform the transition animation, even if the media shown in the image is different.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--7\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/12-1-1024x576.png\" alt=\"\" class=\"wp-image-144\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/12-1-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/12-1-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/12-1-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/12-1-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/12-1.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>By default, a random instance name is created for each image you add, but you can change it to whatever you want.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--8\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/13-1-1024x576.png\" alt=\"\" class=\"wp-image-146\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/13-1-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/13-1-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/13-1-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/13-1-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/13-1.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>But what happens if TilBuci doesn&#8217;t find an image with the same instance name in the new scene? And if a new name is found?<\/p>\n\n\n\n<p>In this case the old image is removed and the new image is created, which can happen in a few ways.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--9\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/15-1-1024x576.png\" alt=\"\" class=\"wp-image-147\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/15-1-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/15-1-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/15-1-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/15-1-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/15-1.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>Now, go to Movie > Properties in the left menu, go to the Animation tab and look for Images origin.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--10\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/16-17-e-18-1024x576.png\" alt=\"\" class=\"wp-image-148\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/16-17-e-18-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/16-17-e-18-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/16-17-e-18-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/16-17-e-18-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/16-17-e-18.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>There are some options. In Alpha, the image will maintain all its properties except opacity. It will appear or disappear gradually.<\/p>\n\n\n\n<p>In Center, the image will grow from the center point of the screen, or shrink towards it until it disappears.<\/p>\n\n\n\n<p>The other ones (up, down, left and right) show the images coming from outside the view area, keeping te original layout or not.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--11\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/19-2-1024x576.png\" alt=\"\" class=\"wp-image-149\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/19-2-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/19-2-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/19-2-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/19-2-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/19-2.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>In this tab you can also define how the transition animation will be done. It is linear by default, but there are several other options.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-columns alignwide is-layout-flex wp-container-core-columns-is-layout-e37d7211 wp-block-columns-is-layout-flex\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:30%\">\n<figure class=\"wp-block-image size-large is-style-rounded is-style-rounded--12\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/20-1-1024x576.png\" alt=\"\" class=\"wp-image-150\" srcset=\"https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/20-1-1024x576.png 1024w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/20-1-300x169.png 300w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/20-1-768x432.png 768w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/20-1-1536x864.png 1536w, https:\/\/tilbuci.com.br\/site\/wp-content\/uploads\/2024\/10\/20-1.png 1920w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n\n<div class=\"wp-block-column is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:65%\">\n<p>Remember to save your changes if you have adjusted anything, including the time used in the transition.<\/p>\n<\/div>\n<\/div>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<p>In this video, we learn a little about how TilBuci animates elements on the screen. Be sure to check out the next chapters!<\/p>\n\n\n\n<div style=\"height:var(--wp--preset--spacing--20)\" aria-hidden=\"true\" class=\"wp-block-spacer\"><\/div>\n\n\n\n<div class=\"wp-block-buttons is-content-justification-center is-layout-flex wp-container-core-buttons-is-layout-a89b3969 wp-block-buttons-is-layout-flex\">\n<div class=\"wp-block-button\"><a class=\"wp-block-button__link wp-element-button\" href=\"https:\/\/tilbuci.com.br\/site\/index.php\/getting-started-with-tilbuci\/\">Back to index<\/a><\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"<p>TilBuci animates transitions between scenes and even between their keyframes. In this guide we will understand how this works. Start by opening your first movie and your first scene. Start by opening your first movie and your first scene. When TilBuci finds the same image in two scenes, it interpolates their properties, such as size [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":44,"menu_order":19,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-134","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/tilbuci.com.br\/site\/wp-json\/wp\/v2\/pages\/134","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tilbuci.com.br\/site\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tilbuci.com.br\/site\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tilbuci.com.br\/site\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tilbuci.com.br\/site\/wp-json\/wp\/v2\/comments?post=134"}],"version-history":[{"count":4,"href":"https:\/\/tilbuci.com.br\/site\/wp-json\/wp\/v2\/pages\/134\/revisions"}],"predecessor-version":[{"id":151,"href":"https:\/\/tilbuci.com.br\/site\/wp-json\/wp\/v2\/pages\/134\/revisions\/151"}],"up":[{"embeddable":true,"href":"https:\/\/tilbuci.com.br\/site\/wp-json\/wp\/v2\/pages\/44"}],"wp:attachment":[{"href":"https:\/\/tilbuci.com.br\/site\/wp-json\/wp\/v2\/media?parent=134"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}