1
00:00:01,004 --> 00:00:02,002
- [Instructor] Hi,

2
00:00:02,002 --> 00:00:04,003
and welcome to the first
section of this course.

3
00:00:04,003 --> 00:00:06,004
Abstraction and code management,

4
00:00:06,004 --> 00:00:09,000
making better use of OOP.

5
00:00:09,000 --> 00:00:10,000
In this section,

6
00:00:10,000 --> 00:00:13,000
we will start off with an
introduction to the final project,

7
00:00:13,000 --> 00:00:14,006
Thomas Was Late.

8
00:00:14,006 --> 00:00:16,003
We would then move on to structuring

9
00:00:16,003 --> 00:00:18,002
the Thomas Was Late code.

10
00:00:18,002 --> 00:00:19,004
In the later videos,

11
00:00:19,004 --> 00:00:21,003
we would learn building the game engine

12
00:00:21,003 --> 00:00:23,009
and coding the main function.

13
00:00:23,009 --> 00:00:27,000
Now we move on to the first
video of this section.

14
00:00:27,000 --> 00:00:29,004
The Thomas Was Late Game.

15
00:00:29,004 --> 00:00:30,003
In this video,

16
00:00:30,003 --> 00:00:33,002
we are going to take a look at
features of Thomas Was Late,

17
00:00:33,002 --> 00:00:34,009
creating a project from template

18
00:00:34,009 --> 00:00:37,003
and the project assets.

19
00:00:37,003 --> 00:00:38,002
At this point,

20
00:00:38,002 --> 00:00:39,005
if you haven't already,

21
00:00:39,005 --> 00:00:41,005
I would suggest you go and watch a video

22
00:00:41,005 --> 00:00:46,003
of Thomas Was Alone at
store.steampowered.com.

23
00:00:46,003 --> 00:00:47,004
Notice the really simple

24
00:00:47,004 --> 00:00:49,009
but aesthetically excellent graphics.

25
00:00:49,009 --> 00:00:53,005
The video also shows a
variety of gameplay challenges

26
00:00:53,005 --> 00:00:56,004
such as using the character
different attributes.

27
00:00:56,004 --> 00:00:59,007
Height, jump, power and so on.

28
00:00:59,007 --> 00:01:02,007
To keep our game simple
without losing the challenge,

29
00:01:02,007 --> 00:01:06,003
we will have fewer puzzle
features than Thomas Was Alone.

30
00:01:06,003 --> 00:01:08,000
But we'll have the additional challenge

31
00:01:08,000 --> 00:01:11,006
of creating the need for two
players to play cooperatively.

32
00:01:11,006 --> 00:01:13,008
Just to make sure the
game is not too easy,

33
00:01:13,008 --> 00:01:16,005
you will also make the players
race against the clock.

34
00:01:16,005 --> 00:01:18,002
Hence the name of our game is,

35
00:01:18,002 --> 00:01:20,003
Thomas Was Late.

36
00:01:20,003 --> 00:01:23,006
Our game will not be nearly
as advanced as the masterpiece

37
00:01:23,006 --> 00:01:25,002
that we're attempting to emulate.

38
00:01:25,002 --> 00:01:26,008
But we'll have a good selection

39
00:01:26,008 --> 00:01:28,005
of exciting gameplay features,

40
00:01:28,005 --> 00:01:29,008
like these.

41
00:01:29,008 --> 00:01:32,004
A clock that countdowns
from a time appropriate

42
00:01:32,004 --> 00:01:34,003
to the challenge of the level.

43
00:01:34,003 --> 00:01:36,001
Fire pits that are made of roar

44
00:01:36,001 --> 00:01:38,000
relative to the position of the player

45
00:01:38,000 --> 00:01:40,000
and respond the player at the start,

46
00:01:40,000 --> 00:01:41,006
if they fall in.

47
00:01:41,006 --> 00:01:43,005
Water pits have the same effect.

48
00:01:43,005 --> 00:01:46,003
But without the directional sound effects.

49
00:01:46,003 --> 00:01:48,001
Cooperative gameplay.

50
00:01:48,001 --> 00:01:50,003
Both of players will have
to get their characters

51
00:01:50,003 --> 00:01:52,009
to the goal within the allotted time.

52
00:01:52,009 --> 00:01:54,006
They will frequently
need to work together,

53
00:01:54,006 --> 00:01:57,005
for example the shorter
lower jumping bomb,

54
00:01:57,005 --> 00:02:00,006
will need to stand on his
friend's Thomas's head.

55
00:02:00,006 --> 00:02:03,002
The player will have the option
of switching between full

56
00:02:03,002 --> 00:02:04,004
and split screen.

