Peter Plys et 3d eventyr by Detailreklame A/S

Christian Dyring Poulsen, 3 Semester KEA eksamensprojekt 2013 http://s13opt3dexam07.keaweb.dk/

Konceptet

Walt Disney er et stort firma med mange afdelinger, de lever af at lave tv, merchandise, radio, og meget andet, men bedst kendt er nok afdelingen Walt Disney Studios, for deres tegnefilm. Walt Disney har mange karakterer i deres samling, en af dem er Peter Plys. Disney har mange online aktiviteter til børn, i form af spil, malebøger og meget andet på deres hjemmeside. Sitet er blevet et oplevelses site hvor mange børn går ind og spiller spil, ser videoer og meget andet, Derfor ville det være en mulighed at udgive et spil på deres hjemme side og samtidig skabe mere fokus på en af deres produkt serier. På den danske Peter Plys hjemmesiden1 er der ikke sket noget siden starten af 2011, det ses b.la. Ved at der stadig er reklame for biografpræmieren på filmen ”Peter Plys - Nye eventyr i Hundredemeterskoven”, som havde præmier 13. oktober, 2011. I anledningen af den årlige Peter Plys dag Den 18. januar, 20142. Skal dette Peter Plys spil være med til at promovere Peter Plys på ny, og øge fokus på Peter Plys igen. Børn og unge skal kunne gå ind på en kampagneside lavet til anledningen og gå på opdagelse som Peter Plys, løse små opgaver/missioner i verdenen, i og omkring 100 meterskoven. Og derved lære mere om Peter Plys og hans venners hverdag. Spillet skal endvidere være lavet på en måde, hvor man kan spille spillet direkte i browseren. Dette for at spillet får størst mulig brugervenlighed, men også for at binde 3D-produktet direkte sammen med kampagnesiden. Ved at bruge 3D og ikke 2D, til dette vil man få mulighed for at gå på opdagelse med Peter Plys, og styre frit rundt i en 3D-tegnefilmsverden, som er bygget op omkring den verden man kender fra filmene. Hvor at et 2D Ikke ville kunne blive ”realistisk” på samme måde, og muligheden for at gå rundt som man har lyst, ikke ville være til stede. Da tegnefilmene er lavet i 2D vil det blive svært at få skabt det det rigtige miljø i 3D, hvor at hvis man lavede det i 2D, ville det være nemmere da man er vant til at se filmene sådan. Men da det er de helt små der skal spille spillet, vil 3D universet blive lavet så ”blødt” og ”klart” som muligt, med klare farver og runde former der appellerer mere til små børn, end høj kompleksitet og detaljeret objekter ville gøre. Det er underligt at et stort firma som Disney med rigelig kapital ikke har lavet et 3D browser spil om Peter Plys. Alle deres figurer er formentlige allerede bygget i 3D, og Peter Plys er et kæmpe brand med accessories i alle afskygninger, Så et spil ville promovere brandet yderligere og med stor sandsynlighed skabe øget salg af deres egne produkter.

1) http://www.disney.dk/peter-plys/hjem/ 2) http://da.wikipedia.org/wiki/Peter_Plys

Udviklingsprocessen Startede med at finde miljø billeder af den verden peter plys og hans venner befinder sig i, og fandt hurtigt ud af der har været mange forskellige måder at tegne historierne, igennem tiden. De tidlige tegninger af Peter Plys fra før Disney købte rettighederne, er ofte stregtegninger som ligner en gammeldags bamse. Da Disney så lavede den første spille film 1966, tog han den form som han har i dag. Man kan se han er blevet en del animeret at se på, men samtidig er man heller ikke i tvivl om at det er peter plys man ser på. Hvorimod den gamle version af Peter plys ser langt mere “virkelig” ud, men til gengæld ligner den enhver anden bamse fra samtiden og har slet ikke den samme personlighed som vi kender så godt fra idag. Men denne verden som han optræder i, i filmen fra 1966 ville stadig være svær at ”fange” og gøre genkendelig i et 3D univers. Da denne verden stadig er meget detaljeret, og lavet som stregtegninger. Men i nyere billeder/plakater af Peter Plys og hans venner. Fandt jeg et miljø der har omgivelser i bløde og runde former, som man ville have større og bedre mulighed for at fange i 3D. Da den visuelle stil var på plads, manglede jeg så undersøge de forskellige miljøer og områder de forskellige karaktere i verden bor i Peter Plys og vennerne bor i. Især deres boliger skulle være genkendelige da børnene skulle kunne identificer de forskellige områder, fra den verden de kender fra filmene. Her fandt jeg så en del illustrationer af de forskellige huse. F.eks. Peter Plysses hus under det store træ med træ stammen på jorden, Æsels der bor i et telt af grene. Osv. ”se bilag 1”.

