A large structure lies ahead. As you draw nearer you see an old stone wall across the clearing. In its center an iron gate, skewed, rusty. And besides the gate two towers, one nearly destroyed, the other still standing. Was this what this battle was about? To invade the now forgotten realm beyond the gate?
You follow the old road a bit further. After some more abandoned war machinery you stumble upon something. As you look down you see a skull in a rusted helmet. You gaze further ahead and see an old battlefield, spiked over and over with arrows. And beneath the arrows you see corpses. The mortal remains of soldiers that died long ago, embedded into the grass, overgrown and withering.
The old farmer tells you, that there is a secret hidden deep in the woods. After searching the woods for hours you find a clearing. You move forward, cautiously, on guard. The first thing you see is an old road, overgrown and not used for decades. Followed by old, decrepit weaponry, rotting away on the gras. What could have happened here?
Torben here, the artist behind Rubikons graphics. We got some questions, how we do our sprite animations for Rubikon and whether its rotoscopy or not. Well, kinda sorta. Thats why I want to give you a quick overview of our process for this weeks screenshot saturday. So here we go:
Step 1: Base Animation in Unity
As a starting point for our base animations (walk, run, attacks etc) I use 3D animations from Mixamo that get tweked later on until they fit our project. More specific / simpler animations (interacting with a specific item, idles) are done from scratch and do not involve this step.
I import the 3D model and animation in a template Unity project with a camera set up to match the angle we need for our game. From there I export all needed keyframes with the help of the awesome Unity plugin Frame Exporter.
Step 02: Work-In-Progress Spritesheet in Photoshop
After that I throw them into a Photoshop project to quickly change the sizes of our frames to match the rest of the animations. With the help of John Wordsworths Sprite Sheet Generator for Photoshop I export them as a work-in-progress-spritesheet for further work in Aseprite.
All of this is just the preparation for the actual animation and does not take a lot of time. For me its well worth the hassle because of the fluid & natural movement of the animation afterwards, as well as the saved time that I would otherwise need to get the angles and perspectives right, would I draw every frame from scratch.
Step 03: Rough Tracing in Aseprite
The spritesheet then gets imported into Aseprite. I trace the frames roughly with a fixed set of colours for depth and defined layers for items. We changed this set up quite a bit while in development and as of now we have a some seperate layers for arms, torso, head and so forth.
From here I export a rough spritesheet, we import it into Unity und try it out. In general this is the most important part of the process, because there is always some tweaking in regards to timing, weight and perspective involved, as well as some back & forth with the other team members until we are satisfied with it.
Step 04: Refining In Aseprite
If we are happy with the rough version and everything works within the project we refine the graphics. This is usually the most satisfying part of the process, because you can finally see your graphics come to life 🙂
Step 05: Import into Unity
After exporting all layers seperately from Aseprite our code master Tony adds the animation to our character prefab in Unity so we can test it and tweak all remaining issues that might occur with the new graphics.
And thats it. We hope this little insight was interesting and if you have any thoughts or questions feel free to post them in the comments. Peace!
Take a look at our controller key bindings! It’s based on Dark Souls’ control scheme mixed with twin stick aim because we love fluent and intuitive control experiences.
You can walk and aim at the same time, you’re able to perform a light and a heavy strike, you can sprint (watch you stamina!) and of course do some parrying. If your sword is sheathed, your character will draw it with a strike input first. You will also be able to perform a thrust attack while running and do some strike combos.
There are a lot more dependencies to come, but all in due time 😉
Last weeks Screenshot of our animation controller in Unity got quite some attention. A lot of people mentioned, that we should look into blend trees to improve the controller. So our programmer Tony reworked the controller this week from the ground up. Looks so clean and organized now and it will be way easier to use in the the future 🙂
This saturday, we’d like to present you our new animator system. In a brainstorming, we decided to split the character in several animators, like the leg animator which you see above. This way we are able to perform mixed animations like walking backwards and strafing. Combats will be much more dynamic and challenging. Last but not least, you will be able to customize your character in every corner 😉