57
00:02:04,004 --> 00:02:07,007
So he can attempt to control
both characters himself.

58
00:02:07,007 --> 00:02:11,002
Each level will be designed in
and loaded from a text file.

59
00:02:11,002 --> 00:02:13,004
This will make it really
easy to design varied

60
00:02:13,004 --> 00:02:15,004
and numerous levels.

61
00:02:15,004 --> 00:02:17,003
Take a look at this image of our game

62
00:02:17,003 --> 00:02:19,001
to see some of the features in action.

63
00:02:19,001 --> 00:02:22,003
And the component assets
that make up the game.

64
00:02:22,003 --> 00:02:25,002
Let's take a look at
each of those features.

65
00:02:25,002 --> 00:02:28,006
The image shows a simple HUD
that details the level number

66
00:02:28,006 --> 00:02:30,004
and the number of seconds remaining,

67
00:02:30,004 --> 00:02:33,009
until the players failed and
have to restart the level.

68
00:02:33,009 --> 00:02:35,003
You can also clearly see,

69
00:02:35,003 --> 00:02:37,008
the split screen co-op in action.

70
00:02:37,008 --> 00:02:39,008
Remember that this is optional.

71
00:02:39,008 --> 00:02:42,008
A single player can take
on the game full screen,

72
00:02:42,008 --> 00:02:46,006
while switching the camera
focus between Thomas and Bob.

73
00:02:46,006 --> 00:02:48,001
It is not very clear in this image

74
00:02:48,001 --> 00:02:49,006
but when a character dies,

75
00:02:49,006 --> 00:02:51,003
he will explode in a starburst,

76
00:02:51,003 --> 00:02:54,000
firework-like particle effect.

77
00:02:54,000 --> 00:02:57,003
The water and fire tiles
can be strategically place

78
00:02:57,003 --> 00:02:58,006
to make the level fun

79
00:02:58,006 --> 00:03:01,006
and force cooperation
between the characters.

80
00:03:01,006 --> 00:03:03,000
Notice Thomas and Bob,

81
00:03:03,000 --> 00:03:05,002
not only are they different in heights,

82
00:03:05,002 --> 00:03:06,007
but they also have significantly

83
00:03:06,007 --> 00:03:08,006
different jumping abilities.

84
00:03:08,006 --> 00:03:12,002
This means that Bob is dependent
upon Thomas for big jumps.

85
00:03:12,002 --> 00:03:15,001
And levels can be designed to
force Thomas to take a route

86
00:03:15,001 --> 00:03:17,006
that avoids him banging his head.

87
00:03:17,006 --> 00:03:18,005
In addition,

88
00:03:18,005 --> 00:03:21,005
the fire tiles will emit a roaring sound.

89
00:03:21,005 --> 00:03:24,003
This will be relative to
the position of Thomas.

90
00:03:24,003 --> 00:03:25,009
Not only will they be directional

91
00:03:25,009 --> 00:03:28,006
and come from either the
left or right speaker.

92
00:03:28,006 --> 00:03:30,009
They will also get louder and quieter

93
00:03:30,009 --> 00:03:34,005
as Thomas moves closer or
further away from the source.

94
00:03:34,005 --> 00:03:35,003
Here,

95
00:03:35,003 --> 00:03:37,004
Thomas and Bob arriving at the fire pit

96
00:03:37,004 --> 00:03:41,005
that Bob has no chance of
jumping over without help.

97
00:03:41,005 --> 00:03:44,003
This instance shows Bob
and Thomas collaborating

98
00:03:44,003 --> 00:03:46,007
to clear up precarious jump.

99
00:03:46,007 --> 00:03:48,009
Here we see how we can design puzzles,

100
00:03:48,009 --> 00:03:50,007
where our leap of faith is required

101
00:03:50,007 --> 00:03:53,001
in order to reach the goal.

102
00:03:53,001 --> 00:03:54,006
Look at this instance.

103
00:03:54,006 --> 00:03:57,000
See how we can design
oppressive cave systems

104
00:03:57,000 --> 00:03:58,008
of almost any size.

105
00:03:58,008 --> 00:04:00,002
We can also devise levels,

106
00:04:00,002 --> 00:04:02,006
where Bob and Thomas
are forced to split up

107
00:04:02,006 --> 00:04:04,003
and go different routes.

108
00:04:04,003 --> 00:04:06,004
Creating the Thomas Was Late project,

109
00:04:06,004 --> 00:04:09,000
is the same as the other two projects.

110
00:04:09,000 --> 00:04:12,001
I'll guide you through the
steps in visual studio.

111
00:04:12,001 --> 00:04:15,004
First you have select
file in the main menu

