next »

[miroz]

Code:

//TODO: Insert catchy name here

Code:

//TODO: Insert beautiful screenshot here

Motivation
Xeen games in Might and Magic series are some of my favorite CRPGs (Clouds of Xeen, Dark Side of Xeen and Swords of Xeen). It's hard to define what is good in the game, but for me, the excitement of exploration is what I remember the most. Couple that with other well-implemented mechanics like skill system where you have to find different trainers for different skills (introduced later in M&M VI), weapon attributes and magic system and you get that great mix.

I had the idea to work on such a game for a long time, but the clones already exist (Grimoire, Grimrock) and even similar classics are still playable (EOB, LOL, DM). Classics and Grimoire use fake 3d envirnoment with 2d sprites. Implementations using modern engines and 3d graphics exist (Grimrock) but having realistic 3D space limited to grid movement is just not that appealing. Old games had a level of abstraction that allowed the player's imagination to fill the gaps. You got just barebone, visual hints of what is actually happening in the game and you filled the rest using your imagination. Once you jump to realistic graphics, artificial limitations like a grid system fall into an uncanny valley. I don't want to repeat what's already there.

I have very limited graphics skills, negligible really, so I have to think simple and fill the gaps with clever instead of beautiful solutions. That lead me to try to implement the system as top-down, but keep the grid-based party. Similar to Xeen games, but without the first-person view. Like you are constantly looking on the map. I'm not sure if that can work at all, so before I get to the quest system, character progression and game rules, I want to test the basic mechanics first and get the feel of the game before I invest too much time in code and content. If the graphics I have in mind won't work for the game, there is no game.

Development
My time for the project is limited since I have a day job, but I'm working remotely, so this is another experiment: if I get up one hour earlier and start working immediately instead of coffee and surfing, can I squeeze in two hours of gamedev in the morning without neglecting my day job and family matters?

Devlog
I usually work in a bubble, not showing my work around until I find it presentable. This time I want to try the opposite: share the details of development and make a gif of all important milestones in development, showing prototypes and programmers art.

So, one programmer, limited time, no artist, what could go wrong?

[miroz]

Day 1-3 - Where I work on basic, basic movement

I can start with just two components: a map, and a party. I created a Unity project and spent some time to get mad at every system that doesn't work as I expected. Finally, I settled on using unity Tilemap and some tiles ripped from Civilization IV. This will work for now. Programer art, right? The main concept to test is the top-down view of the characters. I want to quickly see if this looks acceptable. I started with a party of 4 characters. Maybe it will be possible to increase the number to a maximum of 9, but four is a minimum. As in Xeen games, or any other classic dungeon crawler, you move the complete party, not individual characters. Movement is executed using arrow keys. A single arrow key press moves them one tile, but you can queue multiple movement commands and they will be executed in order. If you spot an enemy, the movement queue will be interrupted.


I got some top-down 2d sprite and traced it to create my sprite. It's a bit low-res, but let's see what can be done with this. From this version on, we can only improve. The first version is just some static movement with linear interpolation between points but after adding some physics to the formula, the movement looks bearable:



And now, to some basic animation. Somehow, pixel by pixel, I created a walk animation that doesn't hurt the eyes and deciphered Unity animation system to put it on the screen. Well, yesterday I didn't know how to do that:



Now the party moves but living creatures cannot move so uniformly, they are moving like a robotic army. I want the party to move like a bunch of individuals, not like the North Korean army under Kim Jong-un balcony. So instead of moving the party, I'll move the individual characters. First I added some noise to their final destination. They should all finish near the position defined by the formation, but not exactly there. I added some weight to the randomness so they don't stray too much, they prefer to return towards their formation point. That looks ok, they scatter a bit, but they still start and end the movement in unison, so I added some random delay to the start of each character's movement, with the back-row having a bit more delay.

They now look like a bunch of adventurers:



So that worked, I was able to do 90 minutes of gamedev in the early morning for three days straight without an impact on my day job. Actually, I feel more productive on both fronts. Let's see how long that lasts.

[Ramos]

Hey,

I am curious what will your creation evolve into. I am always into top-down games.

Also regarding art: do not forget that you can always find an artist to do it if you concentrate on the code.

PS: your avatar is amazing, terror from the deep? Big fan myself

[miroz]

I am curious what will your creation evolve into. I am always into top-down games.
Also regarding art: do not forget that you can always find an artist to do it if you concentrate on the code.

I'll try to get as far as I can before looking for an artist, just using assest. Based on previous experience, hiring an artist too early, if you're not on the same page, can lead to a lot of wasted time. I really like the Chromosome Evil art, though 

