Dev Log VI

Mole munch är vår tagning på hur man gör ett arkadigt mullvadsspel där du skall undvika fienden som studsar mot väggarna och plocka upp grönsakerna. Man kan vara under jord där man är halvt skyddad från mullvadsfångarna. Ifall de ser en jordhög som man lämnar efter sig så kommer dem att fylla den med vatten.

Det grafiska uttrycket som vi söker till spelet är tänkt att vara av den enklare och mer tecknade stilen. Detta eftersom vi vill få spelaren att känna sig trygg och få fram uttrycket “bli ett med det inre barnet”. Alltså fånga den glada känslan från när man var yngre och inlindad i samhällets och trygghetens varma värld. När man inte behövde bekymra sig eller tänka på så mycket än vad man vill göra just nu.

Denna veckas inlägg kommer att fungera mer som en återblick i utvecklingsprocessen av mole munch. Jag kommer att diskutera vad jag har lärt mig under kursens gång och hur jag skall gå vidare med min kunskap. Kommer även gå igenom lite problem som vi stötte på och hur vi kringgick dessa.

Vet inte ifall detta inlägg kommer att uppfylla alla kriterier vi har för vår blogguppgift i spelutveckling, får hoppas på att det gör det.

Så för ca åtta veckor sedan så slussades jag in i grupp tretton. Dem hade valt konceptidén Mole munch som sitt projektarbete. Vi utsåg Sebastian som lead gamedesigner och började arbeta igenom konceptet. Vi pappersprototypade våra förändringar och gjorde så att spelet gick från lite mer stealth till mycket mer arkadigt gameplay.

För min egen del så sattes jag som lead artist och bestämde att ett cartoony tema med isometriskt perspektiv skulle få fram den intressanta och lekande känsla som vi ville ha ut. Den cartoony stilen skulle påminna spelaren om dess barndom och ge en relation till spelet. Medan det isometriska perspektivet skulle pressa oss fyra grafiker att prestera samt kunna ge spelet en mer intressant miljö att vistas i.

Jag gjorde en moodboard men tror faktiskt att den inte användes någon gång under hela projektets gång. Dåligt av oss men det kan nog bero mycket på att vi kände oss stressade och pressade så vi glömde bort den.

Dock så flöt det grafiska arbetet på bra. Detta mycket tack vare för att vi hade en bra scrum backlog samt att den grafiska delen av designdokumentet blev klar ganska så snabbt.

Efter fem veckor, dagen innan alphan, och mycket slit med isometrin så fick vi ett väldigt stort avbräck. Detta genom att programmerarna sa att de inte kunde implementera grafiken då kollisionen endast var i 2D-världens platta sfär. 

Dessa var några av dem assets som fick skrotas efter det dystra beskedet från programmerarna.

Vi fick nu gå från isometrisk till top down då detta är enklare att programmera i och med man bara behöver arbeta i två axlar, x och y. Jag var aldrig orolig över att grafiken till spelet skulle bli klart då denna vy blir enklare i och med att man slipper tänka på djupet lika mycket. Dock var det väldigt tråkigt då vi förlorade yta i spelet där vi hade kunnat förskönat det. Så vi löste problemet på det enkla sättet genom att helt enkelt kasta och göra om.

Nu var det dags att göra miljön så att den blev intressant i fågelperspektiv. Något som jag personligen tycker är väldigt svårt då det inte blir så mycket att experimentera med. Dock så gick vi ifrån det somriga temat och vände det till hösten. Detta eftersom jag fick en briljant idé om att man kunde ha vattenpölar i gräset med moln som passerade i reflektion. Detta var en väldigt enkel asset och jag gjorde det på någon timme.

Obs. denna gif är av väldigt dålig kvalité och visar endast idén bakom. (Tryck på den bilden för någorlunda bättre kvalité)

Dock så kommer denna asset att tyvärr inte användas då våra programmerare har annat att implementera samt balansera ut spelet.

Men vi fick ändå ihop väldigt bra assets som håller en högre kvalité rakt igenom i top down vyn. Vårt gameplay är lekfullt och så som vi ville ha det från början och jag är väldigt nöjd med vår produkt. Det finns en del som kan finputsas men det får bli en annan gång

Detta har varit nio fartfyllda veckor och kursen lider nu mot sitt slut. Det är rapport som skrivs nu och blicken lyfter mot ny horisonter och nya spel att designa och utveckla.

Några kunskaper som jag tar med mig är måleriet med olika gråskaliga valörer då jag har utvecklat mig själv med detta. Samt att det behövs en stabil grund där man vet vad som fungerar och inte fungerar ifall man vill slippa kasta sitt arbete ner i papperskorgen.

