I like the look of 2D sprite based units running around a 3D world. I knew this was going to be a part of my game from the very beginning. It has a goofy nostalgic look and it's really enjoyable, at least for me.
Using Unreal Engine 4 for this is very counterproductive. 3D characters are easier and more streamlined but I stubbornly stuck with my plan and I like how it turned out.
First I drew every animation frame on a piece of paper, scanned them and recently re-drew them digitally.
Here is the difference.
These are just 4 frames, so it looks clunky but you get the idea.
Then you have to draw the same 4 animations for all 8 angles of the sprite. I named my angles off of directions so below we have North-West, West, South-West, South, South-East, East, North-East and North, in that order.
Turns out animation is a lot more tedious work than I thought!
Since these are animated, you cannot use a Billboard component on your Character class as far as I know, so I used the Flipbook component and angled the flipbook to face the camera on tick.
I simply find the angle between the character and the camera and then set that as the flipbook's rotation (-90 degrees).
After doing this you will find that the flipbook behaves now like a billboard, always facing the camera but the animation will not change based on what angle the character itself is facing.
To do this we need a bit more calculation.
I have 8 sprites each at their own increment of 45° so I take the character's rotation ÷ by 45 to get our angle between 0 and 7 (Unreal Engine is 0 based so we begin at 0 instead of 1).
That is subtracted by the camera's angle to get the angle the character is facing in relation to the angle the camera is facing. I did a quick check to make sure the number is between 0 and 7. I saved that number as a variable "angling" and used it later to choose the correct flipbook.
The Switch on Int is using our "angling" to set the flipbook to the right angle. It took a bit of tinkering to get this right but it's pretty straight forward. Through testing I've found 0 = West, 1 = NorthWest, 2 = North, etc. Then you just place the correct flipbook and set it to our character's flipbook component.
I made a call to a struct that has all 8 angles of each specific flipbook type so the flipbook can be changed easily for different units.
You can see above that the units face the same direction as the camera rotates around them. This is a small but necessary detail. One of those things you only notice when it's missing.
It doesn't look particularly impressive but it does the job and I like the look.
And that's how I've made 2D characters able to run around in a 3D world and face the right way!
I create, design and develop video games I'm interested in playing.
The Fire System
Melee and Ranged Units
Weather and "Seasons"
Ladders and Elevation
Animating 2D units in a 3D world
Setting the Theme
Setting the Focus