0:00:00.269,0:00:05.930
Acht maanden voordat The Last of Us [br]klaar was, begon Naughty Dog eindelijk...

0:00:05.930,0:00:08.500
...aan diens gebruikersinterface.

0:00:08.500,0:00:14.020
'Sommige UI-elementen waren er in grote[br]lijnen al', aldus designer Alexandria...

0:00:14.020,0:00:18.930
...Neonakis, 'maar er was nog geen[br]algemene HUD-design, en veel...

0:00:18.930,0:00:21.100
...dingen waren nog onduidelijk.'

0:00:21.100,0:00:26.150
Dat bewijst dat de UI een[br]ondergewaardeerd aspect...

0:00:26.150,0:00:27.560
...van game-ontwikkeling kan zijn.

0:00:27.560,0:00:28.970
Een irritante bijkomstigheid, die[br]lastminute gemaakt wordt.

0:00:28.970,0:00:32.870
Ik vind dat het onderschat wordt,[br]want de UI kan veel impact hebben...

0:00:32.870,0:00:39.250
...op hoe een game eruit ziet, werkt[br]en voelt.

0:00:39.250,0:00:42.610
Daarom wil ik in deze aflevering de overlap[br]onderzoeken tussen UI en...

0:00:42.610,0:00:48.750
...gamedesign: hoe veranderen[br]staminameters onze speelstijl?

0:00:48.750,0:00:54.630
UI omvat veel verschillende dingen.

0:00:54.630,0:00:59.150
Onlinelobby's, inventarissen, dialogen,[br]craftmenu's, winkelpagina's, enzovoort.

0:00:59.150,0:01:05.769
In deze video focus ik me echter op [br]de heads-up display, oftewel de HUD.

0:01:05.769,0:01:13.179
Alles wat je ziet bovenop de gameplay,[br]middenin de actie.

0:01:13.179,0:01:17.819
De eerst vraag is: welk doel heeft de HUD,[br]en wat heeft...

0:01:17.819,0:01:23.270
...de speler er aan?

0:01:23.270,0:01:25.189
Om die vraag te beantwoorden, deel[br]ik de HUD op in twee delen:

0:01:25.189,0:01:30.189
de metertjes en de previews.

0:01:30.189,0:01:34.130
Meestal denken we bij HUDs [br]aan de metertjes.

0:01:34.130,0:01:37.829
Die laten normaal onzichtbare informatie[br]zien aan...

0:01:37.829,0:01:42.310
...de speler.

0:01:42.310,0:01:43.310
De gezondheid van een personage zit verstopt[br]in de code, maar een gezondheidsbalk...

0:01:43.310,0:01:48.409
..kan die zichtbaar maken.

0:01:48.409,0:01:50.270
AI-gedrag is moeilijk te doorgronden[br]zonder visuele hulpmiddelen...

0:01:50.270,0:01:56.770
...zoals aanvalsindicatoren.

0:01:56.770,0:01:58.590
Door camarabeperkingen kan belangrijke info onzichtbaar zijn, tenzij het wordt...

0:01:58.590,0:02:03.439
...belicht met indicatoren of een minikaart.

0:02:03.439,0:02:07.090
Met de metertjes kunnen spelers de staat van de gamewereld begrijpen...

0:02:07.090,0:02:11.799
...waar ze vervolgens weer op kunnen inspelen.

0:02:11.799,0:02:15.700
Hier een casestudy van de deckbuilder Slay the Spire.

0:02:15.700,0:02:20.326
In de eerste ontwikkelingsfase gaven vijanden geen indicatie van wat ze van plan waren.

0:02:20.326,0:02:25.219
Spelers wisten dus niet wanneer ze moesten blocken of aanvallen, en deden...

0:02:25.219,0:02:29.670
...dus maar wat.

0:02:29.670,0:02:31.250
Als oplossing voegde de ontwikkelaar deze indicatoren toe om te laten zien wat...

0:02:31.250,0:02:36.420
...de vijand hierna doet.

0:02:36.420,0:02:37.450
Nu kunnen spelers betere keuzes maken over welke...

0:02:37.450,0:02:41.750
...strategieën ze moeten toepassen.

0:02:41.750,0:02:44.780
Dat zijn de metertjes.

0:02:44.780,0:02:46.090
Previews laten zien wat er gebeurt als je op een knop drukt...

0:02:46.090,0:02:50.760
...of een actie uitvoert.

0:02:50.760,0:02:52.320
Een voorbeeld: de pop-upknoppen voor contextuele acties...

0:02:52.320,0:02:57.480
...zoals 'druk op X om de deur te openen' of 'druk op E om in het massagraf te springen'.

0:02:57.480,0:03:02.950
Wat.