Jeg ville gerne lave hele den verden Peter Plys befinder sig i, men på grund af tidspres. Indså jeg med det samme at jeg måtte begrænse verdenen for at kunne lave en fungerende prototype af spillet. Så ud fra et eksisterende kort ”bilag 2” af den verden historierne foregår i, tegnede jeg en skitse af området, den lille historie kunne udspille sig i.

Målgruppe og gameplay Målgruppen er omkring alderen 3-10år da børnene skal havde udviklet motoriske færdigheder til at kunne betjene en computer, og kunne finde ud af at manøvrere Peter Plys rundt i verden ved hjælp af mus og tastatur. I fremtiden kunne det tænkes at en app til smartphones eller tablets ville være en god mulighed. For der kunne man kontrollere Peter Plys ved hjælp af touchscreen, så yngre børn også ville kunne finde ud af spille det. Især inden for tablet industrien er der store markedsmuligheder for at få den her type spil spredt. Altså en form for ”læringsspil” hvor der bliver stillet nogle opgaver, men hvor det er en integreret del af gameplayet og hvor der er lagt lige så meget fokus på at spillet er sjovt som at børnene lærer at udfører nogen simple opgaver.

Ved at bruge en karakter som børnene kender i forvejen og kan identificere sig med, vil det være lettere for børnene at holde fokus og skabe et bedre og sjovere spil. Fordelen ved at lave et 3D spil i stedet for f.eks. en animation er at børnene kan interagere med verdenen som gør det langt mere interessant i længere tid, fordi i stedet for at sidde og se på en statisk film kan man stille børnene små opgaver som de bliver belønnet med via ”carrot on a stick”3 4 med f.eks. adgang til nye områder, nye genstande de kan interagerer med og sværere opgaver. ”Carrot on a stick” princippet som af mange anses for en uetisk måde at lave spil på da man kan lave spil der ikke umildbart er sjove at spille, men hvor belønningen til sidst gør at man bliver ved med at udføre opgaver som ellers ville syntes ville være kedelige og monotone. World of Warcraft bruger f.eks. denne metode til at sørge for deres spillere bliver med at spille og betale et månedligt kontingent, her er det ikke en særlig sympatisk metode at bygge et spil op Men hvis man kunne kombinere det med et Peter Plys læringsspil så børnene bliver ”belønnet” af at løse opgaver ville det jo være en rigtig god måde til at udvikle børnene samtidig med de syntes det er sjovt

Historien Da Peter Plys er en meget honning glad bjørn, fandt jeg hurtigt frem til en lille historie til spillet. Tanken var at gøre brug af tre-akter-modellen5 til at fortælle den gode historie igennem spillet, som skulle være med til at holde en fanget af spillet. I Første akt skulle man se en kort filmanimation, hvor konflikten er at Peter Plys efter at have spist det sidste honning, forgæves leder i sit hus efter mere, hvor efter Peter Plys så må søge hjælp hos Grisling og høre om han har noget honning. Så starter spillet og den første opgave er at finde Grislings hus. Anden akt starter da Peter Plys opdager at Grisling heller ikke har mere honning. For at få opfyldt sit honning behov, må Peter Plys så drage ud i verdenen og finde de 3 honning krukker som Grisling har fortalt hvor er. Ved at følge de anvisningerne på sedlerne fra Grisling kan man finde frem til de 3 honning krukker. Tredje akt starter når Peter Plys finder den sidste krukke med honning og den uorden der har været i hans dag bliver genoprettet. Der kunne der igen komme en kort filmanimation hvor man ser Peter Plys sidde og spise den honning han har fundet. Tre-akter-modellen er desværre ikke helt lykkes, da der ingen filmanimationer er i starten eller slutningen og derfor bliver historien lidt tam, da der mangler en ordentlig introduktion til konflikten. Man for heller ikke den forløsning til sidst som det bygger op til når man finder den sidste krukke. Men ved at lave disse animationer eller bygge vider på historien til sidst kunne man skabe en velfungerende historie.

