{"author_name":"jurnacsr","cat":"LD #28","comments":[],"epoch":1387144560,"likes":0,"metadata":{"p_key":"34914","p_author":"jurnacsr","p_authorkey":"16532","p_urlkey":"70466","p_title":"It Belongs In A Museum \u2013 Post-Mortem and Look Ahead","p_cat":"LD #28","p_event":"LD28","p_time":"1387144560","p_likes":"0","p_comments":"0","p_status":"UPD5","us_key":"16532","us_name":"jurnacsr","us_username":"jurnacsr","event_start":"1386892800","event_key":"20","event_name":"LD28"},"text":"

IT BELONGS IN A MUSEUM \u2013 Write-up<\/strong><\/a><\/p>\n

\"Screenshot\"<\/a>

A screenshot of gameplay. I knew it would be a good idea to use the names from Key and Peele’s East\/West Bowl sketch.<\/p><\/div>\n

For this LD 48-hour competition, with a theme of \u2018You Only Get One,\u2019 I have submitted \u2018It Belongs\u2019 in a Museum, a platforming game where you dig into the ground to find treasures.\u00a0 You can only take one of these treasures home with you, so you have to choose carefully which treasure you keep.\u00a0 You can read more about the game on its Competition Entry Page<\/a>, so here I will dive into the development process, content creation, and how I finished this game off.<\/p>\n

1. Development<\/strong><\/p>\n

I developed this game for the HTML5 canvas using the ImpactJS engine.\u00a0 I have been using the ImpactJS <\/a>engine for a year now \u2013 if you look back to LD24, I developed another game using ImpactJS, and every one since then.\u00a0 I am extremely happy with the engine \u2013 it allows me to get something working quickly so I can focus on content and mechanics instead of worrying about low-level game mechanics like collision detection and animation.<\/p>\n

\"Dev<\/a>

Developing configuration-driven ImpactJS code is easy to understand and implement.<\/p><\/div>\n

With the low-level stuff taken care of, I was able to implement a simply \u2018mining\u2019 system in my game, where you can dig out blocks of material to find the treasures contained inside.\u00a0 Instead of creating a new Entity for each block, I opted for a totally configuration-driven approach.\u00a0 When I created a block, I gave it an object containing its details, and the Entity rendered and behaved depending on that configuration.\u00a0 No more need for an EntityGravel, EntityStone, EntityObsidian \u2013 only EntityBlock with carrying configurations.<\/p>\n

I took the same approach with enemies.\u00a0 There are 4 types of enemies, and each one has slightly different behavior and animations.\u00a0 That still wasn\u2019t a problem, and I used the same configuration-driven approach as the Blocks.\u00a0 I implemented different branches of logic for each hostile enemy, and was able to implement different animations based on the configuration as well.<\/p>\n

HTML5 development, regardless of engine, is my preferred way of game development today.\u00a0 It is much easier to understand and set up than a more traditional development environment, like Java.\u00a0 I have XAMPP set up, so creating a new game is as easy as copying a folder, and opening a web browser.<\/p>\n

2. Content Creation – Graphics<\/strong><\/p>\n

Art is hard \u2013 look back at the other games I\u2019ve created and you\u2019ll see that the artwork is lacking, to put it mildly.\u00a0 For this game I was determined to simplify the art, using simple square shapes and finding help where I could.\u00a0 I made a small breakthrough Sunday morning around 4am, when I decided to test out the Effects menu in Paint.Net<\/a>, and found the utility of the Noise feature.\u00a0 Holy shit, it opened every single door to me.\u00a0 All of the blocks and the BGs are done in largely solid colors with large shapes, but applying the Noise effect adds randomness.\u00a0 Dirt looks like dirt, sand like sand, and so on.\u00a0 It also helped with the large BG images, creating variance in the skies, and making some nice starry night backgrounds.\u00a0 I also took advantage of the Gaussian Blur effect to blur the background, making it easier for players to distinguish foreground from background.\u00a0 The effect makes the game look more professional, and more playable.<\/p>\n

\"Dev<\/a>

Character animation is easier when you use large shapes, scale up to cover up mistakes, and copy-paste where you can.<\/p><\/div>\n

For the player sprite, simple squares were used everywhere.\u00a0 Squares were used for the shoulders, head, legs, and arms.\u00a0 For animation, I copied and pasted where I could, to produce the animation quicker and look better than what I usually produce.\u00a0 You\u2019d be amazed at how good a square with rounded edges works in any situation.<\/p>\n

3. Content Creation \u2013 Music<\/strong><\/p>\n

Music is also hard, but there are tools to make it even easier.\u00a0 I generated the music using autotracker.py<\/a> ( see THIS entry from my LD blog on how to set up autotracker \u2013 worth it!).\u00a0 The music that gets generated is nice, often catchy, and is a \u201916-bit\u2019 type of sound that I really enjoy.\u00a0 ImpactJS has easy-to-use music and sound features, so I only needed to load a music object and call a .play() method.\u00a0 Simple.\u00a0 Sound effects were generated using BFXR<\/a>, another tool with a \u201916-bit\u2019 sound.<\/p>\n

Originally I wanted to play my own music, and have been practicing for a few days, but there just isn\u2019t enough time.\u00a0 I had some melodies and tunes, as well as creative sound effects, but that was a no-go.\u00a0 Not only is there not enough time, but my recording equipment is garbage.\u00a0 All I have is the mic on my laptop, and recording any sounds \u2013 with my piano or voice, anything recorded wasn\u2019t worth it.\u00a0 It would also have been very difficult to process those recordings even if they turned out good.<\/p>\n

The audio work exposes one of the biggest problems with HTML5 \u2013 audio support.\u00a0 On a personal note, I have no freaking clue why some browsers support OGG, some support MP3, some support other formats \u2013 but not support all.\u00a0 It\u2019s a bit of a crap-shoot as to which audio works \u2013 luckily ImpactJS has tools for that.\u00a0 Loading an audio file uses a path to the file \u2013 \u2018media\/sounds\/hit1.ogg\u2019, but you can use \u2018media\/sounds\/hit1.*\u2019 to tell impact to use whichever audio version works for your browser.\u00a0 Another way ImpactJS makes development easy.<\/p>\n

\"Dev<\/a>

Using Audacity to chop your sounds up makes it easy to find the effects and music you want.<\/p><\/div>\n

Once I had raw audio files for effects and music, I used Audacity <\/a>to process and convert the audio.\u00a0 I cut some of the BFXR effects to simulate a snake and bug sound and messed with volume levels here and there.\u00a0 Simple.\u00a0 Converting is a clicky-clicky pain in the ass, but it is an easy process.<\/p>\n

4. Putting It All Together<\/strong><\/p>\n

I have learned a lot about game development in my year and a half of LD Competitions.\u00a0 You can look back to my original game (though you probably shouldn\u2019t) and see a near-total lack of understand as to the most basic elements \u2013 FPS, collision detection, input \u2013 but I look at what I do now and I feel quite proud.\u00a0 I have come a long way as a programmer and game developer \u2013 my only wish is that I knew what I know now 10 years ago when I started college.\u00a0 It may have only taken 4 years instead of 6!<\/p>\n

There is still a very long way to go, though. \u00a0These weekends are hellacious on my body and sleep schedule, and I often get single digits of sleep over two nights.\u00a0 Come Sunday and Monday I am a husk of a man, barely able to watch my beloved Carolina Panthers on Sunday.\u00a0 This time management is an area I have been working on, and continue to work on.\u00a0 This time, I did much more initial documentation, leaving little to none of my game up to chance or \u2018Play it by ear\u2019-ness.\u00a0 Start to finish, I had the game idea, flow, and mechanics documented.\u00a0 I even had most of the text worked out ahead of time.\u00a0 When development started it was code code code \u2013 no wasting time on wondering what to do next.<\/p>\n

Like you dad used to say, let the tool do the work!\u00a0 Use resources like BFXR and autotracker.py to generate content for your game.\u00a0 They generate great effects extremely quickly, leaving you to concentrate on more necessary tasks.\u00a0 Experiment with those tools as well \u2013 discovering the Noise and Gaussian Blur saved me a hell of a lot of time and made my end product look so much better.\u00a0 Use these tools, poke around with them, and find out what they can do!<\/p>\n

5.That\u2019s A Wrap!<\/strong><\/p>\n

So brings to end another LD competition.\u00a0 I have no complaints this time around \u2013 sometimes I bitch about the theme or my time management, but not today.\u00a0 I was able to produce a full product \u2013 a Video Game with a start and an ending \u2013 kind of, but that\u2019s intended.\u00a0 I encourage you to play IT BELINGS IN A MUSEUM, leave your feedback, and help me become a better game developer. \u00a0Play the game here!<\/a><\/p>\n

Maybe someday instead of feedback, you\u2019ll leave your money!<\/p>\n

\"screenshot2\"<\/a>\"screenshot3\"<\/a>\"screenshot4\"<\/a><\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>\n

 <\/p>","time":"December 15th, 2013 4:56 pm","title":"It Belongs In A Museum \u2013 Post-Mortem and Look Ahead"}