Original subtitles

1 1

[MUSIC] 2

2

In this video we'll be creating our success levels so 3

3

that when the player reaches the very end of your game there is a scene that loads 4

4

where they can run around. 5

5

Some sort of congratulations, winner, winner chicken dinner. 6

6

Click the main menu, that takes you back to the very first screen. 7

7

This is our main screen where we've implemented a start button, 8

8

where you can start the game and then go through the game. 9

9

So it's all just very functional at the moment. 10

10

You can make it as pretty and awesome and dressed up as you like, but for 11

11

now we just want to get that full complete game flow implemented in our game. 12

12

Let's start by making ourselves a start button. 13

13

I'm gonna right click, go to UI > Button. 14

14

That automatically creates a canvas as well. 15

15

I'm just gonna rename this main menu Canvas. 16

16

Not critical to do that, but I like to do it just do I know what's going on. 17

17

And then button, we are going to rename to start button,that is cool. 18

18

And you can see underneath the start button we have some text. 19

19

The text we will name start game. 20

20

Okay so that's all our naming done, 21

21

although I guess that's labeling as opposed to naming. 22

22

I'm going to double click the start button itself so it zooms in and 23

23

reposition that so it's in the middle of the screen. 24

24

You can see when the line goes blue it's in the middle, and hold down alt, so 25

25

I'm going to move this a little bit then hold down alt. 26

26

So it moves both sides, and drag it down a little bit, okay. 27

27

So we've got the button roughly the size that I want to have it, 28

28

on top of my game screen there. 29

29

I'm gonna have the two windows side by side, so 30

30

I can see how it actually looks in my game screen. 31

31

Drag this over, you see at the moment that it's not 32

32

matching with what we have on the left, with what we have on the right. 33

33

This is, as I move my perspective, I move the scaling of my window. 34

34

It's making a mess of my button here, 35

35

so let's clean that up by clicking on the main menu canvas. 36

36

See the canvas scaler here instead of constant pixel size say scale with 37

37

screen size. 38

38

Now as I move my window around, if we had different resolution and different scaling 39

39

and all that kind of good stuff, the button will stay as we want it. 40

40

And click on the button, that'll take me down to text. 41

41

Click on the button, there we go, I'm gonna move these handles. 42

42

Currently it's anchored just generally in the middle. 43

43

I'll click on the up, I'm sorry on the top, so 44

44

center top you can see it's anchored up the center top now. 45

45

What I want to do is anchor it relative to the rest of the screen. 46

46

So I need to grab the handles here, 47

47

pull that down to the bottom left, pull that to the bottom right. 48

48

So I have a handle on each of the corner of my canvas. 49

49

That means this will stay relative to screen size, as well. 50

50

As we move it around, it's going to stay anchored to its position 51

51

on the outside of the screen. 52

52

Last tip, click on the Start button. 53

53

I'm gonna change the color. 54

54

Well, this is probably the second last step, actually. 55

55

Make the color a little bit of a yellow. 56

56

And then the last step, click on Text. 57

57

And change the font size here, make this 50, nice and 58

58

big, probably change it to bold. 59

59

Plenty of scope in there for you to go and change the font, 60

60

maybe do some text mesh pro and make this look a little bit more fancy. 61

61

For now that's it. 62

62

Good for us. 63

63

Actually I told a fib, there's one last last step. 64

64

How many last steps are we going to have, Eric? 65

65

Well one last last step, which is change the highlight color and press color. 66

66

Highlight color will change to kind of an orangey color, 67

67

that's when you mouse over it. 68

68

And then when it is clicked, we'll change it to a darker, 69

69

kind of brownie color here. 70

70

So I click play, then mouse over it and we will see what effect that it has. 71

71

Mouse over, yep and then click. 72

72

And that's doing all the stuff that I want it to do. 73

73

And still move my character around independent of that. 74

74

You could just have the load next out level exit button down here. 75

75

And have the whole thing blank and 76

76

let the player figure it out when they come down here. 77

77

That would be cool as well, having an exciting way to learn how to. 78

78

Exit a level but 79

79

for now when it goes through this mechanism of doing stop button. 80

80

Okay, what we need to do for our button is give it a script and 81

81

with that script we want to load in the next scene. 82

82

So I come down to add component. 83

83

We'll call this menu, yes, and then create and add that. 84

84

Open up Visual Studio. 85

85

And this would be a very simple script in here. 86

86

I need to make sure we're using the namespace, 87

87

unityengine.scenemanagement. 88

88

Okay, now we're using that. 89

89

Going to remove the start and update functions, we don't need those. 90

90

Create our function, which we'll call StartFirstLevel, I think. 91

91

StartFirstLevel, and I typed that in first cuz I wanna 92

92

take a moment just to point out that we're gonna need to make this public. 93

93

So public Void needs to be public so that from our button, 94

94

we're in a position to cull this method, so that we can load the next level. 95

95

That's why we need to have it public. 96

96

And then what do we need to do in here? 97

97

Well, we need to say scenemanager.loadscene. 98

98

And what scene are we loading? 99

99

We'll load scene one. 100

100

That looks pretty good. 101

101

And we click on our selector here, hit the Scene tab. 102

102

And then we're looking for our start button, 103

103

which is in the scene, selected the start button. 104

104

Now we have the start button, which contains the menu script. 105

105

From there we can click on Menu and find Start First Level. 106

106

That should be the mechanism for when we click the button, 107

107

it will run this method and it will take us to the first level. 108

108

Let's see if that actually works, click play. 109

109

I ran a little bit, click the button, and 110