3) http://www.siliconera.com/2010/02/21/the-carrot-on-a-stick-approach-to-game-design/ 4) http://en.wikipedia.org/wiki/Carrot_and_stick/ 5) http://www.emu.dk/tema/medier/grundskolen/dokumenter/tre_akter_modellen.pdf

Lyd

IEZA modellen6 for lyd i spil. Zone, Effect, Affect og Interface. Ved at kikke på IEZA modellen har jeg brugt lyde i spillet på følgene områder. Zone: Lyden af bier ved bi træet, som Er med til at gør en opmærksom på at man er ved bi træet. Og lyden af regn ved Æsels telt, er med til at underbygge stemningen i disse områder. Effect: Af effekt lyde er der lyden af Peter Plys når han finder honning krukkerne. Der kunne f.eks. også have været lyde af skridt når Peter Plys går rundt. Eventuelt en lyd når han går på grus og en anden når han går på græs, men dette må komme med i en senere version Affect: Her har vi baggrunds musikken der spiller på repeat, og kan ikke påvirkes af aktivet i spillet. Denne lyd er med til at skabe en genkendelighed mellem film og spil. Og underbygger en hyggelig stemning I spillet Interface: Da der desværre ikke var tid til at lave menuer, eller tid til at lave lyd til HUD (Heads Up Display), så der ikke nogen interface lyde med I spillet. Men ville komme med I en evt. Fremtidig version af spillet.

6) http://www.gamasutra.com/view/feature/131915/ieza_a_framework_for_game_audio.php

Produkt Dokumentation Maya Efter at have fundet ud af hvad det var jeg ville lave, begyndte jeg at lave hovedkarakteren Peter Plys, i 3D programmet Maya. Ved hjælp af ”Image plane” billeder som reference. Startede jeg med at lave en polygon flade, hvor jeg langsomt, skabte Peter Plys hoved. Med størst brug af ”intaractive split tool”, ”insert edge loop tool” og ”extrude tool”, og ved at rykke rundt på edges, faces og vertex’es. Fik Peter Plys ansigtet langsomt den rigtige form. Til sidst brugte jeg ”Mirror Geometry” værktøjet, så ansigtet blev symmetrisk og fik et fuldt ansigt, hvor de sidste justeringer fandt sted. Øjne, næsen og tungen er Polygon Spheres som er blevet flyttet ind i ansigtet, øjn brynene er polygon cubes der er blevet manipuleret til den rigtige form.

Kroppen blev lavet med udgangs punkt i en polysphere hvor at jeg slettede den ene halvdel og ellers brugte samme metode som ovenfor til at skabe den rigtige form. Benene blev skabt ved hjælp af box modelling metoden, Jeg extrudede de forskellige faces, så der langsomt blev skabt et ben, der så blev duplikeret og spejlvendt til højre side. Samme metode blev også brugt til armene.

Til sidst brugte jeg Booleans -> Union værktøjet til at sætte hele figuren sammen til en, med undtagelse af øjne, næse, tunge, øjenbryn og bluse. Hvilket først virkede da jeg fyldte hullerne i modellen. Til sidst brugte jeg Mesh -> Smooth værktøjet til at skabe en blød overflade.

De eneste shaders der er brugt på Peter Plys modellen, nogle simple ”lamberts” i gul, rød og sort. Til at give en idé om hvordan modellen så ud inden den skulle exporters. Jeg har ikke lagt vægt på shaders/materials i maya fordi Unity ofte ikke er kompatibelt med komplicerede overflader fra maya.

