Visueel Stijlonderzoek Project Design for Space – Game To The Surface Uitgevoerd door Jens Wouters (GDD2)
Inleiding Dit onderzoek is een visueel onderzoek en zal dus bijdragen aan het definiëren van de look and feel van de game die we gaan maken binnen het Design For Space project. De game in het kort: Jij als speler hebt controle over een artificieel eiland die drijft op lava binnenin een groot ondergronds gangenstelsel. Je hebt als doel het eiland aan de oppervlakte van de planeet te krijgen. Om te navigeren door de gangen, zal je zelf het eiland van tijd tot tijd moeten verplaatsen. Door stukken van de rotswanden te smelten maak je nieuwe lava waardoor het eiland omhoog gaat. Om het einde te kunnen bereiken moet je ook een aantal gebouwen van verschillende types op je eiland plaatsen, maar het eiland balanceert rondom een middelpunt, dus moet je het evenwicht goed verdelen om kapseizen te voorkomen. Resources zijn nodig om te kunnen bouwen en moet je dus verzamelen. Deze resources zitten in de wanden van het ondergronds gangenstelsel. Als genre kleven we RTS (Real-Time Strategy) op onze game. De camera zal daarom onder een hoek staan zodat het ongeveer lijkt alsof je vanuit een isometrisch perspectief aan het kijken bent. De volledige game zal echter uitgewerkt worden in 3D. Ondanks dat RTS games bekend staan om hun dikke balk onderaan waarin alle info verschijnt, willen wij proberen om zo min mogelijk HUD (Head-Up Display) elementen weer te geven. Aanvankelijk hadden we het idee om het spel futuristisch vorm te geven. Maar na het voorstellen van het concept hebben we de raad gekregen om te gaan voor een abstracte look and feel. Dit houdt dus in dat we een stijl moeten creëren waarbij de elementen voor zich moeten spreken en niet noodzakelijk moeten refereren aan een bestaand item. Daarom zal het belangrijk zijn dat de vorm de functie van de elementen zal aanduiden. Het onderzoek kan in twee onderzoeken uiteengetrokken worden, afgeleid van twee onderdelen van een visuele stijl van een game, namelijk de grafische vormgeving en de game art. Grafische vormgeving kan op zich tot de game art gerekend worden, maar de twee termen worden hier in de context gebruikt zoals hieronder beschreven: Tot de grafische vormgeving behoren hoofdmenu, laadscherm, HUD (head-up display: elementen in het spel die informatie verstrekken), in-game menu’s, besturingselementen. Tot de game art behoren alle elementen die dus niet tot de grafische vormgeving behoren. Niet alle games zijn uit dezelfde tijd, dus wordt er bij deze games wel rekening gehouden met hoe ze toen overkwamen.
Methode Eerst is er een keuze gemaakt uit een hele reeks spellen die abstract vormgegeven zijn. Ondanks dat onze game 3D moet zijn, is er ook gekeken naar 2D games. Aan de hand van deze voorbeelden wordt geprobeerd om een stijlrichting te bepalen voor onze game. Hier wordt gesproken over een stijlrichting omdat we pas een stijl kunnen vastpinnen als er effectief concept art geproduceerd wordt. Het viel op dat het zeer moeilijk is om onderdelen van grafische vormgeving die niet in de game zelf zitten, terug te vinden op het web. Gelukkig heb je Youtube en dankzij print screen zijn zo de nodige afbeeldingen bekomen. Niet altijd even goede kwaliteit, maar voldoende om een beeld te kunnen vormen. Sommige games zijn nog niet op de markt verschenen wat tot gevolg heeft dat hiervan geen grafische vormgeving te vinden was. Alle afbeeldingen zijn als bijlage toegevoegd evenals de nodige links naar gameplay filmpjes, want niet alle stills zijn even duidelijk om te begrijpen waar je nu eigenlijk naar zit te kijken.
Analyse Stijlen Een opvallend aspect van de meeste abstracte games was dat hun art onderling enkele gelijkenissen vertoonde die op zich ingedeeld zou kunnen worden in drie specifieke stijlen. Sommige games kunnen ook meerdere van deze stijlen omvatten. Stijl 1: Cyber Met cyber wordt bedoeld dat je het gevoel krijgt dat je in een digitale wereld zit in plaats van de echte wereld. Met digitale wereld wordt hier bedoeld dat het bijna lijkt alsof je in jouw computer zit. Onderzochte games die hieronder vallen: Bit Trip Beat, Core en Void Darwinia Every Extend Extra Grid Wars Marble Madness Mutant Storm Qix Rez Space Giraffe Warlords (alle versies, ondanks dat het blijkbaar oorspronkelijk de bedoeling was dat het zich afspeelde in een middeleeuwse setting) You, me and the Cubes
Stijl 2: Neon Neon spreekt voor zich, felle kleuren die schreeuwend naast elkaar bestaan. Onderzochte games die hieronder vallen: Bit Trip Beat, Core en Void Darwinia Electroplankton Every Extend Extra Grid Wars Mutant Storm Pixeljunk Eden (alhoewel hier en daar uitzonderingen) Qix (in die tijd dan, kleuren waren nog beperkt) Rez Space Giraffe Warlords You, me and the Cubes Stijl 3: Vectorieel Sommige art kan vectorieel genoemd worden vanwege de strakke rondingen en over het algemeen egale kleuren. Neigt sterk naar een cartoon look. Dyson Echochrome Electroplankton LocoRoco Night Sky Patapon Pixeljunk Eden World of Goo Games die niet echt binnen bovenstaande stijlen passen: Art Style Orbient Vib-Ribbon
Game art Er zijn enkele games waar je ziet wat de functie van iets is, ondanks dat er abstract gewerkt is, m.a.w. Form Follows Function. Bij Darwinia is alles wat slecht is rood gekleurd. De vijanden hebben meestal ook dierlijke trekjes. De squad figuurtjes hebben duidelijk een wapen vast. LocoRoco personages verplaatsen zich door te rollen, dus zijn het ook bolletjes. In Marble Madness zie je aan alle onderdelen wat hun functie is. De “levende” vijanden zijn gifgroene wormpjes of zwarte knikkers. Night Sky is volledig in schaduw gehuld behalve de achtergrond, waardoor je silhouetten krijgt. Hierdoor is het dus zeker belangrijk dat de vorm duidelijk maakt wat de functie is. Patapon heeft een bijna gelijkaardige manier van inkleuren als Night Sky, dus moeten de silhouetten ook duidelijk maken waarvoor iets dient. Misschien niet compleet duidelijk, maar in Pixeljunk Eden zou je kunnen stellen dat de “planten” ook functioneel vormgegeven zijn, want ze bewegen als een echte plant zou doen als je er druk op zet en dit heeft (in beperkte mate) effect op de gameplay. Bij de andere games is het niet zo duidelijk wat de vormgeving met de functie te maken heeft. Natuurlijk zal je na verloop van tijd in deze games wel doorkrijgen wat de functie is van elk item. Objecten die binnen de gamewereld bestaan, zijn in de voorbeelden heel stilistisch neergezet. Betrekkelijk weinig details. Er wordt met grote contrasten gespeeld om de achtergrond duidelijk van de voorgrond te onderscheiden, meestal door middel van kleurcontrasten. Uitzonderingen hierop zijn echter Mutant Storm (de ondergrond waarop je speelt maakt de achtergronden wel iets donkerder), Pixeljunk Eden en Space Giraffe. Het valt op dat enkele van de gekozen abstracte games chaotisch aandoen vanwege de overload aan elementen op het beeldscherm. Hierdoor krijg je visuele ruis en is het soms moeilijk om alles van elkaar te onderscheiden. Dit alles past op zich wel bij het abstracte, omdat je dan bijna een psychedelische ervaring beleeft.
Grafische vormgeving Wat lettertypes betreft gebruiken bijna alle games een schreefloos lettertype. Schreefloze lettertypes zijn bijna een standaard overal waar tekst via een scherm getoond wordt. Op enkele locaties durven Echochrome (zie splash screen) en Electroplankton (zie mode select) hier toch van afwijken en is gekozen voor een geschreefd lettertype. De logo’s worden hier buiten beschouwing gelaten aangezien deze meestal meer naar een tekening neigen dan een specifiek lettertype (zie Patapon en Pixeljunk Eden als meest extreme voorbeelden). Het is de bedoeling dat het logo uniek en herkenbaar is, dus is het in vele gevallen ook nog eens een lettertype speciaal gemaakt voor het logo.
Vele hoofdmenu’s zijn standaard vormgegeven. Of je hebt de klassieke verticale opsomming (zie Dyson, Mutant Storm, Patapon, e.a.), of je hebt een horizontale opsomming waarbij enkel het geselecteerde element in beeld is (zie Electroplankton mode menu, LocoRoco). Leuke niet-standaard hoofdmenu’s zijn terug te vinden in Vib-Ribbon en Pixeljunk Eden. Vib-Ribbon heeft gekozen om een wolkensysteem te gebruiken waarbij de te kiezen opties rondom een centrale wolk staan die aangeeft waarbinnen je de keuzes maakt. In Pixeljunk Eden bestaat het hoofdmenu enkel uit een hub systeem waar je met je karakter in het blauwe gat moet springen om naar een level te gaan. Ondanks dat de hoofdmenu’s van Every Extend Extra, Bit Trip Beat en Core (en waarschijnlijk ook Void) standaard lijken, hebben de makers er verwijzingen naar gameplay elementen ingestopt. In het menu van Bit Trip Beat bestuur je het linker balkje die op de hoogte staat van de gemaakte keuze. Selecteer je de optie, dan zal er een blokje vanaf de rechterzijde van het scherm doorheen de tekst gaan, jouw balk raken en terugkaatsen. Dit doe je continu in de game. Analoog hiermee schiet je in het Bit Trip Core menu een straal doorheen de optie vanuit het rode kruisje midden in beeld, wat je dus continu doet in deze game. Every Extend Extra heeft het iets subtieler aangepakt, maar daarom niet minder sterk. In het spel draait het voornamelijk om dingen opblazen. Deze ontploffingen worden aangegeven door cirkels. In het hoofdmenu kun je zien dat de toplaag van het menu langs een cirkel staat. De volgende laag van het menu staat op een kleinere cirkel. Een kleine verfijnde toets die ervoor zorgt dat je een iets ander menu krijgt dan de doorsnee menu’s. HUD elementen zijn traditioneel rondom het scherm naar de rand toe geplaatst. Bij de ene game komen deze elementen al veel dominanter over (zie Every Extend Extra) dan bij de andere (zie Pixeljunk Eden). Of ze ontbreken gewoonweg omdat er geen nood aan is (zie Night sky) . Blijkbaar de enige game waar submenu’s worden gebruikt om dingen te besturen is Darwinia. Strak, veel witruimte tussen de woorden en belangrijk: icoontjes voor snelle visuele herkenning. Gezien de setting van deze game is het ook bijna letterlijk een computervenster. Dyson gebruikt ook een submenu, maar het is veel minder opvallend en dient hoofdzakelijk om informatie weer te geven dan echt het spel te besturen. Waar het menuutje in Darwinia duidelijk over de wereld wordt getekend, komt het scherm van Dyson netjes onderaan op de rand van het scherm te staan.
Conclusie De games die het dichtst in de buurt van ons beoogde genre liggen zijn Darwinia en Dyson. Uit deze games blijkt dat iconografie zeer belangrijk zal zijn om zaken in submenu’s na verloop van tijd vlugger herkenbaar te maken. Indien het niet zou passen om een zwevend menu te gebruiken in de buurt van het item waarop je geklikt hebt, toont Dyson aan dat je het scherm ook gerust naar een rand van het beeldscherm kunt verplaatsen en dan een lijn kan trekken naar het geselecteerde object. Natuurlijk kun je de lijn ook vermijden en op een andere manier duidelijk maken wat je geselecteerd hebt. Het lijkt het meest interessant om de grot met bijhorende lava in onze game vorm te geven in de neon stijl en de rest in de cyber stijl. Door middel van de neon stijl kun je de lava een leuke gloed geven waardoor deze geloofwaardiger overkomt als iets wat warm/heet hoort te zijn. De cyber stijl sluit het meeste aan bij ons eerste idee om het spel futuristisch vorm te geven. Door de twee stijlen duidelijk onderscheidend van elkaar te maken, kun je een contrast creëren tussen de organische grot en de artificiële stad.
Gezien het de bedoeling is om uiteindelijk de submenu’s tot een minimum te brengen, zal het belangrijk zijn dat de vorm van een object duidelijk maakt wat zijn functie is. Details zullen tot een minimum moeten gebracht worden. Gezien onze stad groeit zal de camera er steeds verder van komen te staan waardoor waarschijnlijk alle details toch verloren gaan. Daarom is het belangrijk om toch ook een graantje mee te pikken van de vectoriële stijl. Egale kleuren zijn namelijk goed herkenbaar van op welke afstand men ook kijkt naar een object. Als het zo ver zou komen dat je eventueel de vorm ook niet goed meer kan herkennen, is het dus interessant dat elk bepaald type object een specifieke kleur toegewezen krijgt. Duidelijkheid en overzicht zullen een grote rol gaan spelen binnen onze game. Dus het is belangrijk om geen al te grote visuele drukte te creëren. Qua lettertype ligt het voor de hand om ook een schreefloos lettertype te kiezen. Dit zal sowieso ook beter passen bij de algemene stijl die gebruikt zal worden. Het zou leuk zijn om in ons hoofdmenu gebruik te maken van of te verwijzen naar een gameplay element om te navigeren, zoals gedaan wordt in Every Extend Extra of Bit Trip Beat, Core.
Bijlage Art Style: Orbient Link: http://www.youtube.com/watch?v=o58af3nesEo
Save game select
StagesSelect 1
Stage select 2
In-game
In-game
In-game
Bit Trip Beat Link: http://www.youtube.com/watch?v=0nf1naNPSTg
Main menu
Pause menu
In-game
In-game
Bit Trip Core Link: http://www.youtube.com/watch?v=1Pi68jx0EZE
Main Menu
In-game
In-game
in-game
Bit Trip Void Link: http://www.youtube.com/watch?v=vz9xwa39DHQ
Checkpoint screen
In-game
In-game
In-game
Darwinia Link: http://www.youtube.com/watch?v=f3y1YExOA4U
Overworld
In-game controls
In-game notices
In-game
In-game
In-game
Dyson Link: http://www.youtube.com/watch?v=YiwjjCMqnpg&feature=related
Main menu
Mission Briefing
In-game
In-game
In-game
Echochrome Link: http://www.youtube.com/watch?v=wLJiv9Aeo2c&feature=related
Splash screen
In-game text
In-game
In-game
Electroplankton Link: http://www.youtube.com/watch?v=0QMhCkaY8zc&feature=related
Main menu
In-game
Mode select
In-game
In-game
Every Extend Extra Link: http://www.youtube.com/watch?v=W3b7Px0oD_U&feature=related
Main menu niveau 1
Main menu niveau 2
In-game
In-game
In-game
Grid Wars Link: http://www.youtube.com/watch?v=6thaR7s1wXA&feature=related
Main menu
In-game
In-game
LocoRoco Link: http://www.youtube.com/watch?v=UfDr9eD7wKY
Splash screen
Main Menu
Promotional wallpaper
In-game
In-game
Marble Madness Link: http://www.youtube.com/watch?v=DCrcJQ-9-xk
Splash screen
Main menu
Name input
Levels
In-game
Mutant Storm Link: http://www.youtube.com/watch?v=RJtS9FM0TOQ
Main menu
Level select
Load screen
Save screen
In-game
In-game
In-game
Night Sky Link: http://www.youtube.com/watch?v=h08ZvuC1QDI
In-game
In-game
In-game
Patapon Link: http://www.youtube.com/watch?v=v_b8XtL82B8
Main menu
Introduction
In-game
In-game
In-game
Pixeljunk Eden Link: http://www.youtube.com/watch?v=Y2KAX_n8GY0
Main menu (hub)
Options
In-game
In-game
In-game
Qix Link: http://www.youtube.com/watch?v=NEq-mxFDuHM
Splash screen
In-game
Game over
Rez Link: http://www.youtube.com/watch?v=RXnGsExtdf4
Splash screen
Leader board
In-game
In-game
In-game
Space Giraffe Link: http://www.youtube.com/watch?v=q7uKebwW_Qs&feature=related
Main menu
Level select
In-game
In-game
In-game
Vib-Ribbon Link: http://www.youtube.com/watch?v=3Yw0jDON0Fg&feature=related
Main menu
Score screen
In-game
In-game
In-game
Warlords Link origineel: http://www.youtube.com/watch?v=EVtIZNnVqE0
In-game (origineel)
Link XBLA versie: http://www.youtube.com/watch?v=RlJ-fe0yTe8
In-game (XBLA versie)
World of Goo Link: http://www.youtube.com/watch?v=IFtJ3IXACh8
Save select
Level Select
Name input
In-game text
Promotional wallpaper
In-game
In-game
You, Me and the Cubes Link: http://www.youtube.com/watch?v=g1qARvwn7PA
Player select (man hoort hier niet!)
Level select easy (man hoort hier niet!)
Level select, een stukje moeilijker dan easy (man hoort hier niet!)
Level select hard (man hoort hier niet!)
Objective
In-game
In-game
In-game