While developing Soulstice, one thing became apparent. It looked very static. All of the work was so behind the hood with AI being such a big factor, and the art itself was being pumped out so slowly. There had to be some change because I believe that having something that has at least some visual appeal helps with motivation while working on the project for long periods of time.
Based on the criteria that the overall look of the game should not change, the game’s view had to be more dynamic. We did this by transitioning the existing game into 2.5D.
However, we needed to make it work in the sense of our game without it losing sight of what we originally set out for.
Part 1: The Introduction of the Layer Style
The game still having to look 2D was one of the biggest criteria for the visual overhaul. Parallax being one of the most common ways to add depth into 2D scene was something that was considered, but we needed art to make that work. 3D was out of the question based on the criteria.
The route we took to achieving this was keeping all of the assets 2D, but offsetting the elements on the z axis. This kept the game as a still looking 2D, but made it more dynamic by actually having 3D depth. This is called the Layer Style.
However, there were a few problems with this.
Assets had to accommodate for this
Camera had to accommodate for this
The player had to have some feedback relating to this
Part 2: Asset Design
If everything was actually offset, then we had to show that off at every opportunity we could to ensure it wasn’t just some gimmick. This meant that we had to push the Layer style with every element visible. And this included the assets.
As art was being done slowly and it was still in its early phase of development, art guidelines had to be submitted discussing how we’d have depth in each asset. As characters were intricate and small, we allowed them to avoid this, but for the buildings this was enforced.
Basically, all buildings had to be divided into 3 layers: foreground, midground and background. The accessories and supports of the building usually went into the foreground, while the roof was in the mid, and the building structure was in the back.
These 3 layers would be assembled in Unity with the z offset and placed as a normal building would. This gave depth to the buildings.
Part 3: Camera
The first thing we changed about the camera was that it could no longer be in orthographic. As it renders without perspective, there could be no depth seen and therefore had to go.
Another thing is that we wanted the player to be able to do is have some control over the camera and the 2.5D effect. Inspired by games like Dishonored 2 (in note menus) and Gravity Rush 2 (comic book cutscenes), depending on how the analog stick is wiggled changes the angle the camera is at slightly, allowing the depth to really be noticed. This is what we wanted to apply to the entire game. Because the mouse was used only for attacking (at this stage of development) we decided that the camera would change angle to look at the mouse location to a certain degree. However, this turned out very underwhelming. The depth couldn’t really be seen this way, even though it was apparent in other cases.
After examining further, it turned out that the best way to set camera angles to showcase parallax was to always have a constant focus. If the camera remains on one object and shifts its view of everything else around it rather than change its view of everything linearly, parallax becomes much more apparent. This was done by having the camera always look at the player, and the mouse position determining how far away from an origin point the camera was. This provided a much more better sense of depth.
Part 4: Conclusion
By adding these 2 features to the game, we were able to successfully develop the 2.5D visual language. This was a big success for us because it was a relatively easy way of making the game look good and taught us about emphasizing depth in creative ways.