112
00:04:15,004 --> 00:04:16,002
and in that,

113
00:04:16,002 --> 00:04:18,004
you have to click new project.

114
00:04:18,004 --> 00:04:19,002
Now,

115
00:04:19,002 --> 00:04:23,001
make sure that Visual C++ is
selected in the left hand menu

116
00:04:23,001 --> 00:04:25,005
and then select HelloSFML,

117
00:04:25,005 --> 00:04:28,002
from the list of presented options.

118
00:04:28,002 --> 00:04:29,005
In the name field,

119
00:04:29,005 --> 00:04:32,001
type TWL in upper case

120
00:04:32,001 --> 00:04:33,001
and also ensure

121
00:04:33,001 --> 00:04:36,002
that the create directory for
solution option is checked.

122
00:04:36,002 --> 00:04:40,007
Now click OK.

123
00:04:40,007 --> 00:04:43,003
Now that our project is
created successfully,

124
00:04:43,003 --> 00:04:46,007
we need to copy the smfl.dll files

125
00:04:46,007 --> 00:04:48,007
which resides in SMFL,

126
00:04:48,007 --> 00:04:52,005
bin subfolder into the
main project directory.

127
00:04:52,005 --> 00:04:56,002
These are the dll files we have to copy.

128
00:04:56,002 --> 00:04:59,001
My main project directory
lies in documents.

129
00:04:59,001 --> 00:05:00,006
Visual Studio Stuff,

130
00:05:00,006 --> 00:05:01,004
Projects,

131
00:05:01,004 --> 00:05:02,004
TWL,

132
00:05:02,004 --> 00:05:04,001
TWL subfolder.

133
00:05:04,001 --> 00:05:07,004
Let's copy them into the TWL subfolder.

134
00:05:07,004 --> 00:05:11,007
So the project is now
setup and ready to go.

135
00:05:11,007 --> 00:05:14,003
The assets in this project
are even more numerous

136
00:05:14,003 --> 00:05:17,003
and diverse than the zombie arena game.

137
00:05:17,003 --> 00:05:19,006
As usual the assets include a font

138
00:05:19,006 --> 00:05:21,003
for the writing on the screen.

139
00:05:21,003 --> 00:05:24,001
Sound effects for different
actions such as jumping,

140
00:05:24,001 --> 00:05:27,001
reaching the goal or
the distant roar of fire

141
00:05:27,001 --> 00:05:30,000
and of course graphics for Thomas and Bob.

142
00:05:30,000 --> 00:05:33,006
As well as the spreadsheet
for all the background tiles.

143
00:05:33,006 --> 00:05:35,004
All the assets required for the game

144
00:05:35,004 --> 00:05:37,005
are included in the download bundle.

145
00:05:37,005 --> 00:05:39,009
They can be found in
section one graphics folder

146
00:05:39,009 --> 00:05:42,004
and sound folders respectively.

147
00:05:42,004 --> 00:05:43,005
As you can see,

148
00:05:43,005 --> 00:05:45,004
in section one graphics folder,

149
00:05:45,004 --> 00:05:47,003
we have images for background,

150
00:05:47,003 --> 00:05:48,003
Bob and Thomas,

151
00:05:48,003 --> 00:05:50,001
and this is our tiles sheet

152
00:05:50,001 --> 00:05:53,004
that we are going to use for
all of our background tiles.

153
00:05:53,004 --> 00:05:56,006
This is the sound folder
where we have various sounds

154
00:05:56,006 --> 00:05:59,004
which are fallinfire, fallinwater,

155
00:05:59,004 --> 00:06:02,008
fire1, jump and reach goal.

156
00:06:02,008 --> 00:06:04,005
Now in the fonts folder,

157
00:06:04,005 --> 00:06:07,002
the font that is required
has not been supplied.

158
00:06:07,002 --> 00:06:10,007
This is because I wanted to
avoid any possible ambiguity

159
00:06:10,007 --> 00:06:12,005
regarding license.

160
00:06:12,005 --> 00:06:14,001
This will not cause a problem though,

161
00:06:14,001 --> 00:06:16,007
as I will show you exactly where and how,

162
00:06:16,007 --> 00:06:19,009
to choose and download fonts for yourself.

163
00:06:19,009 --> 00:06:22,007
In addition to the
graphics, sound and fonts

164
00:06:22,007 --> 00:06:24,004
that we have come to expect,

165
00:06:24,004 --> 00:06:27,004
this game has two new asset types.

166
00:06:27,004 --> 00:06:29,001
There are level design files

167
00:06:29,001 --> 00:06:31,009
and GLSL shader programs.

