As the game has progressed on the back-end side of things, I’ve continued to struggle with how I want the aesthetics to look on the front-end; the stuff the players will see. Since my budget for art is pretty minimal (read: just above free), I’ve had to give up a lot of wants and simply settle for what’s available out there. Luckily, I’ve found some character portraits that I’m overall happy with and some weapon art that I actually like (though it is a limited amount and doesn’t cover the entire list of currently planned weapons). However, the major cloud over my head has been the city art. How the map should look, how the buildings should appear, etc… After countless hours of searching and attempting to find something both affordable and that fits the art style in my mind – I’ve found a suitable art set thanks to https://kenney.nl
For now, I’ve settled on using the free art asset pack which has given me a lot of options since they’re all designed in the isometric format (one design concept I really like). The colors are a bit muted and monotone in some spots, and straight up bland in others, but getting the game out there for players to see is the most important thing to me. I’m not a AAA studio so I can afford to release a game with placeholder art in order to get rapid feedback and adjust from there.
The map will be a static representation of the city and it’s buildings. Players will be able to ‘view’ the city and click on each building in order to ‘enter’ it (taking them to the next view). Unlike a traditional computer game, your player wont walk around the town, and you wont see any other NPC’s out and about.
When a new game feature is in development (that can be represented by a structure in the city map), the map will then display a structure that seems as if it’s being built, maybe even through various stages of the development cycle the building will appear more and more complete?
Behind the Scenes
The CSS Approach
I can use pure CSS to position the map’s objects, which would be laid on top of a primary layer (the ground). There are three obvious problems with this approach:
- Z-Indexing would be a real pain. Having to constantly calculate and adjust items as they are placed on the map to appear in the right order (beyond / in front) would be a massive headache.
- Positioning by hand is tedious, tricky, and any sub-subsequent objects placed on the map will likely throw off previously placed items.
- The map UI will likely break on smaller screens.
The Image Map Approach
This is an older technology that would most certainly get the job done, but it’s not as exciting or ‘cool’ as modern technologies. There is one problem I’m aware of with this:
- Having to recalculate the areas (hit box, if you will) with each new object added to the map.
I feel like this may be the best way for a feature like this.
So there you have it! Progress on the game’s city area is being made and it’s a big weight off of my shoulder. I’m hoping that players will enjoy exploring this part of the game.