The Smoke & Mirrors of Good Countdowns, Part 1

Wat je gaat creëren

Countdowns zijn eenvoudige elementen die in veel games voorkomen, maar hun ontwerp kan gemakkelijk over het hoofd worden gezien.

Met een paar eenvoudige toevoegingen kan een normale timer echter veel boeiender worden gemaakt en passen in het universum van de gepresenteerde game, en zo de ervaring van de speler aanzienlijk verbeteren.

Veel van deze elementen zijn geïnspireerd op de toespraak "Juice it or lose it" van Martin Jonasson en Petri Purho over hoe je je spel "juicier" kunt maken. Waar het op neer komt is dat het niet voldoende is om de informatie alleen in de meest basale vorm te presenteren; je moet ook verbeteren en accentueren wat er gebeurt met kleur, geluid en beweging, waardoor de hele ervaring boeiender wordt. Ik raad het helemaal aan om naar dat gesprek te kijken om ook te leren over andere applicaties.

In deze tweedelige serie zullen we deze elementen doornemen en ze dan implementeren in een eenvoudig Unity-project, waarvoor je de nieuwste versie nodig hebt. In het volgende deel 2 zullen we meer gedetailleerde en genuanceerde elementen bekijken.

Klaar? Laten we gaan!

Het doel van countdowns

Timers in games kunnen verschillende doelen dienen, die niet noodzakelijk overlappende applicaties zijn. Dit zijn:

1. Je hebt X tijd om een ​​taak uit te voeren.
2. Je moet X X tijd overleven.

Het ontwerp van een timer kan tussen deze twee veranderen, omdat de informatie die nodig is voor de speler in de toepassing verandert.

Wanneer je vijf minuten krijgt om een ​​bom onschadelijk te maken Metal Gear Solid 2, je moet het weten exact hoeveelheid tijd die je hebt, want elke seconde wordt van vitaal belang voor de algehele voortgang en planning. De timer moet aan de speler overbrengen hoeveel er nog over is, en hem waarschuwen als die hoeveelheid kritiek laag wordt.

Wanneer je een bepaalde tijd uithoudt, wordt dat element van nauwkeurigheid minder belangrijk. Hoewel het natuurlijk leuk zou zijn om de exacte hoeveelheid tijd in seconden te weten die je nodig hebt om te overleven, kan het spel ook zonder die informatie werken. Het kan zelfs worden verbeterd, als een stukje informatie zoals "je moet het nog een paar seconden langer uithouden!" is gemakkelijker te begrijpen in een stressvolle situatie dan "lees dit nummer in de hoek van het scherm", en kan de onderdompeling in de gamewereld verbeteren.

Hoe Countdowns te verbeteren

Laten we nu eens kijken naar elementen die het aftellen en timers interessanter en boeiender maken.

1: maak je eigen timer die niet op nummers is gebaseerd en sluit de timer in de wereld

In plaats van alleen maar ergens een nummer te plaatsen, kunt u uw eigen countdown-afbeelding maken die de gebruiker ongeveer vertelt hoeveel tijd er nog rest.

Een grafische 2D-implementatie vereist enige finesse, omdat je ervoor moet zorgen dat de speler op de juiste manier intuïtief kan lezen en het idee kan lezen van "de tijd raakt op en je hebt nog ongeveer X seconden over".

Niet-numerieke aftelling van Star Trek Generations. De exacte tijd is niet gemakkelijk leesbaar, maar de afbeelding laat een kijker gemakkelijk afleiden dat er een aftelling plaatsvindt, en de tijd raakt op

Dit werkt erg goed als je omgevingsindicatoren gebruikt om de voortgang te laten zien, en in de game stemmen laten zien hoeveel er nog is. Een nummer dat boven op het scherm wordt geplakt, kan niet-diegetisch aanvoelen en kan heel goed sommige spelers uit het spel halen.

In Half Life 2, u moet bijvoorbeeld een positie verdedigen totdat een teleporter is opgeladen. Aan het begin wordt een volledige lading weergegeven, die vervolgens opnieuw moet worden bijgevuld.

Volledige lading voor een teleport binnen Half Life 2. Het element is goed zichtbaar in de anders dun ingerichte kamer.

Het opladen wordt getoond doordat elementen van de machine oplichten en beginnen te draaien, waardoor je een rudimentaire klok krijgt die aangeeft hoeveel langer je uithoudt.

Na gebruik moet de teleport worden opgeladen. De elementen lichten langzaam weer op en geven de speler een indicatie hoeveel langer ze moeten uitstaan ​​(vanaf Halfwaardetijd 2)

De teleporter lading is ook een goed voorbeeld van een ingebed weergave, die direct in de spelwereld is. Deze zijn handig omdat ze de speler gericht houden op de wereld zelf, terwijl een timer op een GUI-laag bovenop de gamewereld staat.

