Eind document Het einde kroont het werk.. Klas V201 7 november 2012 versie 1 Martijn van Loon Project manager 500531521 Julie de Lange Content manager 500621533 Ninya Zoll Visual Designer 500624459 Alexander Meije Frontend developer 500621090 1
Inhoud What s new pag. 3 Perspectief pag. 3 Het kernidee pag. 4 Doelgroep pag. 4 Omschrijving pag. 4 Proof of concept pag. 5 Usecase Scenario pag. 6 Interactie pag. 7 Stijlgids pag. 8 Visueel storyboard pag. 10 Testresultaten pag. 11 Technische haalbaarheid pag. 11 Communicatie tot gebruiker pag. 12 Content pag. 12 Inleiding Wij, studenten Communicatie en Multimedia Design aan de Hogeschool van Amsterdam hebben in opdracht van Dropstuff een urbanscreen game ontwikkelt. Deze Urbanscreen game zal gedurende de Venetiaanse Biënnale in Amsterdam en Venetië getoond worden en voorbijgangers de mogelijkheid geven via een game met elkaar in contact te komen. In dit einddocument staat opgesteld wat wij hebben ontwikkelt in de afgelopen maanden en hoe het project is verlopen. Ook zullen we bespreken hoe wij ons product graag verder zien groeien en wat wij daarbij nodig zullen hebben. Kern. contactpersoon: projectmanager Martijn van Loon martijnvnloon@gmail.com HvA contactpersoon: teamcoach Jan Scholte janscholte@xs4all.nl Dropstuff contactpersonen: René van Engelenburg, Gijs ten Cate rene@dropstuff.nl, gijs@dropstuff.nl 2
What s new De visuele laag In het traject van ontwerp naar eindproduct hebben wij een nieuw element aan de game toegevoegd die het spel meer uitdaging geeft en visueel prikkelender maakt. Waar voorheen de ballen het beeld vormden, zijn het nu de ballen die het beeld onthullen. In de achtergrond staat een illustratie verhult die alleen zichtbaar wordt door het ontstaan van de ballen. Hoe groter de bal of het aantal ballen, hoe meer er zichtbaar is van de illustratie. De illustratie bestaat uit een aantal kleine afbeeldingen waardoor het voor de gebruiker leuk wordt om bepaalde plekken van de illustratie te onthullen. Dit kunnen zij doen door de bal een zetje in de goede richting te geven. Meer informatie staat in het hoofdstuk Proof of Concept. De besturing De besturing zal niet langer gedaan worden door het maken van een vuist om de balgrootte te kunnen besturen. De gebruiker laat de bal nu groeien door zijn handen uit elkaar te bewegen. Meer informatie staan in de hoofdstukken Use case scenario en Interactie. Perspectief Uitbouw op het eindproduct: de gebruiker wordt de maker In de laatste feedbacksessie met de opdrachtgever hebben wij besproken wat de mogelijkheden zijn om een creatie element voor de gebruiker toe te voegen. Als team hebben wij deze feedback meegenomen in een nieuwe brainstorm sessie van waaruit een uitbouw op ons originele product is ontstaan. Om de gebruiker invloed te laten hebben op de visuele laag willen wij te werk gaan met tekst. De gebruiker zal tijdens het spelen woorden roepen die geregistreerd worden. Deze woorden zullen opgenomen worden in een zogenaamde wordcloud een visueel aantrekkelijke brei van woorden, die in plaats van de oorspronkelijke illustratie in de achtergrond verhuld staat. Op het tweede scherm in het speelhokje kan de gebruiker zien dat zijn woorden geregistreerd worden en daar invloed op uit oefenen door zorgvuldig woorden te kiezen en te herhalen als hij deze prominenter in beeld wil hebben. Hoe vaker een woord gezegd wordt, hoe groter deze in de cloud verschijnt. Deze wordcloud wordt vervolgens door de gebruiker onthult met de ballen. Na elke sessie zullen de door de gebruiker meest gezegde woorden permanent worden opgenomen in de wordcloud, zo laat elke gebruiker een stukje achter in het spel. Onze ambitie Wij zijn erg trots op ons eindproduct. Niet alleen hadden wij veel plezier met het bedenken en creeëren van het spel, we zouden het liefste het spel in actie zien en zelf spelen. Het spel heeft dan ook grote potentie om zowel in Venetië als Amsterdam voorbijgangers te vermaken, evenals het straatbeeld aantrekkelijker te maken. Onze programmeur is een heel eind gekomen met het realiseren van het spel en heeft er zorg voor gedragen dat al onze ideeën ook uitvoerbaar zijn. Om het spel te kunnen ontwikkelen voor gebruik zullen wij samen gaan werken met een meer ervaren programmeur met kennis over de Kinect. De visuele elementen en begeleiding kunnen wij zelf realiseren. 3
Credits Graag danken wij Dropstuff voor een inspirerende samenwerking. Niet alleen hebben wij door dit project onontdekt terrein betreden door ons te verdiepen in Kinect in de openbare ruimte, wij hebben kennis opgedaan over urban screen games en het betrekken van steden en cultuur daarin. Dropstuff heeft ons bij elke feedbacksessie gepusht om verder te kijken en nog meer uit ons concept te halen waardoor wij met recht kunnen zeggen dat we alles uit dit project gehaald hebben. Door goede bereikbaarheid van Dropstuff en het regelmatige contact is het project goed en prettig verlopen. Kernidee Een visueel prikkelende game met korte exposure waarbij gebruikers op een vertrouwde en simpele manier interacteren. Doelgroep Alle voorbijgangers van de urban screens zoals toeristen, bewoners, dagjesmensen en meer. Binnen deze brede doelgroep lopen de leeftijden uiteen van kind tot bejaard. Mensen van 15 t/m 35 die zijn opgegroeid met digitale media zullen zich eerder aangetrokken voelen tot de urban screens. Simpele besturing en vormgeving zorgen ervoor dat wij met onze game alle leeftijdsgroepen kunnen bedienen. Omschrijving Vanuit Dropstuff hebben wij opdracht gekregen om een game te ontwikkelen voor twee urban screens, in Venetië en Amsterdam, waarmee voorbijgangers met elkaar kunnen spelen en communiceren. Wij hebben hiervoor een concept ontwikkelt waarbij we op onderzoek gebaseerde keuzes hebben gemaakt. Kernwaarden voor ons concept die uit onderzoek naar voren zijn gekomen: Universeel: toegankelijk voor mensen van alle culturen en nationaliteiten Korte exposure: vertrouwde en natuurlijke manier van interacteren en gemakkelijke drop-in/drop-out Visueel: visueel aantrekkelijk en prikkelend Ons concept is gebaseerd op het bestaande spel Filler. Filler is een simpel maar tientallen jaar oud computer spelletje waarbij de gebruiker een veld moet vullen met rondjes. Binnen het veld stuiteren verschillende balletjes die het rondje van de gebruiker niet mogen raken wanneer hij op het veld geplaatst wordt. De gebruiker plaatst rondjes op het veld door ergens binnen het veld te klikken, hoe langer de gebruiker de muisknop ingedrukt houdt, hoe groter het rondje wordt. Wanneer het rondje tijdens het groter worden wordt geraakt raakt de speler punten kwijt. Wanneer de gebruiker het rondje loslaat (door de muisknop los te laten) staat het rondje op het veld, de uitdaging is om het veld zoveel mogelijk te vullen met rondjes zonder geraakt te worden door de stuiterende balletjes. Wij hebben ervoor gekozen ons concept op dit spel te baseren omdat het spel een gemakkeljke en natuurlijke speelwijze bevat en een plezierige en soms zelfs verslavende ervaring geeft. Door het spel simpel te houden is het voor veel verschillende gebruikers toegankelijk. Het concept geeft veel ruimte om er een visuele laag aan te geven die het scherm niet alleen esthetisch prikkelend maakt maar ook een kunstwerk op zichzelf wordt. 4
Proof of concept Universeel Voor het ontwikkelen van het concept zijn wij eerst de straat op gegaan. We hebben in de binnenstad een paar plekken bezocht waar het urban screen zou kunnen staan, zoals de Dam, het Waterlooplein, het Vondelpark en het Leidseplein. Naast observeren zijn wij in gesprek gegaan met voorbijgangers om te kijken waar hun intresses liggen, hoe zij over Amsterdam en Venetië denken, en hoe zij reageren op het project idee. Uit deze gesprekken bleek dat op dit soort plekken in Amsterdam allerlei culturen bij elkaar komen, zowel de toeristen als de Amsterdammers zelf zijn heel divers. Dit was ook een element wat werd gewaardeerd aan Amsterdam: diversiteit. Wij maken met ons spel geen onderscheid dat expliciet gebaseerd is op Italië of Amsterdam. Door te kiezen voor abstracte vormgeving en simpele besturing is het spel toegankelijk voor mensen van alle nationaliteiten, talen en culturen. Korte exposure Tijdens het observeren viel ons verder op dat vooral de toeristen even de tijd nemen om naar de omgeving te kijken. Hierbij hebben we gekeken naar straatartiesten en hun voorbijgangers. De meeste mensen keken wel maar liepen door, echter als de artiest opvallend was en er al mensen rond stonden werd er vaker stil gestaan om even te kunnen kijken. Ook hierbij zijn het vaak de toeristen die de tijd nemen. Visueel Uit de gesprekken met Dropstuff kwam voort dat het scherm geen storende factor in het straatbeeld moet zijn, maar wel moet opvallen en zich moet distantiëren van reclame schermen. Wij hebben gekozen voor het creeëren van een kunstwerk waar een spelelement in verborgen zit en waar de speler aan deelneemt. In het scherm zit een illustratie verhult die door de ballen onthult wordt. Zo kan de gebruiker sturen hoeveel er onthult wordt en wat er onthult wordt door bijvoorbeeld de bal een zetje te geven naar een speciaal stukje van de illustratie. Deze verborgen illustratie zal per sessie veranderen zodat het voor de gebruikers spannend blijft wat ze te zien krijgen. Spel-element Verder desktopresearch en gesprekken met studiegenoten wees uit dat het spelen van een spel een band creeërt met je tegenspeler. Hierbij maakt het niet uit of mensen samenwerken of elkaar moeten verslaan; samen een spel delen schept vertrouwen en een band. Om deelnemers te stimuleren mee te doen maken wij op het scherm onderscheid tussen de vulling vanuit Amsterdam en vanuit Italië, er zal via het scherm gecommuniceerd worden welke stad het meest terrein heeft veroverd. Wel spelen beide steden tegen dezelfde vijand: de slechte balletjes. Wanneer een slecht balletje de bal van de speler raakt terwijl deze groeit zal de bal ongedaan gemaakt worden. Ook hierdoor hebben wij gekozen voor een abstracte vormgeving. Door het weglaten van een verhaal of andere elementen die geïnterpreteerd moeten worden kan iedereen snel erin of eruit stappen. De simpele besturing zorgt ervoor dat er weinig uitleg nodig is om deel te nemen waardoor de drempel tot deelname verlaagd wordt. 5
Usecase Scenario Wie? Twee toeristen (man en vrouw) die op verkenning zijn in Venetië of Amsterdam. Wat? Het DROPSTUFF.NL scherm op een van de locaties, en het hokje waar het spel in gespeeld wordt. Hoe? De toeristen maken foto s van de omgeving en zien het grote opvallende scherm met de uitnodigende tekst van onze game. Ze staan er even bij en zien dan het demofilmpje en zien dat ze mee kunnen doen in het hokje. De jongen wordt door het meisje gepusht om het hokje in te gaan. Toevallig stapt er in de andere stad ook iemand in. Ze spelen het spel. Meer mensen verzamelen zich om te kijken, leuk hoe de achtergrond steeds zichtbaarder word. De jongen wordt steeds fanatieker. Als hij er al een tijdje staat vraagt iemand anders of hij ook nog mag, natuurlijk mag dat. Ze blijven nog even kijken en lopen dan blij weg. Wie? Een winkelend meisje Wat? Het DROPSTUFF.NL scherm in Amsterdam, en het hokje waar het spel in gespeeld wordt. Hoe? Er staat een eenzaam scherm op een pleintje waar ze toevallig langsloopt. Het is niet zo druk. Er wordt een spelletje gespeeld en er staat groot in beeld of ze ook mee wil doen. Als ik mee kan doen, wie speelt er nu dan? Ze gaat het hokje binnen en ze begrijpt dat er al iemand in Venetië aan het spelen is. Het spel herkent de nieuwe speler en haar bewegingen worden gevolgd. Erg onwennig verliest ze het eerste potje maar de tweede keer wint ze. De Japanse toerist in Venetië vindt het duidelijk leuk dat hij nu tegen een echt iemand kan spelen. Uiteindelijk gaat ze weer door met winkelen en stopt ze met spelen, er staan inmiddels buiten al nieuwe mensen klaar om te spelen. Wie? Twee veertigers Wat? Het DROPSTUFF.NL scherm in Venetië, en het hokje waar het spel in gespeeld wordt. Hoe? Een stel van twee Duitse veertigers loopt rond in de buurt van de biënnale en eet een ijsje. Hun aandacht word getrokken door een groot scherm. Ze gaan kijken en zien al snel dat het om een spelletje gaat. Het wordt ze al snel duidelijk dat ze het spelen maar aan de jongeren die voor het hokje in de rij staan overlaten. Toch worden ze geboeid door het scherm en de mensen die erg hun best doen om te winnen. Ook de verschillende achtergronden blijven intrigeren. Ze blijven uiteindelijk nog staan lang nadat hun ijsje op is. 6
Interactie We willen dat het spel filler op de Kinect net zo spannend is als op de pc. Wat het meeste spanning toevoegd op de pc is een plek selecteren om een bal te plaatsen, op het juiste moment te klikken (beginnen met het maken van de bal) om vervolgens net op tijd de muis los te laten. Om deze eigenschappen succesvol te kunnen vertalen naar de Kinect hebben wij de Kinect HCI guidelines bestudeerd. De interactie binnen Filler is erg simpel gehouden. Er hoeft niet veel te gebeuren dus willen we de speler niet veel laten doen. De functie waarvoor interactie nodig is het creëren en weggooien van de ballen in het spel. Eerder dachten wij eraan om zoals in het originele spel een cursor na te bootsen, maar dit bleek later nodeloos ingewikkeld. Daarom hebben we ervoor gekozen om spelers de bal te laten maken door hun handen plat op elkaar te houden en vervolgens uit elkaar te trekken. Zo heeft de speler een duidelijk en helder punt om de actie mee te initiëren. Ook heeft de speler directe controle over de grote van de bal. Om de bal weg te gooien hebben wij voor een weggooi beweging gekozen, precies zoals iemand bijvoorbeeld met een skippy bal zou doen. Deze twee bewegingen lopen dan ook vloeiend en logisch in elkaar over. Voor verdere verduidelijking over de interactie in ons spel verwijs ik door naar het demo filmpje in de bijlages. 7
Stijlgids De basis van het ontwerp is simpel. Alle losse elementen zijn simpele duidelijke vormen zodat het contrast duidelijk is tijdens het spelen van het spel. De onderliggende laag is een speelse tekening met allemaal kleine details. Bij elke gemaakte vorm verschijnt er een stukje meer van de tekening, daardoor is er steeds weer wat nieuws te zien en heeft elk hoekje van het scherm weer een ander plaatje. Visual (spel status: gevorderd) kleuren De vormen die de gebruiker maakt tijdens het spel zijn cirkels met 100% dekking in krachtige warme kleur zodat deze goed afsteekt tegen de koele kleur van de achtergrond en de lijnen van de tekening goed naar voren komen. De kleuren van de platformen zijn iets feller zodat er wel onderscheid gemaakt kan worden tussen de twee. Kleine elementen zoals de rand van de platformen en de scorebalk zijn wit zodat dit er niet schreeuwt tegenover de rest maar er wel licht onderscheid te zien is. De gevaarlijke ballen in het spel zijn zwart zodat deze ook goed zichtbaar zijn op de achtergrondkleur. Venetie rood: Typografie De belangrijkste tekstuele elementen in het spel hebben een speelse uitstraling zodat deze goed past bij de stijl van de tekening. Het zijn allemaal kapitalen, duidelijk leesbaar hierdoor. Tekst in spel Thin Minty - Regular Score bord PT sans - bold Ballen R186 G41 B34 Amsterdam oranje: Ballen R241 G90 B34 Achtergrond: R218 G238 B225 Overige elementen R57 G187 B157 Platform R237 G28 B36 Platform R246 G137 B31 8
Spel visual De onderliggende tekening van het spel is hier volledig te zien. De kanten van Venetië en Amsterdam verschillen qua beelden om de twee kanten toch van elkaar te onderscheiden. De Hollandse kant heeft wat hardere nuchtere beelden. De Italiaanse kant is dromerig en zonnig. In het midden staat een boom en een fontein die de twee kanten scheidt. Spelstatus Het spel heeft meerdere statussen. Geen spelers, één speler en twee spelers. Ook wanneer een of meerdere personen spelen verandert het spel voortdurend omdat er steeds meer ballen gemaakt worden. Status: Geen spelers Status: Twee spelers, begin spel Status: Een spelerr Status: Twee spelers, gevorderd spel 9
Visueel storyboard Jesse ziet het urban screen staan in Jesse loopt naar het hokje wat Hij verschijnt op het scherm en het Hij speelt tegen een dame in Venetië. Ze maken allebei ballen om het Amsterdam. Hij staat even te kijken naast het scherm staat en gaat naar spel begint. scherm te vullen. binnen. maar wil wel mee spelen. Ze gooien beiden ballen alle kanten Hoe meer ballen er gemaakt zijn Het scherm begint aardig vol te ra- Jesse wint het spel en verdient een op. Er komen steeds meer mensen hoe meer er van het kunstwerk ont- ken. Jesse is aan de winnende hand. punt voor Amsterdam. kijken wat er gebeurt op het scherm hult wordt wat in de achtergrond zit. 10
Testresultaten Om in een vroege fase van het project een test uit te voeren hebben we goed naar de opties gekeken die beschikbaar waren. We konden een paper prototype doen maar vonden het niet bij de interactie passen dat een spel heeft. Wel konden we omdat onze basis een bestaand spel is wel aan de slag met een heel uitgebreid prototype. De proefpersonen die we hebben gebruikt variëren in leeftijd tussen de 16 en de 55. We hebben ze het spel filler zoals dat op internet te vinden is voorgeschoteld zonder uitleg. Het spel bezit wel uitleg in de vorm van een tekst scherm en wordt verder met alleen de muis gespeeld. De resultaten waren verbazend negatief. Bijna niemand wist meteen wat de bedoeling was, en uitleg werd niet gelezen. Dingen die niet duidelijk waren of verkeerd werden begrepen waren onder andere: het doel van het spel, de besturing en de spel regels. Concrete voorbeelden zijn: Een persoon die dacht dat je maar 1 bal per level mocht maken. Een aantal minuten naar de twee stuiterende balletjes kijken en niet weten wat te doen. De concepten van levels en levens niet begrijpen Technische haalbaarheid Wij als team verwachten dat ons concept technisch goed te realiseren is in samenwerking met de Kinect (of een andere motiontracker). Er zijn niet veel zware technische berekeningen die continue uitgevoerd moeten worden, doordat de spelers relatief afzonderlijk van elkaar het spel kunnen spelen. Als team hebben wij kennis gemaakt met verschillende manieren om ons concept uiteindelijk te realiseren op de Kinect. Persoonlijk hebben wij geen voorkeur voor een van de bekende platformen (KinectJS,Unity, KinectSDK, etc..) omdat wij verwachten dat ons concept met elk platform goed te realiseren is. Helaas schiet onze technische kennis hier te kort om een advies mee te geven met betrekking op het platform waarop onze game het best gerealiseerd kan worden. Een systeem wat aan de eisen van Dropstuff voldoet en de voorkeur heeft van de toekomstige programmeur lijkt ons de beste keuze. De toekomstige besturing en interactie ( uitgebreide uitleg aanwezig in het hoofdstuk interactie ) is gebaseerd op algemene bestaande kinect gestures, die goed op te pikken zijn met de gemiddelde Kinect, wij verwachten dus geen problemen op dit punt. Toen de spelers uiteindelijk het spel doorkregen waren er ook positieve reacties. Het spel werd omschreven als Verslavend en leuk. Vaak moesten de proefpersonen gevraagd worden om te stoppen, anders waren ze gewoon doorgegaan met spelen. Wat we uit de testfase hebben gehaald is dat er in onze versie van het spel minder regels moeten zitten. Daarnaast is er een alternatieve manier nodig om het spel uit te leggen, bijvoorbeeld een video. 11
Communicatie tot de gebruiker De communicatie binnen ons spel wordt beperkt tot een minimum zodat taal geen barrière vormt. Dit minimum ligt bij de spelinstructies en de weergave van de score. Deze communicatie zal vertaald moeten worden naar beelden. In het speelhokje zal een tweede scherm aanwezig zijn waarop de gebruiker doorgaans zal zien hoe hij het spel kan besturen aan de hand van een voorbeeld animatie. In het tonen van de score en het vragen om deelneming zal ook zo min mogelijk taal gebruikt worden. Echter zal de gebruikte tekst in het engels zijn. Content Content voor oplevering De demo game is gemaakt in Flash en toont alle belangrijke functionaliteiten en onderdelen van het concept. Het laatste ontwerp is verwerkt in deze versie van de demo. De demo is snel te starten op meeste computers (zolang flash ondersteund wordt) en daarnaast kan deze demo ook vrij gemakkelijk ergens online geplaatst worden. 1 demo filmpje (link) 1 demo game (link/dvd) Toekomstige content Om het spel meer variatie te geven moeten er meerdere illustraties/ visuals komen. Elke sessie krijgt dan zijn eigen beeld, zo blijft een tweede of derde keer spelen/kijken leuk en interessant. 12