På återseende och lycka till!

Dev Log V

Mole munch är vår tagning på hur man gör ett arkadigt mullvadsspel där du skall undvika fienden som studsar mot väggarna och plocka upp grönsakerna. Man kan vara under jord där man är halvt skyddad från mullvadsfångarna. Ifall de ser en jordhög som man lämnar efter sig så kommer dem att fylla den med vatten.

Det grafiska uttrycket som vi söker till spelet är tänkt att vara av den enklare och mer tecknade stilen. Detta eftersom vi vill få spelaren att känna sig trygg och få fram uttrycket “bli ett med det inre barnet”. Alltså fånga den glada känslan från när man var yngre och inlindad i samhällets och trygghetens varma värld. När man inte behövde bekymra sig eller tänka på så mycket än vad man vill göra just nu.

I detta inlägg så kommer du att få lära dig om min progress till poänggrafiken i vårt spel. Denna grafiken kommer att användas för spelaren så att hon vet vad hon skall plocka upp för att få poäng. Jag ville få till enklare former och starkare färger för att få spelarens subtila uppmärksamhet. Hon skall enkelt och snabbt förstå att detta är något hon skall ta sig till.

Då morötter är en organisk och levande form så tittade jag upp olika referenser. Detta för att försöka förstå hur en morot ter sig i olika förhållanden och perspektiv. Jag tittade på allt från endast toppar av morötter till Snurre Sprätts ikoniska halvätna morot. Just Snurre sprätts morot då den är av den enkla och cartoony stilen.

När jag hade samlat information om hur en morot verkligen är och ter sig så var det dags att skissa upp formen på den. Då vårt spel är i top-down vy så använde jag mig av en enkel grå ellips som basen av moroten. Därefter, på ett nytt lager, skissade jag fram bladen som kommer från moroten.

När detta var klart så graderade jag min ellips så att den blev ljusare i mitten och mörkare på sidorna. Detta ger formen ett djup då det ljusa uppfattas som närmre dig. Sedan så använde jag mig av en texturerad eraser-brush och började sudda ut i kanterna på ellipsen. Detta för att få en oregelbunden och organisk form.

När det var dags för bladen så använde jag en enkel grön färg som jag målade efter skissen. För att sedan ge bladen lite djup så använde jag mig av ljusare och mörkare valörer. Detta gav enkla skuggor och höjdpunkter. Bladen avslutades med en sketchy outline för att få till en mer tecknad stil.

För att förstärka morotens uttryck som poänggivande så gav jag den en ganska så stark och blinkande gul glow runt om. Denna gjorde att morotens orangea och gröna färg förstärktes så att spelaren enkelt kan känna att detta är en belöning.

Det var allt eller som snurre sprätt skulle sagt:

GIFSoup

Dev Log IV

Mole munch är vår tagning på hur man gör ett arkadigt mullvadsspel där du skall undvika fienden som studsar mot väggarna och plocka upp grönsakerna. Man kan vara under jord där man är halvt skyddad från mullvadsfångarna. Ifall de ser en jordhög som man lämnar efter sig så kommer dem att fylla den med vatten.

I detta inlägg så kommer jag att gå igenom min återanvändning av våra menyknappar. Dessa gick från att vara knappar till vår GUIs bakgrund. På detta sätt kunde jag snabbt och effektivt använda mig av befintlig grafik för att skapa ny. Detta har även mycket med modulär grafik att göra, något som jag gick igenom förra veckan i mitt skapande av vägg för spelet.

Till spelets meny och passiva enheter så tänkte vi oss använda plankor i spelet. Detta eftersom man enkelt kan få en cartoony stil på dem samt att det är återkommande i våra trädgårdar. Träd och plankor är något som finns överallt och det gör att spelaren kommer att få en högre relation till spelet genom dessa små men kännbara saker.

Vår meny ser ut såhär för närvarande. Denna bild kommer att förändras tills spelet släpps då vi har höstfärger samt att texten smälter ihop med plankan för mycket.

Även här har jag återanvänt grafiken för att spara tid. Dock måste jag fixa till dem så att det inte blir för repetitivt för betraktaren.

Då det är samma planka fast duplicerad så tog jag en av dem och duplicerade till mitt speldokument där jag får en översyn på vårt spel. Väl härinne så placerade jag plankan i den nedre delen av bilden och kopierade till tre plankor i följd efter varandra. För att få mer variation på dem så flippade jag vissa horisontellt eller vertikalt, ibland både och. På detta vis fick jag aldrig samma former på samma “position”.