PS: your avatar is amazing, terror from the deep? Big fan myself

Yeah, for some reason I played TFTD before the original, so it kinda remained my favorite XCOM game. Just rose-colored glasses, I guess.

[Alain]

Yeah, for some reason I played TFTD before the original, so it kinda remained my favorite XCOM game. Just rose-colored glasses, I guess.

Funny, it was the same for me. I found out that X-Com existed after playing TFTD for a year or so. But I instantly preferred it to TFTD, because I liked the environments more.

Looking forward to see more of your game!

[Ramos]

I'll try to get as far as I can before looking for an artist, just using assest. Based on previous experience, hiring an artist too early, if you're not on the same page, can lead to a lot of wasted time. I really like the Chromosome Evil art, though 

Yeah, for some reason I played TFTD before the original, so it kinda remained my favorite XCOM game. Just rose-colored glasses, I guess.

Thank you! It is heavily inspired by XCOM in gameplay and lore.

I played TFTD after Enemy Unknown but I love both. TFTD is mostly a reskin of EU but somehow managed to have more horror and claustrophobic atmosphere.

I have a rich imagination and after googling a bit about "Clouds of Xeen" I can picture some good gameplay here and because you choose top-down for this type of game I think it will stand out among the others of this type, so do not give up.

What theme have you choosen? Medieval, sci-fi, modern-day, etc?

[miroz]

@Ramos - a medieval fantasy - although M&M games end in a sci-fi setting, I'm not going there

Day 3-5 - Where party turns and fog of war falls on the map

Turning
The next movement problem is a bit tricky, turning. I can't just rotate the party sprite, because it looks like they stand on the rotating platform. When turning, all four characters must rotate around their own axis and then move. But when they do that, they will break formation, the front row will become left flank, back-row right.
To fix this, I needed some more movement code. Characters will switch places, depending on the path they'll wait a bit and move slower so they stay in formation. The result is, well, interesting.


A bit about graphics
The plan for the graphics is to keep it simple and old school, but use modern features like bump mapping to add detail to the terrain. I played a bit with normal maps and lightning, but I couldn't get any positive effect, so I abandoned that idea for now. But at least I removed the ugly grey line between some tiles. Point filtering FTW.

Then I played a bit with the camera, simple mouse wheel zoom and right-click move will suffice for now. I tried to add a camera that follows the party but my first implementation gave me a literal headache, it was too jerky. Future work.

Visiblity
After spending the time on invisible features, I had to implement something gifable. So I added the visibility feature. At first, you don't know anything about the world so the map is black (should be some nicer color or pattern). You can see the world only a few tiles around you, currently just one but it will depend on your skills and the type of terrain. Everything else is under the fog of war, visualized as a grey tint over the tile. Again, I'm thinking of desaturating the tiles instead of tinting them but again, future work. I played with the mask a bit, it needs at least some smooth edges to remove this blockiness, but such as it is, it represents the game state and this is enough for now.

[miroz]

Day 6 - Where i reorganize code and nothing interesting happened

It was fun so far, but it's the most I can do without thinking much about code organization. Next, I want to add a better visibility system, so you can see far on the plains but in the forest and mountains you see just the tiles you are on. For that, I need to organize the code a bit. I split my code into two big sections: GameLogic and GameObjects. Since this is a turn-based game, game logic will calculate each turn, and drawing part will get the state changes and draw them. With that, I can simulate the game without graphics, even outside of Unity. I could test it by running multiple different instances to see if the game gets into some invalid state, and, possibly, optionally, let's just say it, it could run as a multiplayer game server. A girl can dream, right? So can I.

But as soon as I started working with classes that are not Unity's GameObject, Unity started behaving weirdly. Breakpoints would not be hit, sometimes I couldn't run the debugger at all. All that was resolved with the good old restart and deleting all temp data, but it took some time I can't get back. But the important is that the game is now divided into game states. For now, I have just two global game states: menu and game, and some play game states: waiting for input, players move, world move... The game waits for input and forwards the command to the game logic which returns actual player's action. The action is interpreted and animations are run. Then the world turn is calculated (enemies, npcs...) and animated and so on.

After working for a few hours, gameplay wise I am in the same spot as yesterday, but the code will be much nicer to work with. I made mistakes before with waiting too long before structuring the project, but not this time. This time I refactored.

To add something playable, I finished with limiting movement inside the map bounds, because before that, the party could wander outside in the void. I made them stop. I'll add some animation to that later.

Days 7-9 - Where I'm adding roads and forests