168
00:06:31,009 --> 00:06:34,008
Let's find out about each of them.

169
00:06:34,008 --> 00:06:37,003
Levels are all created in a text file,

170
00:06:37,003 --> 00:06:39,008
by using the numbers zero through three,

171
00:06:39,008 --> 00:06:43,001
we can build level designs
to challenge players.

172
00:06:43,001 --> 00:06:45,007
All the level designs
are in the levels folder

173
00:06:45,007 --> 00:06:49,002
in the same directory as the other assets.

174
00:06:49,002 --> 00:06:51,003
In addition to these level design assets,

175
00:06:51,003 --> 00:06:53,006
we have a special type of graphical asset

176
00:06:53,006 --> 00:06:55,006
called shaders.

177
00:06:55,006 --> 00:06:58,004
Shaders are programs written in GLSL,

178
00:06:58,004 --> 00:07:01,000
Graphics Library Shading Language.

179
00:07:01,000 --> 00:07:03,001
Don't worry about having
to learn another language

180
00:07:03,001 --> 00:07:05,009
as we don't need to get too
in-depth to take advantage

181
00:07:05,009 --> 00:07:06,009
of shaders.

182
00:07:06,009 --> 00:07:08,002
Shaders are a special

183
00:07:08,002 --> 00:07:12,000
as they are entire programs
separate from our C++ code

184
00:07:12,000 --> 00:07:15,007
which are executed by the
GPU each and every frame.

185
00:07:15,007 --> 00:07:18,009
In fact some of these shader
programs are run every frame

186
00:07:18,009 --> 00:07:21,001
for every pixel.

187
00:07:21,001 --> 00:07:23,009
Let's see how we're
going to use the assets.

188
00:07:23,009 --> 00:07:26,000
The graphical assets make up the parts

189
00:07:26,000 --> 00:07:27,008
of the scene of our game.

190
00:07:27,008 --> 00:07:29,006
Take a look at the graphical assets

191
00:07:29,006 --> 00:07:33,001
and it should be clear where
in our game they will be used.

192
00:07:33,001 --> 00:07:36,001
If the tiles on the tiles_sheet graphic

193
00:07:36,001 --> 00:07:37,005
look a little different,

194
00:07:37,005 --> 00:07:39,008
this is because they
are partly transparent

195
00:07:39,008 --> 00:07:43,001
and the background showing
through changes them a little.

196
00:07:43,001 --> 00:07:45,008
If the background graphic
looks totally different

197
00:07:45,008 --> 00:07:47,007
to the actual background in the game,

198
00:07:47,007 --> 00:07:50,001
that is because the shader
programs we will write

199
00:07:50,001 --> 00:07:52,006
will manipulate each and every pixel,

200
00:07:52,006 --> 00:07:57,000
each and every frame to create
a kind of moulton effect.

201
00:07:57,000 --> 00:07:59,003
Now for the sound assets.

202
00:07:59,003 --> 00:08:01,009
These are all .wav format.

203
00:08:01,009 --> 00:08:04,001
These are files that
contain the sound effects

204
00:08:04,001 --> 00:08:07,003
we will play at certain
events throughout the game.

205
00:08:07,003 --> 00:08:10,000
First, fallinfire.wav.

206
00:08:10,000 --> 00:08:12,005
A sound that will be played
when the player's head,

207
00:08:12,005 --> 00:08:16,006
goes into the fire and the
player has no chance of escape.

208
00:08:16,006 --> 00:08:18,007
Fallinwater.wav.

209
00:08:18,007 --> 00:08:21,003
Water has the same end effect as fire,

210
00:08:21,003 --> 00:08:22,004
death.

211
00:08:22,004 --> 00:08:24,006
This sound effect notifies the player,

212
00:08:24,006 --> 00:08:27,001
they need to start from
the beginning of the level.

213
00:08:27,001 --> 00:08:29,003
Fire1.wav.

214
00:08:29,003 --> 00:08:31,008
This sound effect is recorded in mono.

215
00:08:31,008 --> 00:08:33,008
It will be played in different volumes

216
00:08:33,008 --> 00:08:36,004
based on the player's
distance from fire tiles

217
00:08:36,004 --> 00:08:39,002
and from different speakers
based on whether the player

218
00:08:39,002 --> 00:08:42,005
is to the left or the
right of the fire tile.

219
00:08:42,005 --> 00:08:44,008
Clearly we will need to
learn a few more tricks

220
00:08:44,008 --> 00:08:47,000
to implement this functionality.

221
00:08:47,000 --> 00:08:48,004
Jump.wav.

222
00:08:48,004 --> 00:08:51,001
A pleasing slightly
predictable whooping sound