Skelettet blev sat i, med udgangspunkt i bækkenet, hvor det så blev bygget op til nakken, og der efter armene, og til sidt ben og fødder. Skelettet blev til sidst smooth binded med modellen og skulle så være klar til at blive hentet ind i Unity. En af de andre ting som jeg modellerede i Maya er honningkrukkerne, hvor jeg benyttede mig af en anden fremgangs måde, her startede jeg igen med ”Image plane” billeder som reference, hvor efter jeg brugte værktøjet ”EP Curve Tool” til at tegne formen på den ene side i profil, og derefter trykke Revolve, som så får stregen til at cirkulere om y-axen og forme krukken. Dette bliver til et Surface object og skulle konverteres til et Polygon object, for senere at kunne importere det til Unity. Jeg fik sat teksten Hunny på krukken ved hjælp af, UV Texture Editoren i maya. Og kunne der efter exportere det hele så det var klar til brug i Unity.

Unity Ved at bruge Unity som er et spiludviklings program og game engine, begyndte jeg så at lave selve spillet. I Unity startede jeg med at placere et directional light object, hvilket bestemmer hvilke vinkel lyset i spillet skal komme fra. Der efter blev tærrenet placeret og hævede så den del af terrænet som spillet skulle forgå på, så det på et senere tidspunkt kunne sænkes i igen der hvor åen skulle være. Så skulle Peter Plys gøres klar til at kunne reagere på bruger input, og skulle bevæge sig. Der valgte jeg at bruge Mecanim fra Asset store7 og de indbyggede animationer at animere figuren. Og brugte de indbyggede scripts i Mecanim til at få figuren til at bevæge sig når man bruger piletasterne eller w,a,s,d knapperne. Hvilket så gav en masse komplikationer med det skelet jeg havde fået lavet. Derfor måtte jeg til sidst opgive, og fandt en nemmer og hurtigere løsning hos mixamo8 som kan rigge din figur automatisk, nu var problemet bare at jeg havde lavet en alt for kompleks figur med over 64000 faces. dette skulle ned på under 10000 faces, hvis det skulle være gratis. Så måtte man åbne Maja igen og reducere antallet ved at trykke på mesh -> reduce. Der kunne det have været smart at have gemt en tidligere version som ikke var blevet smoothed. Så havde dette problem ikke været der.

7) Asset store, Mecanim, Unity Technologies https://www.assetstore.unity3d.com/#/content/5330 8) http://www.mixamo.com/

For at få Kameraet til at fungere og følge Peter Plys så jeg en tutorial på youtube om ”RPG Style Camera and Movement”9. Jeg brugte og ændrede nogle af de tilhørende scripts, til at få en flydende kamera bevægelse. Kameraet følge nu Peter Plys og man kan styre kamera vinklerne med ved et trykke på højre musseknap og bevæge musen, som man er vant til fra andre RPG spil. Kameraet er også blevet indstillet til ikke at bevæge sig ind i objekter men hele tiden holde en minimums afstand til disse, for at ikke at ”film” inde fra f.eks. et træ eller under terrænet. Jeg tilføjede også et soundtrack til selve kameraet, så man kan høre stemningsmusikken hele tiden, da Audio Listeneren også sidder på kameraet. 10

Da jeg havde tingene på plads med hovedkarakteren og kameraet, begyndte jeg at lave terræn med det indbyggede terræn værktøj i Unity. Så det kom til at minde om min skitse for landskabet. For at spare tid og ikke skulle modellere alle elementer i spillet selv, fandt jeg en pakke i Unity asset store kaldet Toon level kit11 med træer, hegn, blomster mm. Og tilføjede visse elementer, der passede ind i stilen fra denne pakke. Hvert enkelt træ blomst, bakke, hegn osv. Placerede jeg så rund om i landskabet så jeg kom så tæt på den visuelle stil der er på Disney plakaterne som muligt. Næste skridt var at placere en masse store Box coliders ”usynlige i spillet”, så man kun kan blive i nærheden af stierne og på den måde guide spilleren igennem banen. Og spiller ikke kan løbe forvirret rundt hvor det ikke er meningen man skal være. Se billederne neden for (de store hvide bokse på billedet til højre er colliders, der sørger for at man bliver på stierne).

