Umbrellove
���� ������ ��������
Ryan Schuijer | D2 | 2060665
|1
Game Design document
In het proces van het creĂŤren van onze game Umbrellove hebben we veel ontwerpkeuzes moeten maken. Dit begon al in de eerste concepten en ging nog door tot in de laatste details van de omgeving. Ook hoe de narratie in elkaar stak en de algehele vormgeving, zelf de sounds hebben diverse conceptuele fases ondergaan.
gingen aanpakken en uitwerken. Soms ook wel moeilijk en riep het bij mij veel vraagstukken op die ik niet zelf kon oplossen. Maar het is voor mij wel een inzichtelijk proces geweest, hopelijk komt dit ook goed naar voren in mijn verslag.
Ik vond het heel interessant om na te denken hoe we dit
Ryan Schuijer | Visual Design
2|
Inhoudsopgave MDA Frameworks 4 Mirror’s Edge 5 Pretentious Game 6-7 Concept 1 8-10 Concept 2 11 Viewport 12 Concept Umbrellove 13-15 Feedback 16 Lopen, bewegen 17 Springen 18 Interactie 19 PBR 20 Het puzzlelevel 21 Visual hints 22 The Switch 23
|3
MDA Frameworks
Ik heb zelf jarenlang games gespeeld, op zowel consoles als op PC en ook simpele gameboy games kan ik vandaag de dag nog goed waarderen. Er zijn een aantal games die bij mij diepe indruk gemaakt hebben en die altijd bij me zullen blijven. Ik
4|
heb deze games dan ook geselecteerd om te analyseren en om als goede leidraad te gebruiken bij het ontwerpproces van onze game.
Mirror’s Edge
Dynamics
Mirror’s Edge is een game uit 2008, gereleased door EA Games. In deze game kun je freerunnen in een wereld waarin een totalitaire staat heerst.
De dynamics in deze game worden bepaald door snelheid en keuzes. Ren je sneller door een level heen, dan haal je sommige sprongen wel, te langzaam dan val je naar beneden. Je keuze tussen vechten of vluchten heeft ook impact op de dynamics. Je kunt soldaten ontwapenen door hun wapen af te pakken, maar dit maakt je wel zwaarder en minder wendbaar. Je kunt dus minder hard wegrennen. Zonder wapens ben je sneller.
Aesthetics
Mechanics
Het briljante aspect van Mirror’s Edge vind ik toch wel de omgeving. Omdat springen en vluchten, het freerunnen, in deze game dus eigenlijk een mechanic is en de dynamic ‘snelheid’, heeft de designer in de aesthetics een interessante keuze gemaakt. Namelijk dat de stad wit is en de elementen die je kunt gebruiken felrood of oranje zijn.
In de game maak je gebruik van elementen in de stad om te freerunnen. Je vlucht in de ene levels en in de andere levels moet je een object bemachtigen. Je krijgt punten afhankelijk van de tijd waarin je deze levels finished. Je obstakels zijn vijanden, soldaten met geweren en andere freerunners. Een aantal Mechanics van deze game zijn dus springen, racen, vluchten en vechten.
Dit is wat de game in mijn ogen uniek maakt. De spierwitte stad is een prachtig visueel metafoor voor onderdrukking. En de elementen die daarvan afsteken zijn jouw paden naar vrijheid en ontsnapping hieraan.
|5
Pretentious Game Pretentious Game is een voorbeeld dat in de kickoff van Mark gepresenteerd werd, en die ik meteen gespeeld heb op mijn smartphone. Deze game heeft binnen 3 minuten diepe indruk op mij achtergelaten.
Een andere mechanic is in mijn opzicht dus ‘het gedicht interpreteren’.
Dynamic De dynamics in dit spel zijn interessant, omdat de rules van het spel eigenlijk steeds veranderen door het gedicht te interpreteren.
Mechanic Deze game heeft 1 simpele core mechanics: springen. Je probeert als blauw blokje zijnde, steeds bij het roze blokje te komen. Dit doe je vooral door vooruit te bewegen door het level en af en toe te springen.
Een ander interessant punt is dat het zinnetje dat steeds boven verschijnt jou eigenlijk een hint geeft over het uitspelen van het level of het oplossen van een puzzelobstakel.
6|
een rule die je al gauw leert is bijvoorbeeld dat je niet tegen vuur kunt. Maar in dit level, doordat er staat ‘I will run fearless.’ kun je ineens wel over vuur lopen. Een ander voorbeeld is ‘I will drag myself to you’ waardoor je het blauwe blokje ineens met je muis of door middel van touch kunt laten ‘vliegen’. Een Dynamic is dus dat deze game, ondanks de simpele mechanics, letterlijk heel dynamisch is omtrent de rules. De diepe indruk waar ik het in het begin over had komt voort uit het einde. !SPOILER ALERT!
In het einde is het ineens onmogelijk om nog bij het roze blokje te komen. Deze bevind zich met een ander nu aan de onderkant van het level, waar je niet bij kan komen. Een perfect metafoor voor onbereikbare liefde. Als het correct is dit een dynamics te noemen, vind ik het een heel interessante. Als speler wordt je namelijk aangemoedigd om elk level uit te spelen door de rules te buigen. Er is altijd wel een oplossing voor, ook al is deze in strijd met de core mechanic. En plotseling wordt dit je op het eind ontnomen. Je kunt niet meer winnen. Waarom is dit? Er is toch altijd een oplossing voor? Dit is in mijn opzicht een zeer goede manier om een narrative af te sluiten en denkstof te planten in het hoofd van de speler. Het spel Loneliness eindigt ook op een zodanige manier, wat me tot nadenken zet (ik weet niet of enkel ik hiervoor gevoelig ben, of dat dit een heel interessante manier is van storytelling) Loneliness
|7
Concept 1: Lanquages Een eerste concept dat ik bedacht had voor de beleving van taal was een narrative game waarvoor ik niet echt een naam had. Je beweegt je als speler door een level heen dat zich afspeelt binnen een bepaalde tijdsperiode, beginnende bij de oertijd. Ik heb het zo uitgewerkt:
Dit zou het dan moeilijker maken om te communiceren met mensen en je moet dus goed de digitale wereld interpreteren om je doel te halen. Een andere secondary mechanic is dus ‘interpret digital world’
Progression De progression in dit spel zit hem in het feit dat het steeds ingewikkelder wordt om mensen te kunnen benaderen (deze zijn verdiept in hun smartphone natuurlijk!). Ook is het progressive omdat je langzaam per level de digital world groter ziet worden en de digitale ego’s een steeds duidelijkere en grotere vorm beginnen aan te nemen.
Hero’s Quest De Hero’s Quest vind ik in dit geval de zoektocht naar communicatie met mensen. Het ondervinden van het steeds moeilijker worden hiervan.
De feedback van dit concept was dat je taal niet echt beleeft en dat het een heel beschuldigende game is (je wijst heel erg negatief naar een probleem in de huidige maatschappij).
Mechanics De opdrachten die je moest doen zijn redelijk simpel, omdat ik wilde dat de narrative duidelijk verteld zou worden. Ik heb dit overgenomen van Pretentious Game en Loneliness. Simpele taken en een sterke narratie. Je moet steeds mensen zoeken in je omgeving, dat kun je doen door te lopen. De core mechanic is dus lopen. Je speelt het level uit door simelweg met deze personen te spreken, door middel van spatiebalk. Een secondary mechanic is dus ‘communiceren’. Een andere dynamic die ik verzonnen heb is dat het scherm in 2’en is gesplitst en dat het onderste scherm een representatie is van je digitale ego. In de oertijd is deze dus non-existant. Pas vanaf de jaren 70 begonnen mensen een digitaal ID te krijgen en vanaf 2009 ontplofte Facebook.
8|
Searcing for ways to communicate Increasing difficulty
Communicate Interpret digital world
Walking
|9
10 |
Concept 2: Lettergame
Progression
Zoals zovelen kwam ook ik op een gegeven moment op het idee om letters te gaan gebruiken in onze game, om de beleving met taal te versterken. Lettergame was opgebouwd uit alleen maar letters. Ik dacht, als we visuele objecten weghalen uit de game, moeten mensen wel gaan lezen om het te kunnen begrijpen
Een progressive element van dit spel is dat je steeds verder komt in het verhaal dat je leest, je ervaart het dus eigenlijk als een boek. Je leest de game.
Mechanics Je bent een mannetje dat bestaat uit letters, en je beweegt je door een landschap dat bestaat uit letters. Ik had er nog geen secondary mechanic aan gekoppeld, dus ik beschrijf hier enkel de core mechanic: lezen. Je kunt een aantal woorden herkennen en aan de hand daarvan maak je een visuele representatie van hoe het level eruit ziet.
Hero’s Quest De Hero’s Quest had ik nog niet duidelijk gedefinieerd, maar het had te maken met een wereld waarin alle vorm en kleur verdwenen is en je je dus beweegt door een ‘boek’. Uiteindelijk wilden we dit concept niet doen, omdat het niet toegankelijk was voor mensen die niet van lezen hielden, en omdat het steeds kijken naar letters heel veel verwarring en misschien duizeligheid kan opleveren.
| 11
Viewport
We zijn verder gegaan met het uitdenken van het concept ‘Umbrellove’, waarbij je als paraplu de missie hebt om liefde te vinden. Je vind je weg door een grote stad, vergezeld door de mensen om je heen in een regenachtige setting. Doel van het
12 |
spel: die prachtige gele paraplu terugvinden die bij jullie eerste onmoeting je hart gestolen heeft...
Concept: Umbrellove Het concept voor een paraplu met physics lag er al een tijdje en deze is uitgewerkt door een andere groepsgenoot. Het MDA framework dat ik hieronder beschrijf verschilt nogal van het originele model, maar dit lijkt mij achteraf gezien het framework zoals het zou moeten zijn:
Revealing your love to Yellow Travel trough levels (phases) Bringing two people together
Moving
onhandige heeft wel iets als het gaat om het karakter ‘paraplu’ . Ik vond zijn bewegingen namelijk zeer elegant passen bij de weersomstandigheden en met wat aanpassingen zouden we het kunnen laten lijken alsof deze paraplu zich vooruit beweegt op lichte windvlaagjes. Want het is niet onrealistisch om te bedenken dat een paraplu zich enkel voortbeweegt op wind. De rule is nu gesteld dat de paraplu onderhevig is aan wind. Zo kun je uitdagingen en levels ontwerpen omtrent luchtstroming, denk aan putdeksels en roosters. Dit komt straks terug in mijn viewportanimatie Daarom lijkt het mij interessant als de core mechanic hier is ‘moving’.
Dynamics Mechanics We hebben een paraplu leven gegeven. Dit maakt een aantal mechanics mogelijk zoals lopen en springen. Drijven over water en roetsjen langs hoogspanningskabels. Voor een paraplu heel wat. Alvin had tijdens het schrijven van de code, van de engine van de game, op een gegeven moment een versie af die nogal instabiel met de controls werkte. Je kon goed bewegen, maar soms tuimelde je omver of rolde je vanzelf een eindje weg. Hier te bekijken en uit te proberen: http://umbrellove.alvinkeegangoh.com/test/index2.htm Deze versie werd al gauw bestempeld met de naam ‘gehandicapte paraplu prototyp versie 2’. Maar juist dit
Een deel van de dynamics heb ik hierboven beschreven, namelijk dat je als paraplu nu onderhevig bent aan windvlagen en luchtstromen. Het wordt uitdagend om als paraplu te gaan bewegen, en helemaal in een stadse omgeving. Gevaar zit om iedere hoek en entiteiten kunnen zowel helpers als vijanden zijn (een mens kan jou sneller op je locatie brengen door je mee te nemen, maar kan jou ook in de vuilnisbak gooien).
Aesthetics Wat deze game vraagt als het gaat om stijl is dus een omgeving die regenachtig is. En groot (je bent immers een paraplu!). Er moeten elementen in zitten die luchtstroming kunnen generen. En het is een liefdesverhaal, dus de omgeving moet zich hier ook voor lenen.
| 13
Eerste visuals Aan de hand van dit bedachte MDA framework ben ik aan de slag gegaan met het design van het paraplu karakter en het level.
De omgeving moest in mijn ogen grijs. Want een regenachtige dag is niet kleurrijk. Om aan te geven wie jij bent en wat je doel is heb ik de paraplu rood gemaakt en het doel geel. Zo waren de twee belangrijkste karakters geboren. Ik heb een rookput toegevoegd waardoor je kunt vliegen. En een regenlayer over alles heen gedaan voor de sfeer. Alles geanimeerd kwam ik tot de volgende viewport: https://www.youtube.com/watch?v=0r7bvt_hcis Hierin is ook te zien dat je kunt springen doordat de paraplu zich samenvouwt. Dit leek me een heel belangrijk aspect om te animeren omdat dit het kunnen springen ‘verklaart’ en dus geen stijlbreuk is op het onhandige bewegen van een paraplu. Onhandig bewegen door de wind, en vervolgens perfect kunnen springen als Mario is natuurlijk een stijlbreuk.
Sound In de viewport kun je ook al horen welk sounddesign ik voor deze game in gedachten had. Er hoeft geen muziek onder.
14 |
Enkel het geluid van de regen. Dit schept precies de goede atmosfeer die overeenkomt met de wereld die je ziet. Een regenachtige omgeving bevat geen gecompliceerde muziek of een denderende soundtrack. De stad, de lucht, alles wordt gevuld met regen en dat moet in het geluid terugkomen. Verder heb ik de visuele feedback van de rokende put versterkt door er een zware ondertoon aan toe te voegen in de sound. Zoals wat je zou horen als je je oor ertegenaan zou houden. Er zit ook een ‘fwoosh’ geluidje onder het springen, zodat je die feedback ook meekrijgt.
| 15
Feedback
Feedback is heel belangrijk, je wilt niet dat je user gaat twijfelen aan hetgeen dat jij ontworpen hebt. Wanneer een gebruiker de indruk krijgt dat jouw software ‘fout’ is, is het moeilijk om hem nog van iets anders te overtuigen. Met
16 |
feedback voorkom je dit. Je geeft de speler het vertrouwen in je spel en je leert hem om te gaan met besturing die jij ontworpen hebt. Ook maak je hiermee het verschil tussen een onmogelijk ingewikkelde of een vriendelijke puzzelgame.
Hoe Feedback in Umbrellove moet zijn
Lopen, bewegen
We geven feedback op diverse manieren voor diverse acties. Dit is 1 van de dingen die ikzelf heel belangrijk vond, omdat ons concept een puzzelgame is geworden. Het is makkelijk om een puzzellevel te ontwerpen, maar om vervolgens hem zo te ontwerpen dat duidelijk is hoe het opgelost kan worden is vele malen moeilijker dat gedacht wordt. Met simpele feedback oplossingen kan dit iets makkelijker gemaakt worden.
Ik begin eerst met de core mechanic van onze game: het lopen en bewegen. Heen en weer lopen doe je met de pijltjes toetsen. Maar ook in de lucht kun je naar links en naar rechts ‘zweven’. Als je paraplu omrolt, kun je ook weer rechtop rollen door de pijltjes toetsen links en rechts te gebruiken. De feedback loop voor bewegen zou er als volgt uitzien.
| 17
Springen Het springen in Umbrellove is ook belangrijk, ook omdat je namelijk meer keer achter elkaar kunt springen. We geven het springen feedback door een korte animatie én door sound.
De speler drukt op het omhoog knopje (up arrow key)
Arrow up zorgt ervoor dat de paraplu kan springen en je dus omhoog gaat
De speler heeft nu geleerd dat je met omhoog ook daadwerkelijk met de paraplu omhoog gaat. Het samenklappen zorgt ervoor dat de speler begrijpt dat je ook meerdere keren achter elkaar kunt springen, omdat dit in de lucht ook gebeurt. (double jump)
18 |
De paraplu maakt een grote sprong, je ziet hem samenklappen en je hoort een ‘fwosh’ geluid
zijn waarbij je je Spatiebalk kunt gebruiken.
Interactie In de game Umbrellove kun je diverse acties uitvoeren door gebruik van de spatiebalk knop (in ons concept gebruik je deze om objecten in het level te kunnen ‘pakken’ maar dit vind ik niet goed, je maakt het je speler zo onnodig moeilijk). Je kunt spatiebalk gebruiken om een deur te openen of om je vast te haken aan een taxi. Of je verschuilt je in de handtas van een mevrouw etc. Deze objecten moeten wel aangegeven zijn met een glow of de paraplu reageert hierop door even te bewegen. Zo krijg je als speler feedback dat dit de momenten
De speler nadert een object waar hij de spatiebalk kan gebruiken
De game geeft jou een hint dat je de spatiebalk moet indrukken, bijvoorbeeld een glow om het object en een korte animatiebeweging van de paraplu
De speler weet nu dat hij in de nabijheid van objecten die glow hebben, spatiebalk moet indrukken om een actie teweeg te brengen die hem verder brengt in het spel
Er wordt een actie uitgevoerd na het indrukken van spatiebalk
| 19
PBR
Aangezien we een puzzelgame hebben ontworpen, is het heel belangrijk om te kijken naar Properties, Behaviour en Relations. Dit omdat je met veel objecten te maken krijgt die je spelverloop gaan versoepelen of verhinderen. Als niet goed
20 |
over deze zaken nagedacht wordt, wordt een puzzelgame al gauw onmogelijk op te lossen, door het missen van duidelijke verbanden of het ontgaan van relaties tussen objecten.
Het puzzellevel Ik heb 1 puzzellevel gevisualiseerd naar aanleiding van onze projectzittingen, deze is onderaan te zien. Helaas hebben we door tijdsnood dit level niet meer werkend kunnen krijgen, maar dit is een goed moment om na te denken over de PBR in combinatie met designkeuzes. Wat er in dit level moet gebeuren is de man naar de vrouw te brengen. Maar dit kan niet omdat het stoplicht op rood blijft staan en de auto’s dus blijven rijden. De man kan niet verder lopen. Jij kan als paraplu wel over het verkeer heen vliegen (double jump). Je loopt verder en ziet een verhuisman een zwaar object ophijsen. Nog verderop zit een vrouw op een bankje duiven te voeren. Nu is het de bedoeling dat je het
broodzakje pakt, teruggaat naar de verhuisman en boven hem het brood geeft aan de kraaien. Deze poepen vervolgens op de man zodat hij het zwaar object laat vallen. Hieroor ontstaat er een gat in de grond. Daarbeneden vind je een switch die ervoor zorgt dat het stoplicht boven voor de auto’s op rood springt en de man door kan lopen en de vrouw ontmoet.. Om dit bedenksel werkend te krijgen is veel usability nodig. Je zult een aantal zaken naar je speler moeten communiceren. Ikzelf ben het niet eens geweest met het veel te gecompliceerde ontwerp van de oplossing, maar aan de hand hiervan kan ik wel de PBR uitleggen van diverse objecten binnen Umbrellove.
| 21
Visual hints Allereerste wat je uit moet leggen is het doel: wat moet je bereiken? Volgens de bedenkers van dit level komt dit wel goed, maar ik ben ervan overtuigd dat je visual hints MOET geven om dit duidelijk te kunnen maken aan je speler. Wat ik bijvoorbeeld zou veranderen is het gebruik van licht. Een slimme manier om aan te geven wat je speler moet doen, is om deze elementen te belichten. Letterlijk.
Deze man en vrouw moeten bij elkaar gebracht worden. Dat kun je je speler leren door aan het begin van het level eerst een overview te geven, een langzame pan door het level heen. Het licht brengt dan verduidelijking doordat dit als eerste opvalt. Een aangepaste versie die ik hiervoor ontworpen heb ziet er zo uit:
22 |
Zie ook hoe de kraaien bovenin en de man in het raam uitgelicht zijn. (dit zijn namelijk key-elements voor de oplossing) Ik denk dat dit enorm kan helpen bij het hinten van een oplossing van de puzzelgame. Wanneer je dit consistent doorzet in de rest van de game zal dit veel spelvriendelijker zijn. Ook vind ik dit een elegantere oplossing dan een grote pijl of een tekstballon boven het object, dit zie ik al stijlbreuk. De propertie van een key-objects is dus letterlijk ‘uitgelicht’ zijn. Een silhouette dat opvalt door zijn achtergrond is een key object. De behaviour van een key-object is wat lastiger te benaderen, omdat deze divers zijn. Er kan wel een verschil worden gemaakt tussen actieve key-objects en passieve key-objects. Bijvoorbeeld de vrouw is passief totdat de man bij haar is. De verhuizer doet niks totdat de kraaien op hem poepen. Hier moet nog een oplossing voor gevonden worden. De man kan bijvoorbeeld een ongeduldige animatie zijn en de kraaien rusteloos, terwijl de verhuizer en de vrouw rustige en zachte bewegingen maken. Zo kun je het verschil aanduiden. De relations tussen de objecten zou je kunnen aangeven door dezelfde camera beweging zoals ik eerder beschreef. In het begin kun je een pan-beweging maken met de camera van de
man naar de vrouw, en vervolgens van het broodzakje naast de vrouw naar de kraaien. Om te eindigen bij de verhuizer.
The switch In dit level zit ook een switch. Zoals in de meeste games, activeert deze switch een element zodat er level-progress ontstaat. In dit geval bedient deze switch het stoplicht.
dit suggereert dat je er naartoe moet om het te activeren. Zoals eerder uitgelegd zul je feedback krijgen op momenten dat je de spatiebalk dient in te drukken, dat is hier ook het geval. Zodra je binnen spatiebalkknop-afstand van het object ben zal de paraplu even bewegen als sein. De behaviour van deze switch is dat als deze geactiveerd is, dat deze dan blijft branden, hij flikkert niet meer. De relation die deze switch heeft is met het stoplicht. Wanneer geactiveerd, zal het stoplicht op rood springen voor de auto’s waarna deze stoppen met rijden. Deze relation heb ik aangegeven met elektriciteitsdraden die vanaf de switch direct de paal van de stoplicht ingaan.
De propertie van deze switch is dat hij flikkert, omdat het wel een key-object is, maar hij ook moet communiceren dat hij ‘kapot’ is. Op deze manier pakt hij dus de aandacht van de speler.
De behaviour van deze switch is ook simpel, hij knippert dus
| 23