110

then it loads onto the next level, fantastic. 111

111

Okay, so that's the mechanism of creating a start button. 112

112

I want to top and tail the game, in other words have something at the front and 113

113

end by having a success screen as well. 114

114

That's my challenge for 115

115

you, create a success level, where we have a final you win screen. 116

116

Similar to the start menu but with a you win, and 117

117

then some sort of congratulations or well done this is fantastic. 118

118

And then a play again button, which will take the player back to the first level. 119

119

Or you could have it take them back to the main menu. 120

120

And then from there they can go to play. 121

121

So maybe I'll do it that way. 122

122

At the very end it says, finish or success or well done and 123

123

then have that take the player to the main menu. 124

124

And as a final step add some flair and share, 125

125

do something nifty with your final screen. 126

126

When the player wins do something cool and add some fireworks or 127

127

the play doing backflips, and share that with us. 128

128

And when you've done that I will see you back here. 129

129

Okay, let's quickly go through this together, 130

130

I'm going to duplicate my main menu, call this success. 131

131

Make sure that I've gone up into my build settings up Yonda, where are you? 132

132

File, build settings. 133

133

And to add Success in here and have it as index number 3. 134

134

Cool, that's all good. 135

135

We're currently selected on Main Menu. 136

136

Jump into Success screen. 137

137

And do just a little bit of editing, very quick editing here on the, 138

138

Screen itself, just to show it's a little bit different. 139

139

So Instead of climbing, we need to click on Foreground, and 140

140

then on my tile brush, my rule tile. 141

141

I'll get rid of all this stuff at the top here, 142

142

make it look like there's some opening that they've reached the end. 143

143

And some sort of, yeah, some sort of teasing them ladder, 144

144

that kind of goes nowhere, I think might be a little interesting. 145

145

Click on the climbing layer, click on the ladder, and then here's a ladder that sort 146

146

of just Ambiguously goes up to the top of the screen. 147

147

Okay not the greatest of final screen but 148

148

one of those things it could be a little bit cool having the player window. 149

149

What on earth should I be doing here? 150

150

We'll add something more complex as we make the game in more detail, 151

151

I think as for what we've got now. 152

152

Okay so we've just duplicated all the content over instead of our, where is it? 153

153

Instead of our main menu canvas, I'll rename this to finish canvas or success. 154

154

Success menu canvas, okay. 155

155

And then instead of the button being stop, 156

156

I'm going to have this a replay button, I think. 157

157

Replay good replay button, and 158

158

then the text will need to say replay game, good. 159

159

That looks pretty good. 160

160

Like I say you can differentiate this a bunch. 161

161

For now I'm just going through the role of functionality of it to 162

162

make sure it all works. 163

163

And then the script is gonna do exactly the same thing. 164

164

We need to point it back to the start. 165

165

So that's our end screen, if we're on here, loaded on the success menu. 166

166

Run around, run around, run around, and then click Replay Game. 167

167

It takes us back to the first level, it looks a little bit odd, 168

168

cuz I've started my player in the middle of the first level. 169

169

But we'd have it start in the proper place in the first level. 170

170

If we want to have that go back to the load screen, 171

171

then we would change the button. 172

172

Instead of it being Replay we would say, main menu, or something along those lines. 173

173

Change the button to main menu button, 174

174

and then we need to change, make a change for our script in here. 175

175

Jumping in the menu, reload, I guess I need to do that, yup. 176

176

And then we create another method instead of public void, 177

177

start first level, we're going to say Public void, 178

178

LoadMainMenu, and that will be a index of zero. 179

179

Okay, then back over into our, what's this we're on now. 180

180

Main menu button down here. 181

181

We need to change out on click, instead of being main menu. 182

182

Sorry, first startfirstlevel, it needs to be loadmainmenu, there we go. 183

183

We've saved that and 184

184

then click play, all going to play, this should take us back to the very start. 185

185

Click Main Menu, it takes us back to Start Game. 186

186

Start Game, Run through. 187

187

Get to the [SOUND]. 188

188

Okay, that killed me but that's all good. 189

189

So we've got our flow worked out now. 190

190

That should be enough functionality for you to be able to do your full flow from 191

191

Main Menu to Game through all the game scenes. 192

192

Back to the end, you win. 193

193

Once you have that success, 194

194

then you return back to the very start of the screen. 195

195

I said adding a little bit of flair or 196

196

a little bit of something in there, some text to let them know they actually won. 197

197

Let's do that very briefly. 198

198

So under my Success main menu, I'm gonna right-click, UI, Text. 199

199

And this text box will say something along the lines of, 200

200

let's see, winner, winner chicken dinner. 201

201

For those of you who are familiar with PUBG, you will know what that's all about. 202

202

We'll make this 30, and 203

203

we will change the size of that a little bit, go to my t tool here. 204

204

Move that, move this. 205

205

Little bit bigger, winner winner chicken dinner. 206

206

Okay, center that text and I think I will 207

207

put a line break in between these two, there we go, winner winner chicken dinner. 208

208

Its a little bit light, lets make it white in color. 209

209

The color of the text in here white, there we go. 210

210

Last step I'm just going to reposition my text to be above the menu and 211

211

my menu to be below my text, there we go. 212

212

Okay, not super pretty, but is super functional. 213

213

There we have our final success screen. 214

214

You've also created a main menu screen which has a start button that 215

215

launches the game. 216

216

That's the full flow and I'll see you in the next video for 217

217

some more chunky aspects of getting our game flowing nicely for the player. 218

218

See you in there.