Då detta skall vara en enda lång planka med höstlöv på så fick jag nu radera ut de svarta linjerna som gjorde dem till egna objekt. Samt förlänga de mörkbruna skårorna för att göra allting enhetligt.

Nu när vi har fått fram vår långa planka så är det dags att försköna och göra den unik. Detta gjorde jag genom att ta en lövpensel och dra på olika platser på och bakom plankan. Med fokus på kanterna.

Det kanske är svårt att se men nu har jag lagt till löv både framför och bakom plankan. Dem bakom hjälper till att ge ett trovärdigt djup hos föremålet då alla löv inte ligger platt på.

Syftet till att jag återanvänder mina knappar till att bli vårt GUI är för det främsta att det är tidsmässigt och jobbmässigt mycket mer effektivt än att rita något nytt och unikt. Även om det är ett väldigt litet och enkelt objekt som jag gör det på. Och som jag säkerligen skulle kunna fixa relativt snabbt ifall jag gjort något nytt. Så gäller det att få in tänket att kunna återanvända så mycket som möjligt utan att det syns. Detta eftersom det kommer att dra ner kostnaderna för ett spel avsevärt ifall man arbetar så här.

Ifall vi tar en sten till ett grafiktungt spel som crysis som exempel, så kan vi få denna sten att bilda ett berg genom att duplicera, rotera, förstora och förminska, utan att ha spenderat en enda minut i ett 3D program. På detta sätt ger vi miljödesignern verktyg att kunna skapa det hon vill skapa utan att det skall ta någon längre tid genom olika iterationer av stenen. Och det är detta som gör att man får fram magnifika miljöer på ett snabbt och enkelt vis.

What you get, will give you the world.

Tack för mig och lycka till!

Dev log III

Mole munch är vår tagning på hur man gör ett arkadigt mullvadsspel där du skall undvika fienden som studsar mot väggarna och plocka upp grönsakerna. Man kan vara under jord där man är halvt skyddad från mullvadsfångarna. Ifall de ser en jordhög som man lämnar efter sig så kommer dem att fylla den med vatten.

Denna vecka går jag igenom hur mitt arbete kring vårt väggobjekt, en lövhäck, gick till. Då vi i förra veckan fick gå från isometriskt perspektiv till top-down. Detta eftersom våra programmerare inte kunde implementera isometriskt perspektiv med önskat resultat. Vi har nu fått slänga vår grafik och göra om allt till top-down därför kan det vara trevligt att gå tillbaka till mitt första inlägg och läsa om hur jag gjorde vår lövhäck i isometriskt perspektiv.

Mina tankar om lövhäcken var att få fram en naturlig men säregen formgivning så att spelaren enkelt kan se att det är ett solitt objekt som hon styr mot. För att få fram denna känsla så måste man få till oregelbundna former samt ett djup i objektet. Detta gör att man får den där känslan om att det är en lövhäck som man tittar på och inte en stenvägg eller dylikt.

Storeken på mitt dokument var 512×512. Detta eftersom jag arbetar efter the power of two. Det vill säga att man dubblar värdet hela tiden (2×2=4 4×2=8 8×2=16 16×2=32, etc. etc.) Dock kommer storleken i spelet säkert regleras neråt så att den blir mindre men nu valde jag denna storleken så att jag lättare kan få till detaljer. För att få till djupet och formerna så började jag blandade jag svart och vit färg med en pastellpensel i photoshop. Detta gjorde så att jag enkelt kunde “modellera” till formerna och ge skugga och highlights på dem ställen som jag ville ha det.

Detta lager fungerar som min grund. De ljusare partierna ger känslan av att det är närmre spelarens ögon, ett fejkat djup. Färgerna kantas även av en struktur som ger intrycket av att små beståndsdelar som bygger upp objektet.

Då jag ville ha ett modulärt (kunna kopiera så att det ser naturligt ut) så gjorde jag en kopia på lagret sedan offset i vertikal riktning med 256 pixlar, det vill säga hälften av dokumentets storlek. Det nya lagret lade jag överst och suddade ut mittenpartiet så att de båda lagren naturligt blandades samman.

Detta gjorde så att min häck började och slutade på samma sätt. Därav dess modulära egenskap. Detta är något som är återkommande inom miljödesign då man sparar mycket plats och tid på att kunna återanvända assets.

