<?xml version="1.0" encoding="UTF-8" standalone="yes"?><oembed><version><![CDATA[1.0]]></version><provider_name><![CDATA[Ascender: The Blog]]></provider_name><provider_url><![CDATA[https://ascendergame.wordpress.com]]></provider_url><author_name><![CDATA[Ascender The Game]]></author_name><author_url><![CDATA[https://ascendergame.wordpress.com/author/ascenderthegame/]]></author_url><title><![CDATA[DEVLOG#31 &#8211; Creating the Dynamic Environment [Intern&#8217;s&nbsp;Journal]]]></title><type><![CDATA[link]]></type><html><![CDATA[<p><span style="font-weight:400;">Hey guys, I’m the new intern on the team. They call me Hessonite in the team and this is my first time writing a blog. So, on this very first blog, I’m going to talk about what am I doing on the team. Here I go!</span></p>
<p><span style="font-weight:400;">So, let’s imagine a game take place in spaceship with some monitors. Then imagine if those monitors shows some numbers,  blinking lights, and maybe a rotating cube. Those animated monitors is what you want to call as dynamic environments. Don’t you think some moving objects could make an environment look more real and lively? Well, that’s what dynamic environment is all about. As you can guess by now, I’m in charge of dynamic environment for Ascender, and I’ll give some examples of what it’s going to look like.</span></p>
<div data-shortcode="caption" id="attachment_1078" style="width: 330px" class="wp-caption aligncenter"><a href="https://ascendergame.files.wordpress.com/2016/04/linear-glow-version-2-preview.gif" rel="attachment wp-att-1078"><img loading="lazy" aria-describedby="caption-attachment-1078" data-attachment-id="1078" data-permalink="https://ascendergame.wordpress.com/2016/04/02/devlog31-creating-the-dynamic-environment-interns-journal/linear-glow-version-2-preview/" data-orig-file="https://ascendergame.files.wordpress.com/2016/04/linear-glow-version-2-preview.gif" data-orig-size="320,60" data-comments-opened="1" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="Linear Glow Version 2 Preview" data-image-description="" data-image-caption="" data-medium-file="https://ascendergame.files.wordpress.com/2016/04/linear-glow-version-2-preview.gif?w=300" data-large-file="https://ascendergame.files.wordpress.com/2016/04/linear-glow-version-2-preview.gif?w=320" class="wp-image-1078 size-full" src="https://ascendergame.files.wordpress.com/2016/04/linear-glow-version-2-preview.gif?w=320&#038;h=60" alt="Linear Glow Version 2 Preview" width="320" height="60" /></a><p id="caption-attachment-1078" class="wp-caption-text">Linear Glow for Open Mustang Puzzle Environment</p></div>
<p>This animated line is pretty simple to make actually. You just need to make a line with pen tool on After Effects and give that line a trim path effect.  What does trim path do? It gives the line a write on effect by manipulating the end value. If you set the end value to 0, the line will look like this.</p>
<div data-shortcode="caption" id="attachment_1082" style="width: 330px" class="wp-caption aligncenter"><a href="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-a.png" rel="attachment wp-att-1082"><img loading="lazy" aria-describedby="caption-attachment-1082" data-attachment-id="1082" data-permalink="https://ascendergame.wordpress.com/2016/04/02/devlog31-creating-the-dynamic-environment-interns-journal/gambar-dio-a/" data-orig-file="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-a.png" data-orig-size="320,60" data-comments-opened="1" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="gambar dio (a)" data-image-description="" data-image-caption="" data-medium-file="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-a.png?w=300" data-large-file="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-a.png?w=320" class="wp-image-1082 size-full" src="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-a.png?w=320&#038;h=60" alt="gambar dio (a)" width="320" height="60" srcset="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-a.png 320w, https://ascendergame.files.wordpress.com/2016/04/gambar-dio-a.png?w=150&amp;h=28 150w, https://ascendergame.files.wordpress.com/2016/04/gambar-dio-a.png?w=300&amp;h=56 300w" sizes="(max-width: 320px) 100vw, 320px" /></a><p id="caption-attachment-1082" class="wp-caption-text">Linear Glow &#8211; Frame 0</p></div>
<p>And if you set it to 100, the line will look like this.</p>
<div data-shortcode="caption" id="attachment_1081" style="width: 330px" class="wp-caption aligncenter"><a href="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-b.png" rel="attachment wp-att-1081"><img loading="lazy" aria-describedby="caption-attachment-1081" data-attachment-id="1081" data-permalink="https://ascendergame.wordpress.com/2016/04/02/devlog31-creating-the-dynamic-environment-interns-journal/gambar-dio-b/" data-orig-file="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-b.png" data-orig-size="320,60" data-comments-opened="1" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="gambar dio (b)" data-image-description="" data-image-caption="" data-medium-file="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-b.png?w=300" data-large-file="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-b.png?w=320" class="wp-image-1081 size-full" src="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-b.png?w=320&#038;h=60" alt="gambar dio (b)" width="320" height="60" srcset="https://ascendergame.files.wordpress.com/2016/04/gambar-dio-b.png 320w, https://ascendergame.files.wordpress.com/2016/04/gambar-dio-b.png?w=150&amp;h=28 150w, https://ascendergame.files.wordpress.com/2016/04/gambar-dio-b.png?w=300&amp;h=56 300w" sizes="(max-width: 320px) 100vw, 320px" /></a><p id="caption-attachment-1081" class="wp-caption-text">Linear Glow &#8211; Frame 100</p></div>
<p>If you set the 0 value at frame 0 and set the 100 value at frame 100, your line will move exactly like the animation above. Pretty neat isn’t it? It doesn’t look all that great, does it? Well, that’s because I have limitations of how big the file size can be. It is understandable if you count all of these dynamics I have made for the game (more than 20, and it’s increasing). Just Imagine if every of them have the size of 100 MB, Ascender  size will become big, so big that you have to spend more time to download it. #sizematters</p>
<p>Here&#8217;s some of the dynamic environment that I have made for Ascender.</p>
<div data-shortcode="caption" id="attachment_1079" style="width: 160px" class="wp-caption aligncenter"><a href="https://ascendergame.files.wordpress.com/2016/04/medic-screen-1-0.gif" rel="attachment wp-att-1079"><img loading="lazy" aria-describedby="caption-attachment-1079" data-attachment-id="1079" data-permalink="https://ascendergame.wordpress.com/2016/04/02/devlog31-creating-the-dynamic-environment-interns-journal/medic-screen-1-0/" data-orig-file="https://ascendergame.files.wordpress.com/2016/04/medic-screen-1-0.gif" data-orig-size="200,160" data-comments-opened="1" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="Medic Screen 1.0" data-image-description="" data-image-caption="" data-medium-file="https://ascendergame.files.wordpress.com/2016/04/medic-screen-1-0.gif?w=200" data-large-file="https://ascendergame.files.wordpress.com/2016/04/medic-screen-1-0.gif?w=200" class="wp-image-1079 size-thumbnail" src="https://ascendergame.files.wordpress.com/2016/04/medic-screen-1-0.gif?w=150&#038;h=120" alt="Medic Screen 1.0" width="150" height="120" srcset="https://ascendergame.files.wordpress.com/2016/04/medic-screen-1-0.gif?w=150&amp;h=120 150w, https://ascendergame.files.wordpress.com/2016/04/medic-screen-1-0.gif 200w" sizes="(max-width: 150px) 100vw, 150px" /></a><p id="caption-attachment-1079" class="wp-caption-text">Medical Center Screen</p></div>
<div data-shortcode="caption" id="attachment_1080" style="width: 210px" class="wp-caption aligncenter"><a href="https://ascendergame.files.wordpress.com/2016/04/static-noise-2-0.gif" rel="attachment wp-att-1080"><img loading="lazy" aria-describedby="caption-attachment-1080" data-attachment-id="1080" data-permalink="https://ascendergame.wordpress.com/2016/04/02/devlog31-creating-the-dynamic-environment-interns-journal/static-noise-2-0/" data-orig-file="https://ascendergame.files.wordpress.com/2016/04/static-noise-2-0.gif" data-orig-size="200,300" data-comments-opened="1" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" data-image-title="Static Noise 2.0" data-image-description="" data-image-caption="" data-medium-file="https://ascendergame.files.wordpress.com/2016/04/static-noise-2-0.gif?w=200" data-large-file="https://ascendergame.files.wordpress.com/2016/04/static-noise-2-0.gif?w=200" class="wp-image-1080 size-full" src="https://ascendergame.files.wordpress.com/2016/04/static-noise-2-0.gif?w=200&#038;h=300" alt="Static Noise 2.0" width="200" height="300" /></a><p id="caption-attachment-1080" class="wp-caption-text">Static Noise on City Board</p></div>
<p><span style="font-weight:400;">I think that’s it for now. I have said what I wanted to say. See you later guys.</span></p>
]]></html><thumbnail_url><![CDATA[https://ascendergame.files.wordpress.com/2016/04/static-noise-2-0.gif?fit=440%2C330]]></thumbnail_url><thumbnail_width><![CDATA[200]]></thumbnail_width><thumbnail_height><![CDATA[300]]></thumbnail_height></oembed>