Finally, something visual, adding some roads. I kept it very simple, so I have just four road tiles, straight, corner, T-crossroad and 4-way crossroads. But now I went from one tilemap to two tilemaps overlayed so I had to change the code to handle multiple tilemap layers. As developers know, changing from one to multiple is hard, but now when I add another layer, it's just more of the same.

So, let's add some forest too. Again, keeping it simple, I added some sparse trees, because I want to see the characters through it and I don't have to worry about making the tile seamless (I tried, though, 'twas bad). I'll add some denser forests in the future and make characters visible with masking.



Next, better visibility.

[Ramos]

I like the way how you use the trees on the top layer, it gives a nice depth to the visuals

[miroz]

@Ramos - Yeah, the cheapest trick in the book.  But trees will need some shadows to ground them visually, they look like they are floating now. And shadows should be on the layer below the party.

Days 10-11 - Where forests block the linesight and my back starts to hurt

Linesight
And now to the main point of the forest. I want to have farther visibility on the plains, but forests should block the view. In the forest (or mountains), you can see only the tile you're on. I used Bresenham's circle drawing algorithm to generate the circle around the party, and then using Bresenham's line drawing algorithm, shot rays from origin to every point on the circle. Forest and mountains will block the ray. Unfortunately, as I used a boolean visible state, the effect is not satisfactory because you should see the edge of the forest from afar, but not into the forest.


To improve this, I tried to use the mask that will show the edges of the tiles that are visible to the party. After many hours of trying, I finally got what I wanted. And it looked terrible. It doesn't even deserve a screenshot.

The problem is, I wanted the wrong thing. I should use the same system for all tiles, not only obstacles. You can't have blocky visibility in the open field but rounded masking around the forest. This opens a rabbit hole, where I would implement lightning and shadows and whatnot. So I scrapped this and replaced it with a much simpler model. I added a third visibility state: obscured. So the forest is visible but shadowed, except if the party is in the forest.

Could be prettier, but it will serve the purpose.

With that done, I can start with more fun parts, like some combat.

Other problems
Well, my back started to hurt. Yes, I'm spending more time in front of the computer now through a bit longer stretches of time, but I'm programming for a living for years, I learned how to sit and how to stretch and workout regularly. And my problems are usually with the lower back, and now the pain is high up. What happened now in 10 days of working on a game?

I analyzed a bit. When I'm doing some standard back-end web development, I sit back, relax, put my fingers on the keyboard and type. And I stay this way. But for game development? I start like that, but then I run the game, I notice some jerky movement or pixel that's in the wrong position and I slouch forward to better see what's on the screen. And then I stay that way and start to type while in this position and see something else that requires slouching and so I spend hours slouched forward, my expensive back-supporting chair being used as a plain wooden stool.

I moved my screens a bit closer, switched the mouse from right to left side just to break my focus and made mental note to check my pose every now and then. We'll see.

[miroz]

Day 12-18 - Where arrows fly and enemies bleed

I want to accentuate the exploration part of the game, and I want to avoid to bog player down with too much combat. What I hated in Might and Magic VI-VII are hordes and hordes of enemies. I find it exciting to meet a new monster or villain, but after a few, cleaning the area of monsters feels like cleaning the apartment, you do it because you have to do it, not because you like it.

Then I have the limitation that I'm not an artist, so I'll keep the variety of the graphics low, but I'll compensate that with interesting and varied enemy behavior, which, as a good programmer, I can, and should do.

To start, I coded a ranged attack. I added some vampire placeholder graphics as the first monster. It just moves a step forward and a step back, nothing smart here but enough to test the attack. Pressing Q (quick attack) in the ranged distance, all characters will shoot their ranged weapon. That will be configurable, spellcasters could assign some spells as their quick ranged weapon. For now, they all got some bows and arrows.

I want the arrow to fly in an arch, not directly, so this is the first 3D addition to the otherwise 2D game. But I quickly run into a problem. I started a project as 2D which uses just x,y coordinates (left-right/up-down), ignoring Z completely. So the 3D math doesn't work. I converted the project to 3D so that my tilemap is spread on x and z axes, while y is up. I had to fiddle with it a bit, like rotating sprites so they face the new camera position, but math is simpler that way, and I can use Unity's helper functions.

For the actual arrow flight, I refreshed some physics so I can calculate the flight pattern from distance and firing angle. That done, we can see arrows moving.


They move, but in a really boring way. I added a few details. First, some blood splats on impact. This will vary depending on attack type and what enemy uses for blood, but for now, everybody is red under the skin. Then I added some random time delay to arrow release, and some randomness to the firing angle so it looks like four characters are shooting independently. And finally, instead of always hitting the center of the enemy, I'm finding a random point on the enemy where the arrow will land. Altogether, the arrow flight looks good.


In the end, for some programming fun, I implemented the object pool to handle arrows and blood splats, and other future transient objects. I had to do it now, it will scale a lot better once I start adding more objects.

[miroz]

Days 19-20 - Where the first enemy dies

It's time to kill something. To do that we need some RPG combat rules, game system, mechanics, or however do you want to call them. I want to have really simple rules, and I want to fix the problems I had using other systems or playing other games. Long, uninteresting combat in DnD is my pet peeve for a long time, in my DMing days I tried to fix it with various house rules and I think they'll work well for the game. The most important is that they simplify, I can always add some complexity.


Theory

No HP, just states: healthy, grazed, wounded, downed. Every hit lowers the state. Power hit lowers two states. Critical hit is instakill. I'm keeping dead/alive as separate states. When you go down, there is a chance to die, immediately or after a time. I'll favor players and enemies to not die immediately so they can be healed.

With that, there are no separate attack and hit rolls. Every attack has a chance to hit based on attack, defense, and modifiers. There is a chance to hit, a lower chance for a power hit, and even lower chance for a critical hit. Weapons, skills, attributes and modifiers add up to produce the final numbers. So you can have different values for melee attack, melee defense, ranged attack, ranged defense, magic attack, or magic or elemental resistance.

To summarize, your d20 roll + attack skill is compared to the opponent's defense skill and the difference is translated to hit chance. The bigger the difference, the bigger the chance for a critical hit.


Math

For start, I added ranged attack and ranged defense properties to characters and assigned them fixed values (these will be calculated as explained before). So, how is the success calculated?

For easier display, the math behaves like the dices are involved. You roll d20 and add to your attack and it has to be better than the opponent's defense by some margin, the difference determines the type of hit.
<=10: miss
10+ : hit
20+ : power hit
25+ : critical hit

For example, if your skills are equal, you have a 50% chance to hit, no chance for power or crit hit. As the difference gets bigger, you have more chance to hit and more chance for power and crit hit.
Diff +5: 75%, 25%, 0%
Diff +10: 100%, 50%, 25%
Diff -5: 25%, 0%, 0%
Diff -10 0%, 0%, 0%

Implementation
So, I gave a fixed RangedAttack and RangedDefense stats to PCs and the enemy, added hit calculation, and there it is, after three successful hits, the vampire dies.

[miroz]

Days 21-25 - Where we enter the city and move smoothly

Into the city

As in M&M games, I want nested world map, meaning you can walk around the outside map where the city is just one tile. Then you enter the city and walk around it. There you see a tile with witch tower, you enter it and do stuff there, go up or down a level...

Let's start with some city on the map and allow our party to go into the city, walk around it, and exit. So I added some new textures and created a city walls and roads and shaped some rooms. I tried the process of generating my own textures this time. I used some free 3d assets, models and textures, fixed their positions, used orthographic camera and took a screenshot to get the texture of exactly 128 pixels. It generates much better results than searching the internet for the exact style. I know there are programs to export directly to texture, I'll find some, but this works as a test. We're making content!

Then I fiddled with transition between maps, entry and exit points, remembering the state across the maps. This took me a while to settle but it's working now. So, we can enter the city, walk around it a bit and exit it.


Smooth movement

After walking around a bit, the jerky movement where the party stops before resuming is starting to get on my nerves. Since I want a smooth experience, this is something to fix. From the beginning, I added a movement queue, so if you press the right arrow three times, the party will move three tiles, but stop and start between the tiles. The reason for this is that between the party movements, the world has its turn. But if there are no enemies around, we are free to continue moving, so let's implement that.

It required some changes to the background logic, but I got them moving without jerking, looks quite good. Except when turning. But, let's leave something for the future me.



Next time: melee combat

[miroz]

Days 26 - 29 - Where we fight using Swords!

Let's see some melee combat. I was postponing that for some time because there are some invisible problems. Any group currently is in a formation with front row and back row, so when two opponents are in melee, the front row can hit the opposing front row, but the back row can't do anything. The plan is to implement an animation when somebody from the back row melee attacks, it will move between the front row, execute the attack and move back. It will be interesting to coordinate this. The front row will have to spread a bit to make space, but it could look nice. But first, I'm going with the lazy approach - just disallow melee attacks from the back row, allow only ranged and magic, which is fine since the back-row has the protection of the front row. You'll be able to switch the positions during combat so it could add some choice to combat tactics.

First, I need some sword swing animation. I won't animate the whole sprite but just a sword using transformations. That way I can switch the weapons easily. This is actually a 3d animation now, I guess it will be replaced with a proper 2d animation.



Well, the animation is there but the visuals are off. Animation is crude, but that can be fixed, the main problem is that there is too much space between the attacker and the defender. That's what I am afraid of the most, that the chosen perspective and visuals just cannot depict what I have in mind.

The first solution I have is to lock the opponents in melee, bring them closer visually for the duration of melee. That's not only a visual solution but can also add to the game with flanking between characters and the effect of different formations.

Before I implement that, I quickly checked some other games for inspiration. In Civilization IV, for example, the attacker will move into the defender's tile, execute the attack and return to its tile if the defender is still standing. Ok, that can work, but I want the party members to move individually, so it would look weird that each of them leaves the formation to attack. The alternative is for the front row to attack together, but for now, I prefer the first solution.

I also checked Rimworld, which is a real-time game and it's not tile-based, but its graphics are so simple it had to do tricks to depict the combat. Melee combat in Rimworld is depicted by character's icons wearing a melee weapon, but they do not swing it, instead, the whole character icon moves quickly toward the opponent and backs away, half a second in total, simple but effective.

So, when in melee, opponents will come closer and rotate toward each other. With sword swing animation and the trick from Rimworld, this looks much better.

[miroz]

Days 30-38 - with a lot of refactoring

Until now the party moved together, one command - one turn. But for melee, characters have to act individually, so we need some indicator of who's turn it is. When not in melee, the circle will show that the whole party is selected. When they enter the melee, one character will be selected. Switching between party-based and character-based actions made me scratch my head a bit. Parts of the code were a bit chaotic, so I implemented some proper state machines. I need to refactor some more, but for now, this looks good.

Except that the indicator switches before the animation is finished. Now that I have proper FSMs implemented, I'll fix this in no time.

...and 10 days later, I fixed it. Since the state pattern showed promise for parts of the code, I overreached and used it everywhere, but that was wrong. The game loop fits in the state pattern, but not for the party movement. I backed myself into a corner, unable to play out proper melee entry and exit movements. I thought a bit and replaced that part of the code with the command pattern which fits a lot better. So now, finally, I have the behavior I wanted.

[miroz]

Day 39 - Where we turn and shift, and twist...

We need some more controls. Currently, you can move, but you can't turn without moving to a different tile. I'll expand controls a bit. With arrow keys, the party turns in the arrow direction and moves one tile. If you press shift and arrow, then you turn in the arrow direction but stay in the same place. And if you press ctrl and arrow, then you move in the arrow direction but without turning, so you can sidestep and step back. All of this is important because the direction you are facing will be important in combat, if you get flanked, you're screwed.

[Ramos]

I like that mechanic when troops reach a settlement to enter city map

[miroz]

I like that mechanic when troops reach a settlement to enter city map

Thanks, I'm trying to get hierarchical maps, so that I can walk around the map and enter the city, walk around the city and enter the sewers, and use the same system to navigate between sewer levels. It makes the distances between interesting locations shorter because you travel on different layers.

[bbtombo]

aw man i love the xeen games too. i got the original maps for xeen + the darkside. stoked to see what you do with this

[miroz]

Days 40 - 42 - Where party switches weapons automatically and we reached a milestone

We have a problem with the back row, they can't do anything in melee currently. I didn't decide yet on how to handle this. As I see it, shooting arrows from the back row is pretty dangerous because you could hit the front row, although that problem is usually ignored in games. If I allow them to shoot but with a penalty, they'll become useless. They could use spells, which is a fine alternative, or they could use reach weapons like spears and polearms. Again, fine, but I don't have this programmed yet. For now, I'll allow archery from the back row, but this could change in the future.

The first thing to implement is weapon switching. If there are no enemies around, there is no reason to wield a weapon, so they will be automatically sheathed. If an enemy becomes visible, the party will switch to ranged weapons. And finally, when entering the melee, the front row will switch to melee weapons. Then in the fight, the front row will fight with melee weapons and the back row will use ranged weapons.


It happens kinda fast, but you can see here the party starts without weapons euiped. They see the enemy after moving and switch to ranged weapons. When they approach the enemy, front row switches to melee weapons.

Milestone

Time to recap! After 42 days I implemented all the systems I wanted to test. It's time to look back on the project and reevaluate it.
Is it worth pursuing? What are the next steps?
In the next few days, I'll take a break from coding and try to answer those questions.