
<article class="article article-detail">
<content class="article__content">
<div class="article__snippets">
<div class="rs-snippet rs-snippet__html" id="e13e7bc9-5000-419a-a55d-fc9ef92e6dc5"><p>We zijn er weer! Welkom bij deel zes van deze serial. We gaan weer verder waar we de vorige keer gebleven waren, dus check vooral de vorige delen (<a href="https://pu.nl/artikelen/feature/punl-bouwt-een-top-down-shooter-deel-1/" target="_blank">1</a>, <a href="https://pu.nl/artikelen/feature/punl-bouwt-een-top-down-shooter-deel-2/" target="_blank">2</a>, <a href="https://pu.nl/artikelen/feature/punl-bouwt-een-top-down-shooter-deel-3/" target="_blank">3</a>, <a href="https://pu.nl/artikelen/feature/punl-bouwt-een-top-down-shooter-deel-4/" target="_blank">4</a>, <a href="https://pu.nl/artikelen/feature/punl-bouwt-een-top-down-shooter-deel-5/" target="_blank">5</a>) voordat je deze leest! In deze editie van pu.nl bouwt een Top Down Shooter maak ik een logo en een introscherm, voegen we supervette muziek toe, maken we wat toffe muntjes en gaan we aan de slag met de allereerste eindbaas. Het is een flinke vandaag dus, hou je vast!</p><h3>Pickup Polls</h3><p>Laten we beginnen met de polls. Ik vroeg jullie vorige maand hoe jullie het liefst zouden zien dat HP en Ammo gaan functioneren in de game. Met bijna 200 stemmen gingen alle opties voor HP nog best gelijk op: 45% heeft het liefste pickups, terwijl 32% de HP wil laten herstellen door het maken van kills en 24% het liefst altijd regenerating HP heeft als je niet onder schot staat. We zullen HP dan maar niet automatisch laten generaten, maar wel enemies een kleine kans geven om een HP pickup achter te laten als ze dood zijn. Ook plaatsen we ze door het level.<br/><br/>Bij ammo was pickups de duidelijke winnaar, met maarliefst 63%. Niet veel mensen voelden wat voor wapens met een cooldown of ammo kopen bij de shop. Als laatste hadden we dan de titel, waar Powerkid's Quest: Clone Chaos won met maarliefst 65 procent van alle stemmen. Laten we daar dan maar gelijk mee aan de slag gaan!</p><h3>Powerkid's Quest: Clone Chaos</h3><p>Da's een flinke mond vol. Eens zien of we wat leuks kunnen doen met het logo.<br/><br/><br/>Ik bereken eerst hoeveel pixels ik ongeveer heb voor de letters en verdeel zo de ruimte. Het leek me leuk om er een stuk van Power Unlimited's eigen logo in te verwerken, dus maak ik het lettertype van de PU na in pixel-vorm.<br/><br/><br/>De subtitel is wat simpeler, maar staat goed bij de titel. Het is alleen wel wat kaal zo, dus misschien moet ik nog wat decoratie toevoegen...<br/><br/><br/>Aangezien de game gaat over gekloonde redacteurs, leek me een DNA patroontje wel gepast. Nu alles even op elkaar plakken:<br/><br/><br/><br/>Niet slecht, al zeg ik het zelf:)</p><h3>Charmante Chiptunes</h3><p>In het vorige deel vroeg ik of er iemand ervaring had met het maken van muziek - ja dus! Mark van Rijswijk kwam gelijk naar voren met een ontiegelijk lekkere track, die mij gelijk weer inspiratie gaf voor een introscherm. Luister maar:<br/><br/><iframe allow="autoplay" frameborder="no" height="166" scrolling="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/546217383&amp;color=%23ff5500&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;show_teaser=true" style="display: block; margin-left: auto; margin-right: auto;" width="100%"></iframe><br/>Naast de Theme Song heeft hij nog een aantal andere deuntjes gemaakt, voor onder andere bossfights en de shop, <a href="https://soundcloud.com/user-526609877/sets/power-unlimited-indie-game" target="_blank">check die hier</a>!<br/><br/>Gelijk door naar die intro dus. Een logo hadden we al, maar voor een complete intro hebben we ook een achtergrondje nodig. Ik heb een landschap in mijn hoofd waar Powerkid vrolijk doorheen rent terwijl de achtergrond voorbij scrollt.<br/><br/><br/>Ok dan, alle onderdelen zijn gereed! Ik schroef alles in de engine in elkaar en start de game zesduizend keer opnieuw op om de snelheid te tweaken en ervoor te zorgen dat de timing perfect is. Ik denk dat dit het vetste is wat we tot nu toe hebben gedaan in deze serial:<br/><br/><iframe allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" frameborder="0" height="370" src="https://www.youtube.com/embed/JofcTmBL-_o" style="display: block; margin-left: auto; margin-right: auto;" width="608"></iframe></p><h3>Cash money</h3><p>Maar genoeg over die intro! Vorige editie vroeg ook om suggesties voor pickups - en hoewel ik van plan was overal een poll van te maken zag toen zo'n vet idee in de comments dat ik er gelijk mee aan de slag ging.<br/><br/><br/>Oude gamecartridges! Heel gepast als de shopkeeper een echte collector is. N64 games zijn 1 waard, SNES 5 en NES games maarliefst 10. Wel zo leuk als ze dan ook een beetje bewegen...<br/><br/><br/>Laten we het gelijk even testen op wat vijanden!<br/><br/></p><h3>Epische Eindbaas</h3><p>Toen ik jullie vroeg om enemy designs werd één ding al snel duidelijk: jullie willen virtueel op de vuist met de redactie. Natuurlijk kunnen we ze niet zomaar normale vijanden laten spelen, dus gaan we er (mini)bossfights van maken! Ik ga dus mijn best doen om zo veel mogelijk redactieleden te pakken te krijgen en ze zélf hun bossfight te laten designen.<br/><br/>Dit zijn alleen wel extreem tijdrovende taken - bossfights zijn zo ongeveer het lastigste wat je in je game kunt stopen door de hoeveelheid sprites, animatie en AI er nodig is. We maken nu dan ook nog maar een beginnetje aan de eerste boss - we gaan wat sprites bouwen van de keyframes van de door de redacteur bedachte aanvallen. Dat betekent dus 1 of 2 plaatjes van de belangrijkste posities in de aanvalanimatie, zodat we nu de timing kunnen testen en dan later de rest aanvullen met echte animatie.<br/><br/>Het leek me passend om de man die mij bij de PU naar binnen heeft weten te praten als eerste onder handen te nemen...<br/><br/><strong>Graddus! Thanks dat je mijn proefkonijn wilt zijn voor deze eerste bossfight!</strong><br/>Geen probleem! Ik help je graag om van een leuke top-down shooter potentieel GotY-materiaal te maken :-)<br/><br/><strong>Laten we als eerste gaan kijken hoe je eruit gaat zien. Heb je een selfietje voor me?</strong></p><p><br/><strong>Thanks! En wat voor outfit moet je pixelige doppelganger gaan dragen?</strong><br/>Doe maar een kleurrijke hipstertrui en een skinny-jeans. Het belangrijkste is echter dat mijn haar goed zit!<br/><br/><strong>Natuurlijk, het is sowieso lastig om iemand te herkennen in zo'n klein pixel poppetje, maar je perfect gekamde coupe moet daar wel bij gaan helpen.</strong><br/><br/><br/><strong>Ik pak er even voor het gemak een bestaand poppetje bij voor het hoofd en geef hem een strak gekamd kapsel. Bosses zijn natuurlijk vaak een tikje groter dan de gemiddelde enemy, dus ik maak de rest van het lichaam twee keer zo groot. Close enough!</strong><br/><br/><strong>Net zo belangrijk is natuurlijk je moveset. Bedenk op zijn minst twee close range en twee long range aanvallen - één zwakke/snelle en sterke/langzame per stuk.</strong><br/>Close range zwak/snel: De wansmaak-smack - ik probeer de speler te slaan met een enorm doosje van een willekeurige kutgame, zoals Dead Island of Risen.<br/><br/><br/><strong>Okee, helder! Ik pak de sprite die ik al gemaakt had en laat hem zijn armen in de luch strekken. Ik maak het voor nu even een generiek, groen doosje, daar kunnen we later wel wat leuke slappe titels op plakken. Even kijken of dit een beetje werkt...</strong><br/><br/><br/><strong>Whoops, misschien een idee om de timing wat aan te passen, want dit ziet er niet gezond uit...</strong><br/><br/><br/><strong>Beter! Het is natuurlijk nog steeds wel heel abrupt van frame 1 naar 2, maar daar gaan we in het volgende deel weer mee verder. Anyway, wat was je andere close range aanval?</strong><br/>Close range langzaam/sterk: Ik trap de speler als een echte profvoetballer. <br/><br/><br/><strong>Lekker simpel, daar hou ik van. Ik maak er een trapbeweging van en maak gelijk je been 3x zo groot. Dat ziet er als het nu zo stil staat misschien wel een beetje vreemd uit, maar werkt stukken beter als je er daadwerkelijk een animatie van hebt. What's next?</strong><br/>Long range zwak/snel: Ik haal een kam door mijn haar als Guile uit Street Fighter, gooi deze naar de speler en krijg 'em als een boemerang weer terug.<br/><br/><br/><strong>Geinig idee! Volgens mij is dit ongeveer de pose die je aanneemt als je je haar aan het kammen bent, niet? De kam die je gooit wordt natuurlijk een losse sprite, dus die zit er hier niet bij. Wat was je laatste idee?</strong><br/>Long range langzaam/sterk: Toen ik stage liep bij PU was er een fabeltje dat ik altijd naast de pot piste. Om voor eens en altijd de wereld uit de helpen dat ik niet gericht kan zeiken, is mijn heavy long range attack een straal dodelijke pis.<br/><br/><br/><strong>Heh, daar kunen we wel wat mee. Hier hoeven we ook maar 1 plaatje voor te hebben, als we de fight daadwerkelijk gaan bouwen kunnen we een rits-geluidje afspelen om de speler te waarschuwen dat hij weg moet wezen.</strong><br/><br/>Thanks Graddus, dat was hem dan voor nu. Volgende keer gaan we verder! Ik had alleen beloofd dat ik deze editie wel een speelbaar level zou hebben met een eindbaas, dus ik gooi er even snel een sprite van Graddus in met een shitload aan HP die alleen maar op je af rent en schade doet als hij je aanraakt.<br/><br/><br/>Dat werkt in ieder geval. Misschien ook leuk om hem een hele zooi coins te laten droppen als je hem te grazen hebt genomen!<br/><br/></p><h3>Stemmen!</h3><p>Nog even een snelle poll, er was vorige maand maar één persoon die wat suggesties had voor de HP pickups:<br/><br/><em>"Als health pickups een baklap of de bekende slagroomtaart :)"</em><br/><strong> - Scythe</strong><br/><br/>Allebei leuk. Stemmen maar!</p><div id="qp_all2214228" style="width: 100%; max-width: 608px;"><link href="//fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet" type="text/css"/><div fp="70974958-63" id="qp_main2214228" results="0" style="border-radius: 0px; margin: 0 auto; padding: 0.8em; background-color: #fff; font-family: 'Open Sans', sans-serif, Arial; color: #000; border: 1px solid #DBD9D9; max-width: 815px; box-sizing: border-box; text-align: left;"><div style="font-size: 1em; background-color: #00355f; color: #fff; font-family: 'Open Sans', sans-serif, Arial;"><div style="padding: 0.8em; line-height: 1.3em;">Wat voor HP pickups gaan we doen?</div></div><form action="//www.poll-maker.com/results2214228x70974958-63" id="qp_form2214228" method="post" sel="0" style="display: inline; margin: 0px; padding: 0px;" target="_blank"><div style="padding: 0px;"><input name="qp_d2214228" type="hidden" value="43478.2344328785-43478.2344712844"/><div class="qp_a" onclick="var c=this.getElementsByTagName('INPUT')[0]; if((!event.target?event.srcElement:event.target).tagName!='INPUT'){c.checked=(c.type=='radio'?true:!c.checked)};var i=this.parentNode.parentNode.parentNode.getElementsByTagName('INPUT');for(var k=0;k!=i.length;k=k+1){i[k].parentNode.parentNode.setAttribute('sel',i[k].checked?1:0)}" sel="1" style="display: block; color: #6b6b6b; font-family: 'Open Sans', sans-serif, Arial; font-size: 1em; line-height: 1.5; padding: 13px 8px 11px; margin: 10px 0px; clear: both;"><span style="display: block; padding-left: 30px; cursor: inherit;"><input name="qp_v2214228" style="float: left; width: 20px; margin-left: -25px; margin-top: 2px; padding: 0px; height: 20px; -webkit-appearance: radio;" type="radio" value="1"/>Baklap!</span></div><div class="qp_a" onclick="var c=this.getElementsByTagName('INPUT')[0]; if((!event.target?event.srcElement:event.target).tagName!='INPUT'){c.checked=(c.type=='radio'?true:!c.checked)};var i=this.parentNode.parentNode.parentNode.getElementsByTagName('INPUT');for(var k=0;k!=i.length;k=k+1){i[k].parentNode.parentNode.setAttribute('sel',i[k].checked?1:0)}" sel="0" style="display: block; color: #6b6b6b; font-family: 'Open Sans', sans-serif, Arial; font-size: 1em; line-height: 1.5; padding: 13px 8px 11px; margin: 10px 0px; clear: both;"><span style="display: block; padding-left: 30px; cursor: inherit;"><input name="qp_v2214228" style="float: left; width: 20px; margin-left: -25px; margin-top: 2px; padding: 0px; height: 20px; -webkit-appearance: radio;" type="radio" value="2"/>Slagroomtaart!</span></div><div class="qp_a" onclick="var c=this.getElementsByTagName('INPUT')[0]; if((!event.target?event.srcElement:event.target).tagName!='INPUT'){c.checked=(c.type=='radio'?true:!c.checked)};var i=this.parentNode.parentNode.parentNode.getElementsByTagName('INPUT');for(var k=0;k!=i.length;k=k+1){i[k].parentNode.parentNode.setAttribute('sel',i[k].checked?1:0)}" sel="0" style="display: block; color: #6b6b6b; font-family: 'Open Sans', sans-serif, Arial; font-size: 1em; line-height: 1.5; padding: 13px 8px 11px; margin: 10px 0px; clear: both;"><span style="display: block; padding-left: 30px; cursor: inherit;"><input name="qp_v2214228" style="float: left; width: 20px; margin-left: -25px; margin-top: 2px; padding: 0px; height: 20px; -webkit-appearance: radio;" type="radio" value="3"/>Allebei!</span></div></div><div sel="0" style="padding-left: 0px; clear: both; text-align: left; margin: 1em auto;"><a class="qp_btna" href="#" style="display: inline-block; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; padding-right: 5px; text-decoration: none;"><input btype="v" name="qp_b2214228" style="min-width: 7.8em; padding: 0.5em; background-color: #0b79d3; font-family: 'Open Sans', sans-serif, Arial; font-size: 16px; color: #fff; cursor: hand; border: 0px; -webkit-appearance: none; border-radius: 0px;" type="submit" value="Vote"/></a><a class="qp_btna" href="#" style="display: inline-block; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; padding-left: 5px; text-decoration: none;"><input btype="r" name="qp_b2214228" style="min-width: 7.8em; padding: 0.5em; background-color: #0b79d3; font-family: 'Open Sans', sans-serif, Arial; font-size: 16px; color: #fff; cursor: hand; border: 0px; -webkit-appearance: none; border-radius: 0px;" type="submit" value="Results"/></a></div></form><div style="display: none;"><div id="qp_rp2214228" style="font-size: 14px; width: 5ex; text-align: right; overflow: hidden; position: absolute; right: 5px; height: 1.5em; line-height: 1.5em;"></div><div id="qp_rv2214228" style="font-size: 14px; line-height: 1.5em; width: 0%; text-align: right; color: #fff; box-sizing: border-box; padding-right: 3px;"></div><div id="qp_rb2214228" style="font-size: 14px; line-height: 1.5em; color: #ffffff; display: block; padding-right: 10px 5px;"></div><div id="qp_rva2214228" style="background: #006FB9; border-color: #006FB9;"></div><div id="qp_rvb2214228" style="background: #163463; border-color: #163463;"></div><div id="qp_rvc2214228" style="background: #5BCFFC; border-color: #1481AB;"></div></div></div><div style="text-align: center; margin: 5px;"></div></div><h3>The End</h3><p>Dat was 'm dan wel weer voor deze maand! Als je het spelletje in zijn huidige staat een keer uit wilt proberen, <a href="https://we.tl/t-441c6XfTYT" target="_blank">download hem dan hier</a>! Wees er wel snel bij, want WeTransfer werkt maar een weekje. Volgende maand gaan we verder met de bossfight en ga ik eindelijk wat doen aan die lelijke bruine achtergrond. Dat heb ik de afgelopen twee keer ook gezegd, maar nu meen ik het! Dus gooi je suggesties voor locaties en achtergronden in de comments.<br/><br/>Entropy bood vorige maand ook al aan om zelf een spritesheet te maken, dus als er iemand zin heeft om zelf de handjes vuil te maken, bedenk wat leuks! De tiles moeten op een 16x16 pixel grid passen. Ook kan je nog steeds ideeën aandragen voor nieuwe vijanden of wapens. Tot volgende maand!<br/><br/></p><h3>Alle delen in de pu.nl bouwt een top down shooter serial:</h3><p><strong>Zaterdag 25 Augustus</strong> – <a href="https://pu.nl/artikelen/feature/punl-bouwt-een-top-down-shooter-deel-1/" target="_blank">Deel 1</a><br/><strong>Zondag 23 September</strong> – <a href="https://pu.nl/artikelen/feature/punl-bouwt-een-top-down-shooter-deel-2/" target="_blank">Deel 2</a><br/><strong>Zaterdag 20 Oktober</strong> – <a href="https://pu.nl/artikelen/feature/punl-bouwt-een-top-down-shooter-deel-3/" target="_blank">Deel 3</a><br/><strong>Zaterdag 17 November</strong> – <a href="https://pu.nl/artikelen/feature/punl-bouwt-een-top-down-shooter-deel-4/" target="_blank">Deel 4</a><br/><strong>Zaterdag 17 December</strong> – <a href="https://pu.nl/artikelen/feature/punl-bouwt-een-top-down-shooter-deel-5/" target="_blank">Deel 5</a></p></div>
</div>
</content>
</article>


PU.nl bouwt een Top Down Shooter – Deel 6

Opmerkingen

Gerelateerde artikelen

Contact

Handige links