-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathbehaviour.html
431 lines (416 loc) · 16.5 KB
/
behaviour.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Carlos Redolar TFG - Enemy design and game balance</title>
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
<meta
content="Game balance, Enemy design, TFG, Game design, Roguelite"
name="keywords"
/>
<meta content="Carlos Redolar TFG" name="description" />
<meta content="Carlos Redolar Torres" name="author" />
<!-- Favicon -->
<link href="img/favicon.ico" rel="icon" />
<!-- Google Web Fonts -->
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link
href="https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap"
rel="stylesheet"
/>
<!-- Font Awesome -->
<script
src="https://kit.fontawesome.com/48f76e4ac0.js"
crossorigin="anonymous"
></script>
<link
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css"
rel="stylesheet"
/>
<!-- Libraries Stylesheet -->
<link href="lib/owlcarousel/assets/owl.carousel.min.css" rel="stylesheet" />
<!-- Customized Bootstrap Stylesheet -->
<link href="css/style.css" rel="stylesheet" />
</head>
<body>
<!-- Topbar Start -->
<div class="container-fluid bg-dark">
<div class="row py-2 px-lg-5">
<div class="col-lg-6 text-center text-lg-left mb-2 mb-lg-0">
<div class="d-inline-flex align-items-center text-white">
<small
><i class="fa fa-envelope mr-2"></i
>carlos.redolar.torres@gmail.com</small
>
</div>
</div>
<div class="col-lg-6 text-center text-lg-right">
<div class="d-inline-flex align-items-center">
<a
class="text-white px-2"
href="mailto:carlos.redolar.torres@gmail.com?Subject=Hey!"
>
<i class="fa fa-envelope"></i>
</a>
<a
class="text-white px-2"
href="https://www.linkedin.com/in/carlos-redolar/"
>
<i class="fab fa-linkedin-in"></i>
</a>
<a class="text-white px-2" href="https://github.com/carlosredolar">
<i class="fab fa-github"></i>
</a>
</div>
</div>
</div>
</div>
<!-- Topbar End -->
<!-- Navbar Start -->
<div class="container-fluid p-0">
<nav
class="navbar navbar-expand-lg bg-light navbar-light py-3 py-lg-0 px-lg-5"
>
<button
type="button"
class="navbar-toggler"
data-toggle="collapse"
data-target="#navbarCollapse"
>
<span class="navbar-toggler-icon"></span>
</button>
<div
class="collapse navbar-collapse justify-content-between px-lg-5"
id="navbarCollapse"
>
<div class="navbar-nav m-auto py-0">
<a href="home.html" class="nav-item nav-link">Home</a>
<div class="nav-item dropdown">
<a
href="single.html"
class="nav-link dropdown-toggle active"
data-toggle="dropdown"
>Abilities&Behaviours</a
>
<div class="dropdown-menu rounded-0 m-0">
<a href="attack.html" class="dropdown-item">Attack type</a>
<a href="movement.html" class="dropdown-item">Movement type</a>
<a href="abilities.html" class="dropdown-item"
>Extra abilities</a
>
<a href="behaviour.html" class="dropdown-item">AI behaviour</a>
</div>
</div>
<a href="enemy.html" class="nav-item nav-link">Enemy design</a>
<a href="balance.html" class="nav-item nav-link">Game Balance</a>
<a href="contact.html" class="nav-item nav-link">Contact</a>
</div>
</div>
</nav>
</div>
<!-- Navbar End -->
<!-- Header Start -->
<div class="jumbotron jumbotron-fluid mb-5">
<div class="container text-center py-5">
<h1 class="text-primary display-3">AI behaviour</h1>
<div class="d-inline-flex align-items-center text-white">
<p class="m-0"><a class="text-white" href="home.html">Home</a></p>
<i class="fa fa-circle px-3"></i>
<p class="m-0">Abilities&Behaviours</p>
<i class="fa fa-circle px-3"></i>
<p class="m-0">
<a class="text-white" href="behaviour.html">AI behaviour</a>
</p>
</div>
</div>
</div>
<!-- Header End -->
<!-- Abilities&Behaviors Start -->
<div class="container-fluid pt-5">
<div class="container">
<div class="text-center pb-2">
<h1 class="mb-4">Movement behaviour</h1>
</div>
<p class="mb-4">
In terms of how enemies move, we can find 4 main ways to calculate
their trajectory:
</p>
<ul class="list-inline pl-5">
<li>
<h7><i class="far fa-dot-circle text-grey mr-2"></i>Chase</h7>
</li>
<li>
<h7><i class="far fa-dot-circle text-grey mr-2"></i>Patrol</h7>
</li>
<li>
<h7><i class="far fa-dot-circle text-grey mr-2"></i>Static</h7>
</li>
</ul>
<p class="mb-4">
In the games we have analysed, we found the basic movement patterns:
tracking, random and static. It is true that in some games other than
those analysed, we found enemies that use artificial intelligence to
calculate a route that cuts off the player. Because the enemies'
movement speed is usually much slower than the playable character's
movements, this predictive route is, in practice, too similar to the
route calculated in the tracking or chase method.
</p>
<div class="container-fluid pt-2">
<div class="text-center pb-2">
<h5 class="text-primary text-uppercase font-weight-bold">
Chasing the player
</h5>
</div>
<div class="row pb-3">
<p class="mb-4">
The method of movement of most melee attack enemies will be to
follow the player, as they have to get close to the player to
attack.
</p>
</div>
<div class="row pb-3">
<div class="col-lg-4 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/archero_white_skull.gif"
alt=""
/>
</div>
<div class="col-lg-8 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/hades_gordo_maza.gif"
alt=""
/>
</div>
</div>
<div class="row pb-3">
<p class="mb-4">
On other enemies with medium and long range attacks this behaviour
can also be seen, they simply track the player until they are in
range of their attack or ability.
</p>
</div>
<div class="row pb-3">
<div class="col-lg-6 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/hades_calaveras.gif"
alt=""
/>
</div>
<div class="col-lg-6 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/moonlighter_wind_tree.gif"
alt=""
/>
</div>
</div>
</div>
<div class="container-fluid pt-2">
<div class="text-center pb-2">
<h5 class="text-primary text-uppercase font-weight-bold">
Patroling
</h5>
</div>
<div class="row pb-3">
<p class="mb-4">
The random location method will be most commonly used on enemies with ranged attacks. It
is a way for these ranged attackers to get new angles from which to attack the player
while avoiding the difficult terrain, and also to indirectly defend themselves, as in most
cases they would run away from the character. The way this movement is calculated is
through a range, the enemy has a range within which a random position is determined and
the enemy goes there. Once he reaches this position, the process is repeated.
</p>
</div>
<div class="row pb-3">
<div class="col-lg-4 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/archero_fireball_mage.gif"
alt=""
/>
</div>
<div class="col-lg-8 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/hades_witch_moves.gif"
alt=""
/>
</div>
</div>
<img
class="img-fluid w-100 pb-5"
src="gifs/moonlighter_landscaper.gif"
alt=""
/>
<div class="row pb-3">
<p class="mb-4">
Another way to implement the random trajectory method is on some kind of fast melee enemy,
which being so fast and making such unpredictable movements makes it a very different kind
of skill, which turns a behavioural and movement mechanic into its attack skill, which we
must dodge.
</p>
</div>
<div class="row pb-3">
<div class="col-lg-4 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/archero_slimes.gif"
alt=""
/>
</div>
<div class="col-lg-8 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/moonlighter_spinning_mushroom.gif"
alt=""
/>
</div>
</div>
</div>
<div class="container-fluid pt-2">
<div class="text-center pb-2">
<h5 class="text-primary text-uppercase font-weight-bold">
Static
</h5>
</div>
<div class="row pb-3">
<p class="mb-4">
In the case of static enemies, one could simply say that they lack movement mechanics and
behaviour. As a general rule, enemies that lack such mechanics are due to the complexity
or difficulty of their other mechanics, such as attack mechanics or passive abilities.
They tend to be long-ranged enemies that fire a large number of projectiles, as these are
a big problem for the player, being static makes them more predictable and more vulnerable.
So this lack of movement is a way to reduce the difficulty in those cases.
</p>
</div>
<div class="row pb-3">
<p class="mb-4">
A static enemy will remain in the same position designated by the designer, which may
be a design decision to put the player in more trouble. An enemy strategically placed
in a privileged position may no longer be privileged if a different behaviour is added
to it, as it will move out of that position upon interaction with the player.
</p>
</div>
<div class="row pb-3">
<div class="col-lg-4 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/archero_plants.gif"
alt=""
/>
</div>
<div class="col-lg-8 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/hades_skullomat.gif"
alt=""
/>
</div>
</div>
<img
class="img-fluid w-100 pb-5"
src="gifs/moonlighter_lava_catapult.gif"
alt=""
/>
<div class="row pb-3">
<p class="mb-4">
There are a variety of static enemies, enemies that have the ability to move or an ability
that allows them to change position. They fall into this category due to the fact that they
are mostly anchored to the ground for a prolonged period of time making them more
vulnerable. We find enemies that move slightly between attacks.
</p>
</div>
<div class="row pb-3">
<div class="col-lg-6 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/hades_crystal.gif"
alt=""
/>
</div>
<div class="col-lg-6 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/dead_cells_archer.gif"
alt=""
/>
</div>
</div>
<div class="row pb-3">
<p class="mb-4">
And enemies with some movement ability such as teleportation, which they use to
protect themselves after an attack.
</p>
</div>
<div class="row pb-3">
<div class="col-lg-4 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/archero_hole_plants.gif"
alt=""
/>
</div>
<div class="col-lg-8 col-md-6 text-center mb-5">
<img
class="img-fluid w-100"
src="gifs/moonlighter_fire_puppet.gif"
alt=""
/>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Abilities&Behaviors End -->
<!-- Footer Start -->
<div class="container-fluid bg-dark text-white mt-3 py-3 px-sm-1 px-md-3">
<div class="row pt-2">
<div class="container text-center py-5">
<h3 class="text-primary mb-4">Contact</h3>
<p>
<i class="fa fa-envelope mr-2"></i>carlos.redolar.torres@gmail.com
</p>
<a
class="btn btn-outline-light btn-social mr-2"
href="mailto:carlos.redolar.torres@gmail.com?Subject=Hey!"
><i class="fa fa-envelope"></i
></a>
<a
class="btn btn-outline-light btn-social mr-2"
href="https://www.linkedin.com/in/carlos-redolar/"
><i class="fab fa-linkedin-in"></i
></a>
<a
class="btn btn-outline-light btn-social mr-2"
href="https://github.com/carlosredolar"
><i class="fab fa-github"></i
></a>
</div>
</div>
</div>
<!-- Footer End -->
<!-- Back to Top -->
<a href="#" class="btn btn-lg btn-primary back-to-top"
><i class="fa fa-angle-double-up"></i
></a>
<!-- JavaScript Libraries -->
<script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.bundle.min.js"></script>
<script src="lib/easing/easing.min.js"></script>
<script src="lib/waypoints/waypoints.min.js"></script>
<script src="lib/counterup/counterup.min.js"></script>
<script src="lib/owlcarousel/owl.carousel.min.js"></script>
<!-- Contact Javascript File -->
<script src="mail/jqBootstrapValidation.min.js"></script>
<script src="mail/contact.js"></script>
<!-- Template Javascript -->
<script src="js/main.js"></script>
</body>
</html>