Også hegn, træer og andre ting har fået capsule coliders, da man ellers ville kunne gå igennem træer og hegn, hvilket ikke ville være realistisk.(eksemplet her til højre)

9) RPG Style Camera and Movement, http://www.youtube.com/watch?v=gXx26EQ-qZk” 10) Soundtracks - Peter Plys - Nye eventyr i Hundredemeterskoven (2011) http://en.wikipedia.org/wiki/Winnie_the_Pooh_%28film%29 11) Toon level kit - fra Asset store (Hedgehog Team) https://www.assetstore.unity3d.com/#/content/4679

Ved Peters Plys hus er der tre veje der fører væk. Ved to af dem er der hegn og en port der er blevet spæret af med to brædder. Ville gerne have haft tid til at lave en lille låge ved hver port der åbnede og lukkede når man kom tæt på, hvilket nemt ville, kunne lade sig gøre ved at lave en animation i maya, og så afspille den når man aktiverede en box colider trigger.

Jeg har også brugt Playmaker12 fra Asset store, for at gøre det interaktive nemmere og hurtigere end at skulle skrive alt JavaScript selv. Denne måde er meget visuelt sat op, og det gjorde det nemmer at spore sig frem til fejl når disse opstod undervejs. Der er lavet et HUD (Heads Up Display), i form af de tre honning krukker der kommer på skærmen i øverste venstre side når man møder Grisling (Grisling er fundet på nettet13). Disse objekter er blevet nestet i kameraet, så at de altid vil være synlig og holde samme position i relation til kameraet. Disse tre honning krukker er der faktisk fra start, men bliver skaleret ned til 0, når spillet starter, så de ikke er synlige. Og bliver derefter skaleret op til normal størrelse igen når man møder Grisling. Dette foregår ved at jeg har givet Grisling en sphere colider som er blevet sat til at være en trigger. Når man så bevæger sig ind i dette område omkring Grisling, aktiver man scriptet i playmaker og krukkerne bliver synlige ”se bilag 3”. Det samme sker med objektet med ”beskeden” fra Grisling om hvor honning krukkerne er. Men dette objekt ”beskeden” har også et script om at destruere sig selv når man har læst og trykker på det. Samtidig med at disse ting sker, bliver også brædderne på den ene port ved Peter Plysses hus destrueret, og der bliver nu adgang til et nyt område i spillet, hvor det store honningtræ er. Når man finder en honningkrukke, som også har en sphere colider, som er blevet sat til at være en trigger. Og nå denne bliver aktiveret bliver der spillet en lille lyd stump af Peter Plys der siger han kan lide honning14.

12) Playmaker - fra Asset store (Hutong Games LLC) https://www.assetstore.unity3d.com/#/content/368 13) “Grisling” http://orel67spapers.blogspot.fr/2012/03/porcinet.html) 14) “Lyd” http://www.soundboard.com/sb/Winnie_the_Pooh_clips