Något som man dock ska passa sig för är att designen blir för repetitiv så att spelaren märker och stör sig på det. För att bryta denna upprepning så använder man sig utav något som heter dekaler. Detta är oftast en bild eller textur som gör att man kan dölja sin återanvändning genom att maskera den med bilden. Wolfire games går igenom detta mer grundligt i ett blogginlägg för den som är nyfiken (http://blog.wolfire.com/2009/06/how-to-project-decals/).

Nu när jag hade min grund del klar av häcken så gick jag över till att göra en slutdel av den. Detta eftersom den i detta stadiet hade ett tvärt slut som gjorde den onaturlig. Så då var det bara till att kopiera grundlagret och göra en offset på 256 pixlar i vertikal riktning. Då jag tyckte om min undre projektion mest så suddade jag ut den övre och fick således en ypperlig slutdel av häcken.

Eftersom jag har en modulär grund så är det bara till att flippa min sluthäck vertikalt så har jag ett slut på båda ändar.

Och så till sista delen av häcken så gjorde jag en hörna. Då tog jag kopierade jag min raka häck och roterade en av dem i 90 grader. Detta gjorde så att jag fick ett kors av min häck.

Då detta blev en väldigt onaturlig och påklistrad form så suddade jag ut den övre delen samt den vänstra så att det blev ett hörn.

Som ni ser så är det väldigt onaturlig och de båda lagren smälter inte in i varandra. Så i den sista delen så blandade jag samman lagren genom att lägga till och ta bort färg på vissa ställen.

Detta gjorde så att jag fick den naturliga formen som jag var ute efter från början. Och för att få hörnan att kunna smälta ihop med min raka häck så lade jag min raka häck under hörnlagret. Därefter så målade jag med ljus och mörk färg på hörnlagret så att de båda blandades samman.

Detta möjliggör fler alternativ för leveldesignern att skapa väggar på i spelet.

Allra sist så lade jag en hue/saturation lager så att jag snabbt och enkelt kan ändra färgen på vår häck. Detta är väldigt bra eftersom det kommer säkert att behövas ändra på till den slutgiltiga versionen av spelet.

Det var allt för mig.

Och lycka till!

P.S här är länken till penslarna som jag använder just nu (https://gumroad.com/l/XxMYJ)

Dev log II

Mole munch är vår tagning på hur man gör ett arkadigt mullvadsspel där du skall undvika fienden som studsar mot väggarna och plocka upp grönsakerna. Man kan vara under jord där man är halvt skyddad från mullvadsfångarna. Ifall de ser en jordhög som man lämnar efter sig så kommer dem att fylla den med vatten.

Jag har tyvärr tråkiga nyheter angående vår grafik till spelet… Eftersom vi grafiker blev lovade isometrisk utförande av spelet så har vi arbetat efter dessa premisser. Dock när det var dags att implementera grafiken till spelet så gick det inte för proggarna då dem inte kan göra spelet isometriskt. Detta har mycket med kollisionen att göra och vi är nu i ett vägskäl där vi antagligen får skrota det mesta som jag har gjort och gå över vad som kan återanvändas. Detta är oerhört irriterande, speciellt när vi inte har så mycket tid på oss, då vi borde ha haft en stabilare grund att stå på.

Då jag inte är säker på vad som behöver att göras om till spelet så kommer jag att denna vecka behandla en artefakt som påbörjades i början av veckan, ett isometrisk träd.

Då vår mullvad är i en villaträdgård så behövs det lite solida objekt som kan fungera som ett bryt i miljön. Då föll designen på att göra ett träd. Detta eftersom det är lätt att ta till sig och en naturlig del av en trädgårdsmiljö. Jag ville få till ett stort och vackert träd genom att använda mig av en stor och fin lövkrona. Detta eftersom det skulle inge mer liv och natur i spelet så att spelaren kunde känna att hon har en mer koppling till spelet i och med att det naturliga från livet återskapas till spelet.

För att göra ett solitt objekt till ett isometrisk spel så gäller det att planera upp arbetet utefter dess premisser. Därför skissade jag först upp hur stort och brett det skulle vara. Bredden på trädet föll på en stor kvadrat i form av 2×2 i rutantal.

Denna sketch gav mig en bra indikation på vad jag ska gå efter. Det vill säga trädets höjd och bredd. Själva utformningen och färgsättningen har inte kommit på tal än när detta steg gjordes. Den finns i baktanken men det är inget jag fokuserade på då utan det var mer för att se ifall allt fungerar perspektiv samt spelmässigt.

I steg två så gav jag trädet en snabb färgsättning för att indikera på var stammen respektive lövkronan stöter emot varandra. Detta var även en snabb ljussättning för trädet.

Nu kunde jag även experimentera lite mer med trädets form. Dock så var det inte så mycket jag gjorde utan det blev mer att jag utgick från grundbredd och grundhöjd.

I tredje steget så var det dags att göra trädet till ett träd. Alltså att få fram struktur, form, färg och ljus. Få det trovärdigt och vackert. När jag gick in i detta steget så arbeta jag med grå färg i olika valörer. Detta för att få ett djup.

Notera hur jag har använt mig av realistiska löv penslar för att få en fin form på min lövkrona. Detta för att snabbt och enkelt kunna se vad jag får, what you see is what you get. För att få lövkronan mer enhetlig med resten av spelet så använde jag mig av ett enkelt photshopfilter, pallete knife, något som har genomsyrat mina designval i min grafik. Djupet i trädet kommer fram ypperligt nu i och med att man har arbetat med ljusa och mörka valörer. Notera att jag har gjort stammen och lövkronan på två separata lager, detta för att enkelt kunna färgsätta var och en för sig.

I fjärde och sista steget så kom färgsättning samt att få trädet mer enhetligt med resten av grafiken. Då gick jag till väga att jag lade en hue/saturation layer på trädets stam samt på lövkronan.

  Jag har även lagt till gräs vid rötterna för att få trädet att smälta ihop med mitt gräs och göra det ett med naturen. Färgerna i denna bild är dock inte helt final utan det korrigeras efter speltestningar och dylikt.

Detta var en artefakt som jag tyckte väldigt mycket om att arbeta med. Trädets grova penseldrag gör att det känns ett med art stylen till spelet och jag är nöjd med utformningen av det.

Det var allt och lycka till!

Environment Art: Hedge

Mole Munch Dev log 1

Mole munch är ett spel där du spelar som en mullvad. Du ska undvika fienden och samla in grönsakerna. Du kan gräva dig under marken och på så sätt röra dig snabbare men ifall fienden kommer på dina tunnlar så fylls dem med vatten. Detta gör att spelet kräver strategiskt tänkande i olika situationer. Vi siktar mot ett arkadiskt spel där du känner att du får ett utmanande gameplay som är enkelt att ta till sig. Vår kameravy är isometrisk vilket har gett oss en intressant  utmaning i hur vi skall förmedla alla element i spelets ovan jord kontra under jord.

Denna veckas uppgift blir en lövhäck som kommer att agera vägg i spelet.  Jag åtog uppgiften för att jag tycker om nivådesign. Det är det som omger spelaren och det finns så mycket subtilt man kan väcka genom välarbetade nivåer.

Det jag började med var att jag gjorde en placeholder över häckens storlek. Detta gav mig en grund att bygga från.

 

Linjerna i placeholdern är raka med 23° vinkel. Färgernas mättnad förstärker kubens sidor vilket gör den tredimensionell.

 

 

 

 

 

När jag skulle gå vidare till att göra kuben till en häck så letade jag upp referensbilder över olika häckar, både i isometriskt perspektiv samt vanliga foton. Referensbilderna gav mig en bra överblick för hur en häck ter sig i verkligheten samt dess struktur. Det isometriska perspektivet gjorde att jag kunde se hur jag skulle arbeta med mättnad i färgerna.

Jag började med att göra en rak övergång från placeholdern till slutresultat.

Detta innebär att jag tog placeholderns sidor och gav dem en noise effekt. Detta gav häcken en väldigt enkel och rak struktur. Något som jag inte alls tyckte om då den inte gick ihop med den grafisk stil som vi vill ha till spelet. Detta gjorde att jag gjorde om den helt.

Då vi vill ha mer tecknad stil på vårt spel så gick jag till en specialgjord pensel i photoshop. Jag målade, med olika valörer, häckens struktur och fick ihop en bra grund. Dock så blev den inte rätt storleksmässigt samt att den var för ljus på sina ställen. Den vita färgen i häcken var för tydlig vilket gjorde att den kändes “orealistisk”.

 

Så det var bara till att börja om på en ny häck. I denna iteration så började jag med att måla med grå färg och sedan strukturera upp denna med mörkare och ljusare valörer. Detta gav häcken en finare struktur på den och den blev väldigt realistisk när jag lade en grön färg över den.

För att få den till en mer tecknad stil så använde jag photoshops palette knife filter på meshen vilket gjorde att strukturen blev mer utsmetad och detaljerna färre. Jag lade även till en framsida på häcken så att den skulle bli modulär och fungera så väl som enskild som i en grupp.

 

Och här är slutresultat med grupper samt enskild.