0:03:02.950,0:03:03.950
Eh.

0:03:03.950,0:03:04.950
Andere voorbeelden: een boog waarmee je kunt zien waar...

0:03:04.950,0:03:08.420
...je granaat land.

0:03:08.420,0:03:09.450
Een indicator die je laat zien waar je je enterhaak kan gebruiken.

0:03:09.450,0:03:12.710
Een signaal dat je laat zien welke vijand je in je vizier hebt.

0:03:12.710,0:03:15.740
Of deze lijn waarmee je ziet waar je XCOM-eenheid heengaat.

0:03:15.740,0:03:21.060
Door previews weten spelers wat de consequenties zijn van de acties...

0:03:21.060,0:03:25.050
...die ze kunnen nemen, voordat ze ze daadwerkelijk uitvoeren.

0:03:25.050,0:03:28.069
Zo kunnen spelers handelen met zélfvertrouwen in plaats van blínd vertrouwen.

0:03:28.069,0:03:32.790
Laten we ons richten op Shovel Knight.

0:03:32.790,0:03:35.930
Spector Knight heeft een dash-slashmove, waarmee hij...

0:03:35.930,0:03:41.120
...dwars door bepaalde objecten kan dashen.

0:03:41.120,0:03:44.940
Eerst had de ontwikkelaar dit belicht met een simpele poseverandering...

0:03:44.940,0:03:49.840
...maar het bleek dat dit spelers niet voldoende informeerde over waar of wanneer deze...

0:03:49.840,0:03:55.920
...actie kan gebeuren, of waar het personage aan het eind terecht komt.

0:03:55.920,0:04:00.800
Uiteindelijk voegden de ontwikkelaars een indicator toe wanneer je in de buurt komt van objecten.

0:04:00.800,0:04:06.540
Dit laat duidelijk zien wanneer je de dash-slash kan uitvoeren...

0:04:06.540,0:04:10.980
...en waar je daarna landt.

0:04:10.980,0:04:15.630
Die toevoeging was 'de belangrijkste verandering om de dash-slash begrijpelijk te maken'...

0:04:15.630,0:04:20.959
...aldus de herinnering.

0:04:20.959,0:04:24.340


0:04:24.340,0:04:30.250


0:04:30.250,0:04:34.130


0:04:34.130,0:04:40.680


0:04:40.680,0:04:45.129


0:04:45.129,0:04:48.169


0:04:48.169,0:04:52.590


0:04:52.590,0:04:56.300


0:04:56.300,0:05:01.159


0:05:01.159,0:05:05.580


0:05:05.580,0:05:11.960


0:05:11.960,0:05:16.159


0:05:16.159,0:05:21.029


0:05:21.029,0:05:25.820


0:05:25.820,0:05:30.159


0:05:30.159,0:05:32.419


0:05:32.419,0:05:38.110


0:05:38.110,0:05:41.990


0:05:41.990,0:05:44.330


0:05:44.330,0:05:48.650


0:05:48.650,0:05:52.919


0:05:52.919,0:05:56.729


0:05:56.729,0:05:59.860


0:05:59.860,0:06:04.600


0:06:04.600,0:06:08.740


0:06:08.740,0:06:12.430


0:06:12.430,0:06:18.159


0:06:18.159,0:06:20.500


0:06:20.500,0:06:24.800


0:06:24.800,0:06:25.900


0:06:25.900,0:06:29.979


0:06:29.979,0:06:34.449


0:06:34.449,0:06:40.349


0:06:40.349,0:06:44.440


0:06:44.440,0:06:48.939


0:06:48.939,0:06:51.050


0:06:51.050,0:06:56.436


0:06:56.436,0:06:57.680


0:06:57.680,0:07:03.430


0:07:03.430,0:07:10.580


0:07:10.580,0:07:15.029


0:07:15.029,0:07:20.839


0:07:20.839,0:07:26.900


0:07:26.900,0:07:31.099


0:07:31.099,0:07:32.099


0:07:32.099,0:07:36.459


0:07:36.459,0:07:41.529


0:07:41.529,0:07:45.849


0:07:45.849,0:07:48.089


0:07:48.089,0:07:52.839


0:07:52.839,0:07:54.960


0:07:54.960,0:07:59.879


0:07:59.879,0:08:06.300


0:08:06.300,0:08:11.699


0:08:11.699,0:08:13.800


0:08:13.800,0:08:18.830


0:08:18.830,0:08:20.319


0:08:20.319,0:08:23.740


0:08:23.740,0:08:27.419


0:08:27.419,0:08:31.639


0:08:31.639,0:08:36.740


0:08:37.760,0:08:42.310


0:08:42.310,0:08:44.280


