Welcome back once again everyone in this video Our goal is to create some animations inside of our Widget Blueprint here our skill acquired Widget Blueprint so that it will appear on the screen in an eye pleasing manner. Again, this is meant to appear whenever our character interacts with one of those skill diocese out there, and they collect and then gain a new skill that they can then use. So this is just some information for the player about what the skill is how much it costs, that sort of thing. So creating some animations for this Firstly, if you are not in this w BP skill acquired this is the pathway content Metroid vignette widgets. Double click your W BP skill acquired to join right along for the fun with this open over here on the Designer tab we're gonna come over to the lower left hand portion of the screen and create a brand new animation by clicking on this green plus animation button.

This first one is going to be called intro. And we're going to do a few things in our intro animation track. So with that selected, we are going to make an animation for our background blur. Firstly, so select your intro animation right here, then select your background blur. And if you come over to the Details panel, the thing that we want to change over time is our blur strength. I've currently got it set to five.

And what I'm gonna do is I'm gonna reset this back to zero for the time being because by default, I'm going to want it to be zero. And then I'm going to click this little plus button right here to add a keyframe for this at the zero second mark. So I've clicked on that you can see our background blur has now been added down to our timeline right here. And so at the zero second mark, I want the value to be zero Then I'm going to move my timeline slider over to the half second mark. Right about there. Again, you can hold down Control and mouse wheel to squeeze or shrink your timeline here.

So the half second mark, I'm going to click this little plus button to add a new keyframe. And then I'm going to change the value of our boiler strength right over here to be five. Just note that you can right click on any of these keys and change your value that way is well your time as well as your value. I like this methodology of simply going here, then adding a keyframe then changing the value right over here, but whatever floats your boat. Okay, so that's going to be good for our background blur. Let's move our timeline slider back to the zero second mark.

I'm going to collapse this track. The next thing I want to modify over time here is going to be our screen overlay or not our screen overlay our skill overlay. Let's find That right here in the hierarchy, so make sure you select that. And what I want to modify over time here is our scale. So we'll come down to the Details panel and scroll on down to you find your render transform scale settings. And I'm going to set the x by default, I'm going to set the the new default values first before I add anything to our timeline.

So I'm going to keep our x scale at one but the Y scale I'm going to set to be zero now. Okay, so that's gonna basically shrink it all the way up. Now I'm going to click right here to add the scale properties to our timeline. There they are, let me just expand this out by clicking on this triangle. expand out the scale as well. So you can see it the zero second mark, our x scale is one our y scale is zero.

Let's move our timeline slider to the point one, five second mark, let me just expand this out a little bit. I'm going to add some more scale keys. Here, I want the x scale to be one, but I want the Y scale to be 1.5. So it's going to be kind of fat like that just for a brief moment. Then I'm going to move my timeline slider over 2.25 seconds, that's a quarter of a second. click right here to add some more scale keys.

And I'm going to set the x value to one and the y value to one so you can see now how this is going to kind of pop in like that. Okay. Let's move our timeline slider back to zero seconds, collapse our skill overlay here. The next thing that we're going to add down to our track is our screen shot border. Let's select that. Now again, the screenshot image is attached onto our screenshot border.

So if we modify our screenshot border, the image will be modified as well. The thing I'm going to want to modify about our screenshot border is the scale settings. So at the zero second mark here, at the zero second mark, I'm gonna want the x and y. Well, I'm going to say rather let me back that up. I'm going to set the new defaults for our scale to be x of zero and y of zero, that's going to make it disappear temporarily here. Then I'm going to add keyframe for this, it's going to add it to our timeline.

Let's expand out or transform and our scale. So at the zero second mark is at 00. For the x and y scale, move our timeline slider over to the point two five second mark. Let's add some more scale keys by clicking this plus button. I still want it to be zero and zero right here. Then I'm going to move our timeline slider over to the half second mark.

Add some more stuff Scale keys clicking right there. And let's set our x and y to be one and one. So you can start to see if I click play, what that's gonna look like, right? And that's looking pretty solid right there. Yeah, we'll let that be for the time being. In my notes, I did set all these keys to be linear, I'm just left clicking and dragging.

And then I right click on any of these keys to be linear, that's just gonna make a little bit more of a smooth transition. But it's barely noticeable. So you don't really have to do that. Okay, now I'm going to collapse my screenshot border parameters down in my timeline right here. And let's do our input overlay. So let's find our input overlay right here in the hierarchy.

The thing that I want to modify about this overtime is also our scale. So render transform scale. Let's set our new defaults for this to be x zero, y zero. Then I'm going to click right here to add keys for this to our timeline, transform scale you do you start to run out of screen real estate with this for a little time. So as you're working on building out a timeline here, you gotta try to keep this on view a little difficult with one monitor. Okay, so what the zero second mark, I want the x and y to be zero.

At the half second mark. I'm going to add more scale keys and I want the X and Y to still be zero at the three quarters of a second mark, point seven five seconds and get add some scale keys. Here I'm going to set the x to be 1.5 and the y to be 1.5. Then lastly, Going to move the timeline slider over to the one second mark, add some more scale keys, and let's go one for the X and one for z y. It's gonna pop in, like so. Now you see it's kind of doing that weird, but kind of zoom in on it, it's kind of doing that weird sort of animation where it's inverting here, I am going to left click, drag around all my keys, then I'm going to right click on any of them, and I'm going to say I want these to be linear.

And by doing that, it's going to prevent that little weird flipping in the beginning and simply do what we want it to do. Okay, more work to be done here. But we're going to Compile and Save this one more time. We're going to call this video a wrapper. We're going to continue on in the next one. We'll see you there.