Deciding on the project

Facing down the barrel of my final year at university, I am inclined to reflect on what I have learnt, as well as the design work I have created thus far. With this GAM340 module being one of my final chances to add to my personal portfolio before entering the industry, I want to take the chance to bulk out an area in design that I feel could use some more attention. This has led me to decide to focus my project around UI/UX, as my previous work has largely focused on systems design, level design, and narrative design.

As a direct way of presenting information to the player, UI has always fascinated me. It is the subtle art of communication between the game and the player, and its implementation can significantly improve or worsen the experience as a whole. One game that I love but feel has a lacklustre UI system is BioShock (2007). This is disappointing as the world of Rapture feels so immersive and atmospheric, with so many elements working together to create for a believable space. By researching effective UI, and learning how to implement it, I would like to see if I can improve on the original’s interface, to bring it up to the level of the world design.

Learning Adobe XD

With the premise for my solo project decided on, it was time to seek out an application that would allow me to best realise my idea. Upon some research it seemed that the Adobe suite of tools would be my best chance at creating something believable, while also getting experience with some industry-standard UI tools. In particular, Adobe XD seemed an especially powerful application for making mock-ups and prototyping functional UI designs. Looking through Behance, there are a large amount of impressive game UI overhauls made with the tool (see the research section for more detail).

Much of my development time at university has been spent in the Unity engine, with its plethora of menus, tooltips and features. This made for a nice change of pace when, upon opening Adobe XD I was greeted with a minimal, streamlined and intuitive interface (fig. 1).

I found a great crash course tutorial on YouTube (DesignCourse 2021), that gave an overview of the program, and showed use cases for many of its tools. By following along with it, I was able to make a prototype web page for a productivity app, with a landing page, testimonies, and contact details (figs. 2, 3 & 4). This tutorial has been a great introduction to the program and introduced me to important UI design principles such as visual hierarchies, and spatial arrangements. As this project develops, I will continue to research these topics and gain better theoretical understanding of UI design.

Research

My research this week began by looking through Behance for examples of other UI projects. One particularly inspiring one that I found was a UI redesign for the indie hit Valheim (2021), which greatly improves on the core game’s interface (Artem Bulhakov 2021). The resulting images make for a much more minimal, immersive experience (figs. 5, 6 & 7). What’s more, the project was also created in Adobe XD, showing the feasibility of my project idea.

I also watched a GDC talk on the evolution of the UI in the Dead Space (2008) series (Ignacio 2013). It was fascinating to see how the UI team were able to keep so much of the interface diegetic. They also employed the use of skeuomorphs to create UI that gives a ‘retro-futurist’ appearance and that feels broken and unpredictable. A key takeaway from this talk was the importance of matching your UI’s aesthetic to the in-game worlds aesthetic to create a cohesive, believable interface.

References

Artem Bulhakov. 2021. ‘Valheim / UI Redesign’. Behance [online]. Available at: https://www.behance.net/gallery/117175741/Valheim-UI-Redesign [accessed 20 September 2022].

Bioshock . 2007. Irrational Games, 2K Games.

Dead Space. 2008. Visceral Games, Electronic Arts.

DesignCourse. 2021. Learn Adobe XD in 2021 by Example (Crash Course) [YouTube tutorial]. Available at: https://www.youtube.com/watch?v=3rQ-eTmWah0&t=5172s [accessed 2 September 2022].

IGNACIO, Dino. 2013. Crafting Destruction: The Evolution of the Dead Space User Interface [GDC talk]. Available at: https://www.youtube.com/watch?v=pXGWJRV1Zoc [accessed 21 September 2022].

Valheim. 2021. Iron Gate Studio, Coffee Stain Studios.