All language subtitles for 55. Adding a Vignette

Let's take our visuals up a further notch by

Introducing a video

In a vineyard is a nice and easy way to add a little bit of

Visual appeal turn game

And we're also going to be using this Vineyard

To indicate when the player

Has been hurt

So we're going to do the vignette first and then what connected

To the player

Hit event

Animal head fed up so that I can listen for the player

Damage

And flash the screen

Sort of red colour

Because we'll need that

To indicate

To the player that died

Is happening

So

The plan is to use a shader for the Vineyard

And we could write the shower ourselves but I want to show you this handy resource it's called kadosh

There's a bunch of great shaders on this website that are

Free to use in your project

So

I'm gonna go here and I've

Today's website in the lesson resources so you can visit

Subtitled by
online-courses.club
We compress knowledge for you!

And

I'll also upload the show data file as well

So that you can copy into

The shader from nitrofire

If you

Prefer

So let's search

How to show you had on this website work

I'm going to search for Vinny

And we've got this one colour of India

And they should be perfect for what we need you can browse the other

If you want but colouring

Perfect option for us

And the share code is right down here so you can actually do

Guiding copy the shader colour right there

And it was going to be end

What I'm going to do something to create a new scene

Let's give it a root type of canvas layer

And then let out a child know

Colour rectangle

Let's change the colour rectangles

Anchors to be full

Sirdar click this

In the toolbar and select folder

Alright and then let's rename this Candice later now

2

Vinny

Alright let's go and save that will say that in seems and then you are

And now for the colour rectangle

Click on that

And will scroll down

2

The

Material which is always the bottom

Guinness a new shader material

Security shutter material in there

And then let's create a new shed

You can call this vineyard adjudicator and save it in the UI directory as well

Sole trader

Click on the shoulder to bring open the shader editor

And then go ahead and paste that Sheila

Either from the Google sheet as website or from the file

That I

As a resource for this life

Now what you got that pasted in here you will notice that this actually has

An error in this is because this year was written for Adele 3

Lottery building that we need to change is this hint colour and we need to change it to source car

Lights out

And is another area here which says

Screen texture is not available that's fine I actually going to just modify this a little bit

And

What we can do is

We're going to get rid of this colour right here so they get rid of

And then we get rid of multiplication down here where it's x color.rgb

Get rid of that

And there's are vignette and we can remove that

Please as well

Stop now our vineyard is working and now if you look at it you can see that it looks

Pretty nice

So we actually going to change

A couple of

Firstly we were going to use that brown colour instead of black that were using throughout the day

I'm going to selective in yet here

Open up my swatches Soviet RGB radio

Dinosaur like that open up your swatches and select that Brown

If you don't have their brand selected it's 3

To see

31

Has The xx

Go and play with the VIN

Opacity and intensity by clicking and dragging

I think I'm going to use something like .15 for the Old pass

And .682 for the

You just buy

I think they look ok but no way to tell until we put it in the

So before we go and put it in the game we need to change one thing

We need to change this colour red

When you go down to the mouth filter modan

Select ignore

So make sure that mouse filter is said to ignore that's very poor

And then so that way when are you I elements come up on screen this correct won't interfere with our

And the Reason by the way we seeing a colour rectangle is because it essentially gives us

Space in which we can run a shower

Little bit on the reason for using it

You could see how the colour rectangle used to be white and then as soon as we attached the shooter to it

It's alright show

That's why they were used

Let's go over to me now and let's select a root note hit ctrl shift a

To instantiate a child theme

And they look for that Vineyard

Advert so you can see what this is starting to look pretty nice I'm going to close the shader editor by clicking the

At the bottom and then I'm going to move the van yet probably to the first Choice

Just

Looking good and also what you'll have is the experience bar or restaurant

That Vineyard

Alright so let's go and Run the game and see what they look

So already I think that little lad nice and makes the game look less flat

I give it a little bit more visual appeal

And I think generally looks a lot

Better

What's Michael's Vineyard

Flash when the player

Hit

So the first thing we need to do is know when the player is getting here

One option is we could just immediately connect to the player with an

Export variable

That is something that we could do

But I think what we can do instead that might be a little bit more appropriate is to extend our game of

So let's go ahead and open up our game events scene

Alex Clare

To open

The Script

And let's create a new function call

Funk

Claire

Damage

Ok and then we're going to need to create a signal for

At the top so signal

Play Adele

And we won't pass any parameters in

NN1

Player damage.in mate

Function

Alright

So now let's go to our player

So open up our players seem

Garden open up that players

And

When we

Handle the health change signal from our health

In the player

We can

Immediately

That

News

So let's go ahead into game events