Een zuurstoftimer in Metro: Last Light, direct in de spelwereld

2: Laat de nummers op cijfers lijken

Krijg een cool lettertype voor uw aftellingen! Bepaalde lettertypen zoals dit digitale display-lettertype emuleren oudere lightup-schermen, die meestal werden gebruikt voor nummers in oude "digitale" schermen.

De speler zal deze lettertypen al koppelen aan timers en countdowns, en het zal het lezen veel eenvoudiger maken, alsof het in iets is zoals Arial of Times New Roman.

Basisleesbaarheid en tekstsamenstelling zijn ook van toepassing. Stapel de nummers niet verticaal, gebruik geen Romeinse cijfers, enz.

3: Geef de speler het bedrag in seconden, niet in minuten

De Metal Gear Solid-serie doet deze prachtige truc waarbij ze zeggen "je hebt nog maar 500 seconden over!" en toon dan een nummer dat luidt als "5:00".

Toen ik het voor de eerste keer speelde, voerde mijn geest dit automatisch in om te lezen als "5 minuten", maar het was misleid. "500 seconden" is een ongewoon, maar correct tijdformaat en mensen zijn over het algemeen niet opgeleid om dit correct op te pikken.

Het effect is dat spelers denken dat ze maar 5 minuten hebben, terwijl het in werkelijkheid 8 minuten en 20 seconden is.

Optionele miniavonden in Metal Gear Solid V: The Phantom Pain. De tijd wordt gegeven in seconden, waardoor het aantal minuten wordt verduisterd

Dit heeft meestal geen nadelen, omdat ze worden aangespoord door de strakke tijdslimiet en zich concentreren op het volbrengen van de taak (in Metal Gear Solid 2: defusing bommen), wat hen zal afleiden van het feit dat vijf minuten voorbij zijn gegaan, en er is nog tijd.

4: maak een "minuut" 100 seconden lang

Dit gaat hand in hand met het vertellen van de hoeveelheid resterende tijd in seconden.

Een terugkerend element in de MGS2 countdowns is dat ze geen omzet van 60 seconden hebben, maar 100-seconden "omzet". Dit is niet echt een minuut die overgaat naar de volgende, maar de seconden die worden weergegeven. Dus in plaats dat 01:00 00:59 wordt, wordt 0100 de waarde 0099. Je moet alleen de waarde zelf krijgen, wat het aftellen eigenlijk gemakkelijker maakt, omdat je de minuutberekening kunt overslaan.

