last time we showed you the video below of our map editor and promised to share more details on it.
This topic is a little technical, so we will try to link tutorials/wikipedia where useful.
And now we would like to present to you: Alerons Map Editor!
The First Approach (Objects)
Project Aleron was our first contact with the jMonkey Engine and 3D graphics in general. We wanted to learn very fast and chose the “hardest feature first” approach. We therefore played around with the concept of maps, which should support a combat system similar to Final Fantasy Tactics. We wanted our game maps to represent a 3D-Chess Board. Our first naive approach was to solve this with lots of “Lego blocks”:
This had one problem though: performance. We created an object per “Lego block” and the result was very slow for big maps, even on recent PCs, because every object required its own lighting calculations. Hence our goal was the creation of performant block-based maps. I think we all know this from another indie game…
The Second Approach (Voxels)
Our first look went toward Minecraft. Minecraft uses Voxels for the maps layout and renders them via Polygons (Tutorial series about Voxels). We implemented this technique by generating a Custom Mesh in jMonkey from our Voxel datastructure. We started developing two prototypes:
- 3D maps: The map is 3D, which means that we could dig caves, build bridges, and would have a completely 3D world.
- 2D maps: The map is 2D like a chess board, but with “height” attributes. This gives the illusion of a 3D world, but it does not support 2 characters on the same coordinate on different heights (example: having characters stand on a bridge and under a bridge). The great part about it: Our calculations are in 2D, but our camera is in 3D! 😀
The 2D map prototype was finished much faster, because even the rendering was much simpler than it was for our 3D map prototype. Further development would also be simpler, because a character only has a 2D position. To further simplify our maps, we decided to not support slopes. Our maps will intentionally look like a board game, so the maps understandable and the tiles are clearly visible.
We then continued development on our 2D map prototype and after a month of work (including the previous prototyping), we accidentially had a map editor!
The Aleron Mapeditor
The current version of our map editor fully supports creating and editing battle maps which are stored in our Database. Non-Combat maps are not yet implemented. The map editor offers four editing modes to edit combat maps:
Now you’re probably asking: Why are there only 3 modes in the picture?
The answer is simple: The fourth mode just isn’t quite done yet. 🙂
Here is an overview of the editing modes:
- Terrain Height Mode enables the user to modify the most important part of any map: The terrain. The system displays a height overlay for easy editing
- Texture Paint Mode enables the user to paint textures from a texture/tile atlas (like in the popular 2d map editor Tiled). The system supports painting on the floor and on walls
- Start Position Editing Mode enabled the user to create start positions, where the different teams can place their units at the beginning of a battle. Each map supports multiple “Start Position Set”s, so we can use one map for different scenarios, like story driven battles.
- Object Placement Mode (Work in Progress!) enables the user to place objects like plants, furniture and other obstacles or decorations onto the map.
Internally maps are made up of tiles and quads. Tiles have a position and at least one quad for visual representation.
In the picture you can see a tile with the height of 3. It has 13 quads: the blue on top, the 6 in red on the sides and the other 6 we cannot see right now.
These quads are created and destroyed automatically when you change the height of the tile or a neighbouring tile. Texture editing mode operates on quads. Apart from that, we only care for tiles. As a result, all our calculations are in 2D, which severely reduces our complexity.
We hope this post was especially helpful for our fellow indie developers.
If you have any questions, feel free to contact us using the comment section or social media! 🙂