Dart

Play Adele

And that water again in maid that player damage

And again that will be in the owner

Change so when are health component in Minster on change signal

Where is CL going to

Send another signal that tells us ok the pleasure has been dead

So now we can go to the Vineyard here

What's the score

To the Vineyard

Alright and then in red

What override that ready method and then we'll say Jamie Vince

Player damage

On

Claire

Ask read that functions

On player damage

And that's right path

I want to play against David

What do we want

Well we want to change the intensity

And the colour of the

So let's go out in in animation

And

That animation player we're gonna create a new animation called

Let's change the duration 2.4

Generous I use point for quite a lot I tend to find a point for it

A very good

Default length for an animation

It's generally just about to right amount of time for an anime

You take place so that's why I'm using .4 everywhere

But feel free to use whatever animation

Make sense

I think in this case we do want to keep it under .5 seconds

Because

The player can only take damage

.5 seconds

So this will mean that the animation

I will finish before it can be played again

There are ways to help out in cold but if we can just handle it without

Having to worry about that then that's ideal right

Ok so for a colorectal

Let's select

And let's like the animation tab so

As soon as you like the colour rectangle the shader editor will come up but we want the animation to be visible so that we can see

Is keyframe

So I'm going to scroll down

To where the shape parameters are

Unless change let keyframe the vineyard intense

And the Vineyard

GB

Let's use the slider to zoom

So what I'm going to do as I'm going to move this

Tea for the vineyard RGB

I'm going to move that to the end of our animations I'm going to write .4

The time

And the reason is because I'm going to insert another key right there

Beginning which is going to

Red

And the red colour that I'm going to be using

So let click into the value here

The first car

Select

I'm going

Is this in here

And this

Red is E8

45

3

And I'm going to add that to my Sky

So eh

More 5

3 cm

And now we play

It will go from red

2

Back to that brown colour that were

So we also want to make the intensity larger as well

So I can't I'm going to move this

Intensity

If you can't see with the sheet of premature is you can use

This button right here

It's a drag

The columns around so you can actually see

So this primitive in yet intensity right here

Gonna move that to the end as well 2.4

And then I'm going to change the vigna intensity by inserting a key right there

And then I'm just going to

See what happens so I'm going to turn them to be up to something

Like almost 3

Subtitled by
online-courses.club
We compress knowledge for you!

And now look at that so that are intense

This will be the animation

That plays when we get hit

So that's pretty cool

So just by modifying oshida premiere

We can indicate

The player has been

Now what I'm going to do as I'm going to change the easing of the first keyframe

Red dragon swords around 2

Just like that

And that will keep it real

For longer before it fades out and I might even do something

4 actually I think 2.5 is fine

And we need to apply the same Curve to the colours I'm going to select the first colour keyframe there

And moved

Easing

As well

And that just makes the red intensity linger for a little bit longer

So that animation finished we need to go back to our script and we need to tell the enovation player

Solas replace the pass with

Animation player

Play

Hit

Alright so with all of that in place we should be able to run a game and see that

We can

Now see the animation when we take down

Ok

So that affect is actually really sad

We can make this more obvious by doing the following

So

In addition to the keyframes that we have 4 in terms of the end

We can also keyframe in the colour rectangle again make sure it's like your animation

Tab so that we can actually keyframe these things

We can also change the

Vineyard opacity so I'm going to keep him

As well and same day I'm going to move that first keyframe to the end

And I'm going to create another keyframe

Beginning

I'm going to

So we get something like that in

So now it's going to be very

So the first keyframe has a valve

3 to 9 on my own

But feel free to update this

And keep in mind that when you drag this around it's not going to update until you play DNA

So if I dragged it all the way up

It won't work until I scrub and then I can see

The up

So just keep that in mind it's not going to update real time

Let's go out and play

Now and see what that looks

I think I look too good now one thing that you could consider doing if you wanted to

Is you can move these first keyframes by highlighting all of

Move them to 0.05

And then

Select all the end keyframes here

And right click to say duplicate keys

And that would duplicate the keys

Play current

Current scroll position

So far the scrubber at .02 and I highlight all these end frames and I say duplicate it will put them all right there

If that's fine is that happens to you don't worry you cannot move all these to the

To the 0 time

So now this is going to do is this is actually going to create

View frames of

Transition

So you can see if I hold ctrl and scrub like

View frames of transition

To that intensity before

Peking and then gradually

And that's just a little bit last jar

Then the immediate

Into into that car

So let's go out and play again and see what it looks like

I think that

Couple frame transition it's saddle but it is a noticeably smoother

Different cell

That looks great to me

Alright and that's the vineyard and the player damages