In this week’s blog post, we want to highlight the user interface (UI) creation process in our project Spire of Chaos: Arcana Unleashed.
In this update7
Full notes
Full Spire of Chaos : Arcana Unleashed update
Read the full published notes in a cleaner layout. The original post stays linked below.
What changed
0 fixes1 addition5 changes0 removals
UI and audio
changedIn this week’s blog post, we want to highlight the user interface (UI) creation process in our project Spire of Chaos: Arcana Unleashed . We feel that the amount of work and the quality of the design and visuals for each gauge, button or menu of our game is well worth the mention. Moreover, you’ll be able to see different stages of production for the interfaces, from their most basic concepts to our most recent results.
changedMain MenuOne aspect of which we’re very proud is the main menu. Its design evolved a lot during production and along discussions between our design and art teams that were working on UI which allowed to come up with a visually interesting idea; a main menu that changes depending on which button is highlighted . This simple but unique design allows our game to stand out, even though it came with some challenges. For several weeks we had camera movement between the different scenes of the main menu, but realized it was creating an accessibility issue and we’ve decided to move on to more simple transitions between the scenes.
addedThe DiaryOne of the more unique aspects of the UI of our game is the introduction of a diary. This is accessible at all times from the player and lists our main character’s abilities, collectibles found throughout the levels and some interesting narrative aspects for players who want to dive deeper into the game’s story. We were uncertain of keeping this design during development , but we decided that it was an important element since it can add an additional tool for learning the game’s mechanics for our players.
changedThe DiarySince our game is relatively short, this journal has become essential for gameplay information that otherwise would only be accessible through the level design and encounter design, which were already quite ambitious for the resources of our team and our production length. So, this decision to keep the diary in Spire of Chaos: Arcana Unleashed was made to help the players, but also the development team and the management of our available resources.
changedOptions MenuWe decided to put a lot of work into our game’s options menu to offer a full key and button remapping screen for both controller and keyboard. This kind of functionality might be taken for granted in a commercial video game, but it actually comes with a lot of challenges and allows us to stand out amongst student projects, where this kind of attention to detail is not necessarily common. It was a complex element to implement, in terms of programming and workload for something that could seem to come by default in a video game. However, the final result, especially in terms of accessibility it allows, are worth all the work we’ve put on it.
changedUI ArtKeeping a coherent artistic vision within each element of the user interface, from the smallest of icons to the largest of images, is quite the challenge artistically. Especially since our art is greatly inspired by the Art Nouveau style, keeping the UI clear for the player was difficult since it defines itself by the amount of detail and numerous curves. We had to reach a compromise between the legibility and visual accessibility of the interface and the art direction that defines the visual identity of Spire of Chaos: Arcana Unleashed. One aspect not unique to but present in the creation of user interfaces by game artists is their creative ambition. Sometimes, ideas and concepts made during brainstorming end up not working when put into practice. However, each idea and iteration helps to think of and reach a more tangible and functional design in the end. Thus, communication between designers and artists remains key for exchanging ideas and figuring out what is possible or not and reaching a good compromise.
Spire of Chaos : Arcana Unleashed changes
changedIn this week’s blog post, we want to highlight the user interface (UI) creation process in our project Spire of Chaos: Arcana Unleashed . We feel that the amount of work and the quality of the design and visuals for each gauge, button or menu of our game is well worth the mention. Moreover, you’ll be able to see different stages of production for the interfaces, from their most basic concepts to our most recent results.
changedOne aspect of which we’re very proud is the main menu. Its design evolved a lot during production and along discussions between our design and art teams that were working on UI which allowed to come up with a visually interesting idea; a main menu that changes depending on which button is highlighted . This simple but unique design allows our game to stand out, even though it came with some challenges. For several weeks we had camera movement between the different scenes of the main menu, but realized it was creating an accessibility issue and we’ve decided to move on to more simple transitions between the scenes.
addedOne of the more unique aspects of the UI of our game is the introduction of a diary. This is accessible at all times from the player and lists our main character’s abilities, collectibles found throughout the levels and some interesting narrative aspects for players who want to dive deeper into the game’s story. We were uncertain of keeping this design during development , but we decided that it was an important element since it can add an additional tool for learning the game’s mechanics for our players.
changedSince our game is relatively short, this journal has become essential for gameplay information that otherwise would only be accessible through the level design and encounter design, which were already quite ambitious for the resources of our team and our production length. So, this decision to keep the diary in Spire of Chaos: Arcana Unleashed was made to help the players, but also the development team and the management of our available resources.
changedWe decided to put a lot of work into our game’s options menu to offer a full key and button remapping screen for both controller and keyboard. This kind of functionality might be taken for granted in a commercial video game, but it actually comes with a lot of challenges and allows us to stand out amongst student projects, where this kind of attention to detail is not necessarily common. It was a complex element to implement, in terms of programming and workload for something that could seem to come by default in a video game. However, the final result, especially in terms of accessibility it allows, are worth all the work we’ve put on it.
In this week’s blog post, we want to highlight the user interface (UI) creation process in our project Spire of Chaos: Arcana Unleashed. We feel that the amount of work and the quality of the design and visuals for each gauge, button or menu of our game is well worth the mention. Moreover, you’ll be able to see different stages of production for the interfaces, from their most basic concepts to our most recent results.
Main Menu
One aspect of which we’re very proud is the main menu. Its design evolved a lot during production and along discussions between our design and art teams that were working on UI which allowed to come up with a visually interesting idea; a main menu that changes depending on which button is highlighted. This simple but unique design allows our game to stand out, even though it came with some challenges. For several weeks we had camera movement between the different scenes of the main menu, but realized it was creating an accessibility issue and we’ve decided to move on to more simple transitions between the scenes.
We also had some artistic challenges for the main menu regarding the image composition and moving from 2D concepts to 3D scenes. A lot of work was put into the different scenes of the main menu so that they are all visually unique, but also coherent between each other. For example, the lighting of those scenes and the visual effects need to be carefully put together to give our player the best first impression possible when they’re about to play.
The Diary
One of the more unique aspects of the UI of our game is the introduction of a diary. This is accessible at all times from the player and lists our main character’s abilities, collectibles found throughout the levels and some interesting narrative aspects for players who want to dive deeper into the game’s story. We were uncertain of keeping this design during development, but we decided that it was an important element since it can add an additional tool for learning the game’s mechanics for our players.
Since our game is relatively short, this journal has become essential for gameplay information that otherwise would only be accessible through the level design and encounter design, which were already quite ambitious for the resources of our team and our production length. So, this decision to keep the diary in Spire of Chaos: Arcana Unleashed was made to help the players, but also the development team and the management of our available resources.
Options Menu
We decided to put a lot of work into our game’s options menu to offer a full key and button remapping screen for both controller and keyboard. This kind of functionality might be taken for granted in a commercial video game, but it actually comes with a lot of challenges and allows us to stand out amongst student projects, where this kind of attention to detail is not necessarily common. It was a complex element to implement, in terms of programming and workload for something that could seem to come by default in a video game. However, the final result, especially in terms of accessibility it allows, are worth all the work we’ve put on it.
Loading Screen
In the narration of Spire of Chaos: Arcana Unleashed, our heroine works her way down a tower, moving to free herself from her imprisonment there. The loading screen has greatly helped to understand this aspect of our narration and several iterations have been thought of and designed to best represent moving down through the tower and helping our level design to convey this downwards motion.
Steam post image
UI Art
Keeping a coherent artistic vision within each element of the user interface, from the smallest of icons to the largest of images, is quite the challenge artistically. Especially since our art is greatly inspired by the Art Nouveau style, keeping the UI clear for the player was difficult since it defines itself by the amount of detail and numerous curves. We had to reach a compromise between the legibility and visual accessibility of the interface and the art direction that defines the visual identity of Spire of Chaos: Arcana Unleashed. One aspect not unique to but present in the creation of user interfaces by game artists is their creative ambition. Sometimes, ideas and concepts made during brainstorming end up not working when put into practice. However, each idea and iteration helps to think of and reach a more tangible and functional design in the end. Thus, communication between designers and artists remains key for exchanging ideas and figuring out what is possible or not and reaching a good compromise.
Q&A
If you had to choose a Tarot card, which one represents you best?
Mathieu: the Sun represents well my current situation as it symbolizes life and birth and I just recently became a father!
Nassim: Death, which represents change and liberation. It turns the left card into the right card (Balatro reference, if you know you know).
Which is the best part of Spire of Chaos: Arcana Unleashed in your opinion?
Mathieu: the team! I feel like we’re a truly great team and I’ve had very appreciated support all through the production, especially recently with my newborn baby.
Nassim: our artistic direction and the variety of colours and objects in the environment of each level.