Når lyden bliver spillet er der samtidig en Wait kommando på 3 sekunder før det næste sker, som ligesom tidligere er en seddel med henvisninger til næste honning krukke. Ved det store bi træ er der også lyden af bier der flyver rundt15, denne lyd er blevet sat på repeat så den spiller i bagrunden hele tiden, man kan kun høre dette når man kommer tæt træet, dette fungere lidt på samme måde som en Sphere colider trigger, men her sætter man et punkt som er lydkilden og en max afstand fra lyd kilden. Hvor jeg så har justeret lyd styrken fra lydkilden til max afstanden, i en kurve, så lyden er lavest yderst og højest inderst ”se bilag 4”. Dette giver en mere realistisk virkning da jo tættere man på træet, jo tydeligere kan man høre bierne. Samme princip er blevet brugt ved Æsels telt, hvor lyden af regn16 bliver brugt til at understrege det dårlige vejr. Regnen ved æsels telt er et Particle System hentet fra unity asset store17 som er placeret mellem skyerne og terrænet, og så skaleret op til en passende størrelse. Det hele er præsenteret på en enkelt kampagneside lavet i HTML5. Har valg at gøre brug af farverne rød, gul og sort, Da det også er de farver Peter Plys består af. Ved at have få links på siden, undgår man for meget distrahering af de mindste når de kommer ind på sitet. Bruger test med min datter har vist at når der er for mange spændene ting at trykke på, på en side. Kunne hun ikke lade vær at trykke på disse. Slideren i toppen viser billeder fra spillet, hvor under der er et stort link til selve spillet, der så åbner op i en ny side når man trykker på linket. Dette er fordi at jeg simpelthen ikke kunne få ”Unity vinduet” integreret på siden. Under linket til spillet er der links til andre aktiviteter med peterplys. Baggrundsbilledet med Peter Plys er igen med til at skabe et genkendeligt miljø for de små Efter at havde fået alt til at ’spille’ endte jeg med et samlet resultat som jeg er var godt tilfreds med. Her er et billede fra spillet, hvor Peter Plys står på pladsen foran sit hus.

15) lyd af bier (http://www.sounddogs.com/results.asp?Type=1&CategoryID=1035&SubcategoryID=1) 16) lyd af regn (http://www.soundjay.com/rain-sound-effect.html) 17) Simple Rain FX - fra Asset store (MysterySoftware) https://www.assetstore.unity3d.com/#/content/8902

Litteraturliste Carrot-on-a-stick Ishaan . (February 21, 2010) (Set Maj 24, 2013) http://www.siliconera.com/2010/02/21/the-carrot-on-a-stick-approach-to-game-design/ http://en.wikipedia.org/wiki/Carrot_and_stick

IEZA modelen Richard van Tol, Sander Huiberts (January 23, 2008 ) (Set Maj 23, 2013) http://www.gamasutra.com/view/feature/131915/ieza_a_framework_for_game_audio.php Info om peter plys http://www.disney.dk/peter-plys/hjem/ (Set Maj 21, 2013) http://da.wikipedia.org/wiki/Peter_Plys (Set Maj 21, 2013) Tre-akter-modellen (Set Maj 22, 2013) http://www.emu.dk/tema/medier/grundskolen/dokumenter/tre_akter_modellen.pdf Fra Unity Asset Store Mecanim, fra Asset store (Unity Technologies) https://www.assetstore.unity3d.com/#/content/5330 Playmaker - fra Asset store (Hutong Games LLC) https://www.assetstore.unity3d.com/#/content/368 Simple Rain FX - fra Asset store (MysterySoftware) https://www.assetstore.unity3d.com/#/content/8902 Toon level kit - fra Asset store (Hedgehog Team) https://www.assetstore.unity3d.com/#/content/4679 Andre 3D elementer “Grisling (marts, 2012)” http://orel67spapers.blogspot.fr/2012/03/porcinet.html (set Maj 25, 2013) “Mixamo online 3D rigging” http://www.mixamo.com/ (set Maj 25, 2013) Lyd Bier (set Maj 26, 2013) http://www.sounddogs.com/results.asp?Type=1&CategoryID=1035&SubcategoryID=1 Peter plys snakker om Honning (set Maj 26, 2013) http://www.soundboard.com/sb/Winnie_the_Pooh_clips Regn (set Maj 26, 2013) http://www.soundjay.com/rain-sound-effect.html Soundtracks - Peter Plys - Nye eventyr i Hundredemeterskoven (udgivet 2011)(set Maj 26, 2013) http://en.wikipedia.org/wiki/Winnie_the_Pooh_%28film%29 Youtube JesseEtzler0 “RPG Style Camera and Movement” (Januar 9, 2013) (set Maj 21, 2013) http://www.youtube.com/watch?v=gXx26EQ-qZk

Bilag 1

Bilag 2

Bilag 3

Bilag 4