• Log InLog In
  • Register
Liquid`
Team Liquid Liquipedia
EDT 18:47
CEST 00:47
KST 07:47
  • Home
  • Forum
  • Calendar
  • Streams
  • Liquipedia
  • Features
  • Store
  • EPT
  • TL+
  • StarCraft 2
  • Brood War
  • Smash
  • Heroes
  • Counter-Strike
  • Overwatch
  • Liquibet
  • Fantasy StarCraft
  • TLPD
  • StarCraft 2
  • Brood War
  • Blogs
Forum Sidebar
Events/Features
News
Featured News
BGE Stara Zagora 2025: Info & Preview19Code S RO12 Preview: GuMiho, Bunny, SHIN, ByuN3The Memories We Share - Facing the Final(?) GSL46Code S RO12 Preview: Cure, Zoun, Solar, Creator4[ASL19] Finals Preview: Daunting Task30
Community News
[BSL20] ProLeague: Bracket Stage & Dates6GSL Ro4 and Finals moved to Sunday June 15th12Weekly Cups (May 27-June 1): ByuN goes back-to-back0EWC 2025 Regional Qualifier Results26Code S RO12 Results + RO8 Groups (2025 Season 2)3
StarCraft 2
General
BGE Stara Zagora 2025: Info & Preview Jim claims he and Firefly were involved in match-fixing GSL Ro4 and Finals moved to Sunday June 15th Magnus Carlsen and Fabi review Clem's chess game. Serious Question: Mech
Tourneys
Bellum Gens Elite: Stara Zagora 2025 SOOPer7s Showmatches 2025 Cheeseadelphia 2025 - Open Bracket LAN! $25,000+ WardiTV 2025 Series Sparkling Tuna Cup - Weekly Open Tournament
Strategy
[G] Darkgrid Layout Simple Questions Simple Answers [G] PvT Cheese: 13 Gate Proxy Robo
Custom Maps
[UMS] Zillion Zerglings
External Content
Mutation # 476 Charnel House Mutation # 475 Hard Target Mutation # 474 Futile Resistance Mutation # 473 Cold is the Void
Brood War
General
[BSL20] ProLeague: Bracket Stage & Dates BW General Discussion Will foreigners ever be able to challenge Koreans? BGH auto balance -> http://bghmmr.eu/ I made an ASL quiz
Tourneys
[BSL 2v2] ProLeague Season 3 - Friday 21:00 CET [ASL19] Grand Finals [Megathread] Daily Proleagues Small VOD Thread 2.0
Strategy
I am doing this better than progamers do. [G] How to get started on ladder as a new Z player
Other Games
General Games
Nintendo Switch Thread Mechabellum Stormgate/Frost Giant Megathread Monster Hunter Wilds Path of Exile
Dota 2
Official 'what is Dota anymore' discussion
League of Legends
LiquidLegends to reintegrate into TL.net
Heroes of the Storm
Heroes of the Storm 2.0 Simple Questions, Simple Answers
Hearthstone
Heroes of StarCraft mini-set
TL Mafia
Vanilla Mini Mafia TL Mafia Community Thread
Community
General
US Politics Mega-thread Russo-Ukrainian War Thread Things Aren’t Peaceful in Palestine Vape Nation Thread European Politico-economics QA Mega-thread
Fan Clubs
Maru Fan Club Serral Fan Club
Media & Entertainment
Korean Music Discussion [Manga] One Piece
Sports
2024 - 2025 Football Thread Formula 1 Discussion NHL Playoffs 2024
World Cup 2022
Tech Support
Computer Build, Upgrade & Buying Resource Thread Cleaning My Mechanical Keyboard
TL Community
The Automated Ban List
Blogs
Heero Yuy & the Tax…
KrillinFromwales
Research study on team perfo…
TrAiDoS
I was completely wrong ab…
jameswatts
Need Your Help/Advice
Glider
Trip to the Zoo
micronesia
Poker
Nebuchad
Info SLEgma_12
SLEgma_12
Customize Sidebar...

Website Feedback

Closed Threads



Active: 19071 users

Adventures in Game Programming

Blogs > Logo
Post a Reply
Logo
Profile Blog Joined April 2010
United States7542 Posts
Last Edited: 2013-01-03 06:55:08
January 03 2013 06:52 GMT
#1
Inspired by the great video game primer written by Cecil I thought I'd share some of my experiences with hobbyist game programming. This isn't an instructional manual on how to program games or a large project, but hopefully it will give some insight. This first entry may be a little dry as I introduce what I'm going to be working on, if so you have my apologies. In terms of technical know-how this blog is going to assume you understand some basic programming techniques now and then, but even if you don't you should still be able to follow along.

Introduction

So first things first, who am I and what are my qualifications? Well, I'm a programmer (not a progamer), but not one in the game's industry. I've been programming side project games on and off for quite a while now and have really started to invest a fair bit of time into it. With my most recent project I thought it might be fun to also talk about different aspects of what I'm working on.

I hope to write a few blogs in this series and in each entry I want to dig into a different aspect of my game and all the little tricks and tips I've used to make it play well. I am by no means an expert, nor do I mean to imply things I say are the only way to do things, it's simply the way I've picked and why.

Choosing the Right Project


The game I'm going to be talking about was intentionally kept very straightforward and very small in scope. As anyone who's started a programming project will tell you, your biggest enemy is aiming too high. In this case I've decided to make a retro platformer in the style of Castlevania and Ghost & Goblins. Sure platformers are a dime a dozen, but I'm OK with that; I'm making it for myself, not to become the next Notch or Pixel. Given that I have my full time job and art takes me an extremely long amount of time to product (more on that later), I thought a simpler project that I can finish in a reasonable amount of time would be great.

It's amazingly easy to take simple ideas and get them bogged down in that one hard part everything relies on. Even worse, with more experimental game ideas you can easily get stuck with a prototype that just isn't fun.

[image loading]
A pretty far along prototype. I really like the setup for this game, but I had trouble designing content and explaining the concept to people. Essentially it's a game about time travel where the player character travels back in time, but you go through everything in chronological order. It is functional, but it doesn't have anything that really makes it stick as a game. Art is placeholder art from Biolab disaster


Even if the game is fun, you can really get stuck on implementation details, the simpler you can keep your first few projects, the better off you are going to be. Platformers are great in this regard. Your enemy AI is going to be very simplistic, you often don't even need a true pathfinding algorithm, and you can get by with much simpler collision detection. Don't mistake that for thinking platformers are simplistic or straightforward, there's a world of difference between Bubsy and games like Super Meat Boy.


[image loading]
This is another prototype I really like. A tactical battle RPG type thing. The concept sounds simple, but a tactical RPG demands strong AI which started to become a huge time sink. I decided with this one to shelve it for the time being. Plus I need to go back and implement fog of war to make the game fun. It does have a nice A* implemented I may talk about at some point.


The Tech

So now that I've decided on my project, the next step is deciding what tech to use. Normally this is where you may debate the differences between C++, C#/XNA, or countless other languages, but my case is different. I've been working a lot lately with a nice HTML5 engine called ImpactJS, so I'll be using that. Javascript isn't really a language I'd recommend to new programmers, nor would I say it's a particularly good environment for game development. The reason I choose it is simple: my work has recently required me to start doing some javascript programming and I wanted to get more comfortable with it. In that respect ImpactJS has been great for me, it has taken some of the load off what I need to program for my game, and I feel very comfortable in javascript now.

When you use a pre-built engine its functionality can range from incredibly basic to pretty robust. In the case of ImpactJS I get quite a lot, it has a built in level editor, collision detection algorithms, decent animation & font support, asset management, input handling, and a structured game loop that I can just plug into. The engine also exposes object oriented functionality and module support for javascript which is handy. It's far from perfect, and as you'll see using such a robust system can have a lot of limitations, but it works and that's what matters. There is also one kicker that makes me feel good about using it: being javascript the code is exposed for modification.

So now that I have my engine it's time to get started...

Screens & Overlays


Right out of the gate I decide to tackle the issue of screens first. A lot of the time this is something you may put off until after having a working prototype, but in this case I know I'm going full steam ahead so there's no sense in delaying it. In cases where I do try to tackle the issue later on, it's much more of a pain to retrofit than to do it up front.

So what is the screen problem? Well quite simply, the highest level state machine for my system. Pretty much every game is going to have at least two states: the menu/start screen and the game screen. Being able to switch between the different screens without issue isn't terribly difficult, but I do need to have something there.

For my simple platformer I can break the screens down into the following short list:

  • Starting Menu Screen
  • Option Menu Screen
  • Game Screen
  • Credits/Ending Screen


Next I come up with what I need the screens to do:
  • Render
  • Run logic/frame (update)
  • Initialize the screen
  • Uninitialize the screen to remove key bindings and such.
  • Animate transitions between screens.


I punt on that last one for now. With such a limited # of transitions I don't need a system in place for transition animations, I can handle that on a case by case basis.

So now it's time to hash out a quick interface that's going to give me what I need. Being javascript, I don't formalize it as an interface, there's not enough logic for that to be necessary. A simple set of functions for each implemented screen will do: initialize, destroy, draw, and update. Each screen initializes the key bindings it needs in initialize, removes them in destroy, and uses draw & update to render the screen and update its state. I add a global method to allow screens to tell the system to load another screen. It's not an idealistic architecture, but it's functional and gets the job done.

The next step is implementing what I call overlays. In this case my overlays are going to be the pause menu and any other information that appears over a screen rather than as a screen. Overlays are very compact as well, they have an identical interface to a screen with one notable difference. Instead of using a global function to close itself, I take advantage of one of the best parts of javascript: functions are treated like objects. That means the object creating the overlay can pass the overlay the function to close itself. No need for a more complicated event handling system or other mechanism. When the overlay is ready to be closed it just calls its own function and it's all taken care of.

[image loading]
Here you can see the game screen with an overlay indicating that the player has died and the can restart. You might thing the sprite died from an enemy, but it's really just from embarrassment over how he looks.


Now that I've whipped up my starting screens and overlays I'm ready to focus almost exclusively on the game itself. At this point my structure is as follows:

  • A main game loop provided by the engine.
  • A menu screen with options for New Game, Continue (not functional), and Option Menu
  • An option menu with options for volume control.
  • A game screen.
  • A menu overlay for the game screen with support for pausing the game.
  • A death notification for the game screen with support for retrying. I won't be using lives for this game.


Conclusion (for now)

Not bad for the first few hours of programming. As you may guess by the last screenshot, I have a little more done at this point, but I'm going to end this blog here. Next time I hope to get into the camera as well as some basic enemy stuff like how I made my "medusa heads".

If you've read this far, thank you! I know menus and overlays aren't the most exciting part of game development, nor was this description particularly involved, but I wanted to get it out of the way first. Next time I will be providing more code examples and specific algorithms. If you are so inclined I'd appreciated any feedback on how to improve this blog or topics you'd like to hear about.

*****
Logo
memcpy
Profile Blog Joined April 2010
United States459 Posts
January 03 2013 09:17 GMT
#2
Great approach. Start small, prototype quickly, move on from there. If you come up with anything interesting you should consider posting it for early playtesting. Good luck!
Chezus
Profile Joined January 2011
Netherlands427 Posts
January 03 2013 15:22 GMT
#3
I love reading blogs like this... Hobbyist projects are the best. I'm currently in my second year as a Game Technology student, and I've noticed that projects that I'm "forced" to work on, I enjoy far less. I don't know, I guess there's just something liberating about them.
If you require some game design feedback, let me know. I'd love to playtest some time.

Right, enough procrastinating, back to work I guess. Gl hf with your project!
Logo
Profile Blog Joined April 2010
United States7542 Posts
Last Edited: 2013-01-04 21:06:50
January 04 2013 21:05 GMT
#4
Thanks guys! I hope to get something up for people to play around with as soon as I can. A lot of that is going to depend on how well I get through the art. For a lot of games you can get away with crappy art, but for a platformer it's really important to have good kinaesthetics at the very least. So until I nail down things like the walking animation the game just won't 'feel' fun, but that's a topic for another blog!
Logo
CecilSunkure
Profile Blog Joined May 2010
United States2829 Posts
January 04 2013 21:19 GMT
#5
Hey I really enjoyed this blog! So about how much time do you think you've spent on the various prototypes you have? Here are my favorite pixel art tutorials, maybe they can be helpful to you too.

Would be very cool to be able to play some of these. They are all in HTML5 right? So we can just play them in our web browsers?
Logo
Profile Blog Joined April 2010
United States7542 Posts
January 05 2013 03:44 GMT
#6
Yep, all the ones I showed are HTML5 so they run in a web browser. The first one, I don't think I can distribute without redoing most of the art (it's placeholder art that I took from the demo source included with the engine I'm using). I'll look into finding somewhere to toss the RPGish one.

If I count all prototypes across all technologies I've written... well I have no idea! Probably somewhere between like 200 and 300 hours (so a pretty wide spread). In terms of the HTML 5 stuff, with that I tend to blow through the prototyping stuff pretty quickly so maybe I've spent like 50 hours across the 4-5 prototypes I've written. The bulk of that was writing a piece for one game to get an entity to follow a mouse drawn curved path at a velocity that is dependent on the amount of curvature in the path (while also smoothing said path of minor bumps and wiggles). When I finished that is when I decided I needed a break to do something relatively simple before continuing on.
Logo
Please log in or register to reply.
Live Events Refresh
Next event in 1h 13m
[ Submit Event ]
Live Streams
Refresh
StarCraft 2
UpATreeSC 171
NeuroSwarm 136
JuggernautJason75
ForJumy 49
StarCraft: Brood War
Britney 16177
Artosis 552
Mini 194
Backho 19
NaDa 10
910 6
Dota 2
Pyrionflax189
PGG 159
League of Legends
JimRising 294
Counter-Strike
fl0m6203
Fnx 1635
Foxcn316
flusha260
Super Smash Bros
C9.Mang0840
Heroes of the Storm
Grubby4317
Liquid`Hasu380
Other Games
summit1g10437
FrodaN1349
shahzam855
hungrybox510
ViBE210
KnowMe38
RuFF_SC229
Organizations
Dota 2
PGL Dota 2 - Secondary Stream954
Other Games
BasetradeTV35
StarCraft 2
Blizzard YouTube
StarCraft: Brood War
BSLTrovo
sctven
[ Show 18 non-featured ]
StarCraft 2
• Berry_CruncH133
• RyuSc2 36
• davetesta19
• Kozan
• Migwel
• sooper7s
• AfreecaTV YouTube
• intothetv
• IndyKCrew
• LaughNgamezSOOP
StarCraft: Brood War
• RayReign 18
• STPLYoutube
• ZZZeroYoutube
• BSLYoutube
Dota 2
• masondota22412
League of Legends
• Doublelift5881
Other Games
• imaqtpie1417
• Scarra1053
Upcoming Events
Replay Cast
1h 13m
OSC
1h 13m
Bellum Gens Elite
11h 13m
WardiTV Invitational
15h 13m
BSL 2v2 ProLeague
20h 13m
Replay Cast
1d 1h
CranKy Ducklings
1d 11h
SC Evo League
1d 13h
Bellum Gens Elite
1d 13h
Fire Grow Cup
1d 16h
[ Show More ]
CSO Contender
1d 18h
BSL: ProLeague
1d 19h
StRyKeR vs MadiNho
Cross vs UltrA
TT1 vs JDConan
Bonyth vs Sziky
Replay Cast
2 days
SOOP Global
2 days
Creator vs Rogue
Cure vs Classic
SOOP
2 days
Classic vs GuMiho
Sparkling Tuna Cup
2 days
AllThingsProtoss
2 days
Fire Grow Cup
2 days
BSL: ProLeague
2 days
HBO vs Doodle
spx vs Tech
DragOn vs Hawk
Dewalt vs TerrOr
Replay Cast
3 days
Replay Cast
4 days
Replay Cast
4 days
WardiTV Invitational
4 days
WardiTV Invitational
4 days
GSL Code S
5 days
Rogue vs GuMiho
Maru vs Solar
Replay Cast
6 days
GSL Code S
6 days
herO vs TBD
Classic vs TBD
The PondCast
6 days
Liquipedia Results