223
00:08:51,001 --> 00:08:53,000
when the player jumps.

224
00:08:53,000 --> 00:08:54,006
Reachgoal.wav.

225
00:08:54,006 --> 00:08:56,006
A pleasing victory sound
from when the player

226
00:08:56,006 --> 00:08:58,009
or players gets both characters,

227
00:08:58,009 --> 00:08:59,009
Thomas and Bob,

228
00:08:59,009 --> 00:09:01,009
to the goal tile.

229
00:09:01,009 --> 00:09:04,007
Now that we've decided
which assets we'll use,

230
00:09:04,007 --> 00:09:07,002
it is time to add them to the project.

231
00:09:07,002 --> 00:09:09,003
In case you using different assets,

232
00:09:09,003 --> 00:09:11,002
simply replace to your appropriate sound

233
00:09:11,002 --> 00:09:13,006
or graphic file with your chosen file,

234
00:09:13,006 --> 00:09:17,000
using exactly the same file name.

235
00:09:17,000 --> 00:09:17,008
First,

236
00:09:17,008 --> 00:09:20,001
we have to browse to the visual directory.

237
00:09:20,001 --> 00:09:22,005
My project directory is highlighted here.

238
00:09:22,005 --> 00:09:25,002
This is the TWL subfolder.

239
00:09:25,002 --> 00:09:28,001
Create five new folders within this folder

240
00:09:28,001 --> 00:09:29,007
and name them as fonts,

241
00:09:29,007 --> 00:09:33,002
graphics, levels, shaders and sound.

242
00:09:33,002 --> 00:09:35,000
Now from the download bundle,

243
00:09:35,000 --> 00:09:37,006
copy the entire contents of section one

244
00:09:37,006 --> 00:09:40,003
into the TWL graphics folder.

245
00:09:40,003 --> 00:09:42,004
I've copied and pasted them here.

246
00:09:42,004 --> 00:09:43,003
Summarily,

247
00:09:43,003 --> 00:09:45,006
copy the entire contents of sound folder

248
00:09:45,006 --> 00:09:47,000
from the download bundle

249
00:09:47,000 --> 00:09:49,007
into the TWL sound folder.

250
00:09:49,007 --> 00:09:51,007
You can see I pasted the entire content

251
00:09:51,007 --> 00:09:54,004
of sound folder here.

252
00:09:54,004 --> 00:09:55,005
Now for the fonts.

253
00:09:55,005 --> 00:09:58,003
Visit dafont.com in your web browser.

254
00:09:58,003 --> 00:10:01,008
And then download the roboto light font.

255
00:10:01,008 --> 00:10:04,005
You'll get this roboto.zip file.

256
00:10:04,005 --> 00:10:07,004
Extract the contents of the zip download.

257
00:10:07,004 --> 00:10:10,003
This is the folder
created after extraction.

258
00:10:10,003 --> 00:10:11,002
In this folder,

259
00:10:11,002 --> 00:10:15,008
select the Roboto-Light.ttv file.

260
00:10:15,008 --> 00:10:18,006
Copy this to our fonts folder.

261
00:10:18,006 --> 00:10:21,004
We are done with fonts,
graphics and sound.

262
00:10:21,004 --> 00:10:24,005
Now we're left with levels and shaders.

263
00:10:24,005 --> 00:10:25,008
From the download bundle,

264
00:10:25,008 --> 00:10:27,002
copy the entire contents

265
00:10:27,002 --> 00:10:30,009
of section one levels
into our levels folder.

266
00:10:30,009 --> 00:10:32,001
Summarily for shaders,

267
00:10:32,001 --> 00:10:33,002
from the download bundle,

268
00:10:33,002 --> 00:10:36,002
copy the entire contents
of section one shaders

269
00:10:36,002 --> 00:10:38,001
into our shaders folder.

270
00:10:38,001 --> 00:10:40,008
Now that we have a new project
along with all the assets

271
00:10:40,008 --> 00:10:42,008
we will need for the entire project,

272
00:10:42,008 --> 00:10:44,003
we can talk about how we will structure

273
00:10:44,003 --> 00:10:46,001
the game engine code.

274
00:10:46,001 --> 00:10:47,001
In this video,

275
00:10:47,001 --> 00:10:49,000
we've looked to the Thomas Was Late game,

276
00:10:49,000 --> 00:10:51,002
creating the project and from template

277
00:10:51,002 --> 00:10:53,001
and the project assets.

278
00:10:53,001 --> 00:10:54,002
Cool.

279
00:10:54,002 --> 00:10:57,009
Next we'll see structuring
the Thomas Was Late code.