Een aftelling gebruikt in Metal Gear Solid 2: Sons of Liberty. Merk op dat de getallen in totaal seconden worden weergegeven, maar op een manier die lijkt op minuut-en-seconde-tellers. Hoewel het tweede symbool (") ook wordt weergegeven, is de demografische doelgroep voor jonge gebruikers mogelijk niet bekend.

5: Milliseconden en breuken gebruiken om spanning toe te voegen

Milliseconden weergeven na het hoofdnummer maakt het veel interessanter!

Dit is vrij eenvoudig, omdat de tijd al in een float kan worden opgeslagen. Twee tot drie drijvende-kommagetallen zijn een goede hoeveelheid die nog steeds leesbaar en mogelijk nuttig voor de speler is.

6: Gebruik Color to Your Advantage!

Wanneer de timer een bepaald laag aantal bereikt, kleur de tekst anders in. Het geel maken werkt goed, omdat het de timer opvallender maakt.

Zodra het zijn laatste seconden bereikt, maak je het rood, groter en flitser. Nu kan het lage aantal niet genegeerd worden en het creëert spanning in de speler.

Rood aftellen van Metal Gear Solid V: The Phantom Pain

Laten we een eenvoudige timer bouwen met deze dingen!

Laten we nu beginnen met het verbeteren van een timer via code. We zullen dit veranderen:

Een eenvoudige timerweergave

In dit:

Onze verbeterde timerweergave

We zullen een paar speciale middelen gebruiken die u snel kunt krijgen of zelf kunt maken, of kunt halen uit de bronbestanden die u rechtsboven in dit artikel kunt downloaden..

Klaar? Laten we gaan!

Setup & Basic Timer

Start Unity en maak een nieuw project.

Maak vervolgens een leeg spelobject, plaats het voor de camera en voeg een textMesh via toe Component> Mesh> TextMesh ernaar toe. Dit is het display voor de timer in de spelwereld.

We zullen de 3d-textmesh voorlopig gebruiken, maar dit zal ook op andere gebieden werken, zoals de standaard Unity-interface. Voor nu heeft de 3D-tekst ook het voordeel dat het kan zijn binnen de spelwereld, zoals eerder genoemd, en niet bovenop van de wereld in een GUI-laag.

Onze nieuwe 3d-tekst wordt niet onmiddellijk weergegeven; we moeten enkele waarden wijzigen.

Stel de tekengrootte in op 0.1, het anker voor midden links, de afstemming op centrum, en de lettergrootte naar 80. Voeg ook wat tijdelijke tekst toe aan het veld "tekst". Dit is gewoon zo dat we iets moeten bekijken in de editor; tijdens de feitelijke gameplay wordt dit direct aangepast via code. 00:00 zal het goed doen.

Maak vervolgens een nieuw bestand met de naam Countdown.cs, voeg het toe aan ons timer-object en voeg deze code eraan toe:

gebruikmakend van UnityEngine; met behulp van System.Collections; openbare klasse Countdown: MonoBehaviour float timer = 120f; void Update () timer - = Time.deltaTime; GetComponent() .text = timer.ToString (); 

We hebben een variabele met de naam timer, die de aftellende tijd vasthoudt. Op dit moment is het er 120 seconden of 2 minuten. Dan in de Bijwerken functie, die elk frame wordt genoemd, worden we afgetrokken Time.deltaTime. Dit is een snelkoppeling om de werkelijk verstreken tijd daar te krijgen. Daarna krijgen we de textMesh component van het object en pas het aan tekst waarde om de timer te zijn, omgezet in een string.

Wanneer je het spel nu uitvoert, zal de textmesh het aantal tonen dat afneemt. Gefeliciteerd! Je hebt een rudimentaire timer gebouwd.

Maar het is nog lang niet boeiend. Het toont ook 4 tot 5 cijfers achter de komma en zal na het bereiken van nul in negatieve waarden blijven.

Have It Stop at Zero

Een negatieve timer ziet er gebroken uit, dus laten we ervoor zorgen dat dit niet gebeurt. Pas de Bijwerken functie om er zo uit te zien:

if (timer> 0f) timer - = Time.deltaTime;  else timer = 0f;  GetComponent() .text = timer.ToString ();

Dit zal de timer alleen maar verlagen als deze echt positief is. Mocht het toch negatief worden (wat kan gebeuren wanneer het de verstreken tijd aftrekt), wordt het op nul gezet.

Ontvang betere cijfers

Weet je nog dat coole digitale display-lettertype dat ik hierboven noemde? Ga het halen en voeg het toe aan je project!

De sectie textmesh in het infovenster heeft een veld voor het lettertype, dus sleep het lettertype van uw items naar die plek.

En nu ziet onze timer er veel netter uit!

Corrigeer de hoeveelheid cijfers

Op dit moment varieert het aantal cijfers achter de komma, waardoor de timer enorm schommelt. Los dit op door de regel die de waarde toepast aan te passen aan de tekst om er zo uit te zien:

GetComponent() .text = timer.ToString ("F2");

Hiermee wordt alles na twee nummers automatisch uitgeschakeld en worden tientallen en honderdsten seconden continu weergegeven.

Maak de kleurverandering

Laten we wat adaptieve kleuren toevoegen! Pas de Bijwerken functie om er zo uit te zien:

if (timer> 0f) timer - = Time.deltaTime;  else timer = 0f;  if (timer < 10f)  GetComponent() .color = Color.red;  else if (timer < 20f)  GetComponent() .color = Color.yellow;  GetComponent() .text = timer.ToString ("F2");

En de timer wordt geel als er minder dan 20 seconden resteren en rood als er minder dan 10 seconden resteren.

Het volledige Countdown.cs-bestand zou er als volgt uit moeten zien:

gebruikmakend van UnityEngine; met behulp van System.Collections; openbare klasse Countdown: MonoBehaviour float timer = 60f; openbare AudioClip soundBlip; void Update () if (timer> 0f) timer - = Time.deltaTime;  else timer = 0f;  if (timer < 10f)  GetComponent() .color = Color.red;  else if (timer < 20f)  GetComponent() .color = Color.yellow;  GetComponent() .text = timer.ToString ("F2");  

En dat is het! We hebben nu een interessanter en interessantere aftelling.

U kunt ook kijken naar het volledige project in de bronbestanden in de rechterbovenhoek van dit artikel.

Conclusie

We hebben een aantal elementen bekeken die timers in games zullen verbeteren, waarvan de lessen ook op veel andere elementen kunnen worden toegepast. Bovendien kan de timer die we hebben gebouwd eenvoudig worden aangepast en in elk soort spel worden ingevoegd, en een interessant element zijn zonder dat je de inhoud opnieuw hoeft te ontwikkelen.

Maar er is meer! In het volgende deel van deze serie zullen we naar nog meer elementen kijken en onze timer blijven verbeteren.