Completed

CSL Season 17: Qualifier 1
DreamHack Dallas 2025
Heroes 10 EU

Ongoing

JPL Season 2
BSL 2v2 Season 3
BSL Season 20
KCM Race Survival 2025 Season 2
NPSL S3
Rose Open S1
CSL Season 17: Qualifier 2
2025 GSL S2
BGE Stara Zagora 2025
BLAST.tv Austin Major 2025
ESL Impact League Season 7
IEM Dallas 2025
PGL Astana 2025
Asian Champions League '25
ECL Season 49: Europe
BLAST Rivals Spring 2025
MESA Nomadic Masters
CCT Season 2 Global Finals
IEM Melbourne 2025
YaLLa Compass Qatar 2025
PGL Bucharest 2025
BLAST Open Spring 2025

Upcoming

CSL 17: 2025 SUMMER
Copa Latinoamericana 4
CSLPRO Last Chance 2025
CSLPRO Chat StarLAN 3
K-Championship
SEL Season 2 Championship
Esports World Cup 2025
HSC XXVII
Championship of Russia 2025
Murky Cup #2
NC Random Cup
BLAST Bounty Fall 2025
BLAST Bounty Fall Qual
IEM Cologne 2025
FISSURE Playground #1
TLPD

1. ByuN
2. TY
3. Dark
4. Solar
5. Stats
6. Nerchio
7. sOs
8. soO
9. INnoVation
10. Elazer
1. Rain
2. Flash
3. EffOrt
4. Last
5. Bisu
6. Soulkey
7. Mini
8. Sharp
Sidebar Settings...

Advertising | Privacy Policy | Terms Of Use | Contact Us

Original banner artwork: Jim Warren
The contents of this webpage are copyright © 2025 TLnet. All Rights Reserved.