0:08:44.280,0:08:49.570


0:08:49.570,0:08:52.620


0:08:52.620,0:08:57.745


0:08:57.745,0:09:02.585


0:09:02.585,0:09:05.460


0:09:05.460,0:09:09.550


0:09:09.550,0:09:13.890


0:09:13.890,0:09:19.560


0:09:19.560,0:09:23.440


0:09:23.440,0:09:28.910


0:09:28.910,0:09:32.310


0:09:32.310,0:09:37.100


0:09:37.100,0:09:41.600


0:09:41.600,0:09:47.120


0:09:47.120,0:09:50.760


0:09:50.760,0:09:55.560


0:09:55.560,0:10:01.380


0:10:01.380,0:10:06.590


0:10:06.590,0:10:11.430


0:10:11.430,0:10:13.030


0:10:13.030,0:10:15.910


0:10:15.910,0:10:20.370


0:10:20.370,0:10:25.020


0:10:25.020,0:10:29.560


0:10:29.560,0:10:33.970


0:10:33.970,0:10:35.500


0:10:35.500,0:10:36.920


0:10:36.920,0:10:41.940


0:10:41.940,0:10:44.260


0:10:44.260,0:10:48.580


0:10:48.580,0:10:52.090


0:10:52.090,0:10:57.051


0:10:57.051,0:11:00.220


0:11:00.220,0:11:05.360


0:11:05.360,0:11:06.700


0:11:06.700,0:11:10.990


0:11:10.990,0:11:13.360


0:11:13.360,0:11:19.790


0:11:19.790,0:11:20.890


0:11:20.890,0:11:25.590


0:11:25.590,0:11:29.990


0:11:29.990,0:11:31.740


0:11:31.740,0:11:37.180


0:11:37.180,0:11:38.305


0:11:38.305,0:11:40.620


0:11:40.620,0:11:44.610


0:11:44.610,0:11:49.530


0:11:49.530,0:11:53.360


0:11:53.360,0:11:58.100


0:11:58.100,0:11:59.100


0:11:59.100,0:12:03.380


0:12:03.380,0:12:04.380


0:12:04.380,0:12:08.260


0:12:08.260,0:12:09.260


0:12:09.260,0:12:14.430


0:12:14.430,0:12:16.490


0:12:16.490,0:12:21.200


0:12:21.200,0:12:25.110


0:12:25.110,0:12:30.250


0:12:30.250,0:12:33.030


0:12:33.030,0:12:38.550


0:12:38.550,0:12:40.010


0:12:40.010,0:12:45.010


0:12:45.010,0:12:49.720


0:12:49.720,0:12:54.620


0:12:54.620,0:12:59.860


0:12:59.860,0:13:03.880


0:13:03.880,0:13:05.670


0:13:05.670,0:13:11.130


0:13:11.130,0:13:16.280


0:13:16.280,0:13:18.070


0:13:18.070,0:13:23.190


0:13:23.190,0:13:27.970


0:13:27.970,0:13:29.580


0:13:29.580,0:13:35.590


0:13:35.590,0:13:39.230


0:13:39.230,0:13:42.270


0:13:42.270,0:13:45.810


0:13:45.810,0:13:52.090


0:13:52.090,0:13:57.200


0:13:57.200,0:13:59.620


0:13:59.620,0:14:04.470


0:14:04.470,0:14:09.180


0:14:09.180,0:14:14.650


0:14:14.650,0:14:20.230


0:14:20.230,0:14:23.640


0:14:23.640,0:14:30.070


0:14:30.070,0:14:35.730


0:14:35.730,0:14:42.510


0:14:42.510,0:14:46.480


0:14:46.480,0:14:48.870


0:14:48.870,0:14:54.050


0:14:54.050,0:14:58.910


0:14:58.910,0:15:03.850


0:15:03.850,0:15:05.240


0:15:05.240,0:15:09.920


0:15:09.920,0:15:13.330


0:15:13.330,0:15:16.090


0:15:16.090,0:15:21.280


0:15:21.280,0:15:23.580


0:15:23.580,0:15:29.360


0:15:29.360,0:15:34.279


0:15:34.279,0:15:36.590


0:15:36.590,0:15:42.410


0:15:42.410,0:15:46.450


0:15:46.450,0:15:50.540


0:15:50.540,0:15:53.561


0:15:53.561,0:15:57.380


0:15:57.380,0:16:04.160


0:16:04.160,0:16:06.860


0:16:06.860,0:16:13.080


0:16:13.080,0:16:14.350


0:16:14.350,0:16:19.520


0:16:19.520,0:16:22.170


0:16:22.170,0:16:26.540


0:16:26.540,0:16:27.540


0:16:27.540,0:16:28.690