UI Design
Player UI
Technical Summary:
Throughout Beta, we tested several different styles for the UI, originally settling on something that covered the whole of the bottom of the screen. We took inspiration from the original Doom with this design, originally wanting the bottom middle to be the face of the Martian and expressions depending on what was happening in the level. We wanted to also have the Stamina and Invisibility as circular bars to fit with the Sci-Fi style. Another addition to this UI is the Mini-Map and the Compass Bar. The Mini-Map is attached to the player capturing the scene from above them and changing that into a texture designed for the UI. The compass bar uses a single image that moves with the player camera as well as being used to add markers, which in the above image, was used for specific landmarks.
However, as we continued through Beta, we decided we weren't big fans of the UI element, taking up to much of the screen. We did test with making it smaller, but it just didn't look right. After much deliberation about the Player UI, we settled to just go for a more empty look, feeling similar to the simplicity of Alpha.
Reflection:
The Player UI proved to be quite a difficult element for our game. We never really felt like we had a clear vision or understanding for what we wanted to actually achieve with this element. The original design achieved at the start of Beta definitely has some style to it and feels very immersive, but also plain. I think it was interesting to test with the shape of the progress bars to see what worked and what didn't work, but the typical horizontal bars work better in my opinion. I also think that the uses of the Mini-Map and Compass Bar are quite useful to the player, but need a more designated home and design to them. Personally, I think the Compass bar looks out of place being so far down from the top of the screen due to the position of the timer.
The Market
Technical Summary:
For the most part, the Market UI has changed very little from the end of Alpha, the changes were more in line with now having appropriate renders to display all the items for the player to see. Because we had used stand in images for the UI, I had to make sure that the UI correctly lined up with the item selected by the player to prevent confusing them as to what they were seeing and reading.
Reflection:
I think the only thing holding the Market UI back from looking good is changing the blank white box that appears when the UI is created to be invisible and then change with the selected item, just to keep it inline with the overall style. An issue I've also realised is that the Metal Gauntlet is spelt incorrectly, and has been for a considerable amount of time, so checking the spelling of several other UI is definitely in order to make sure the player can easily understand what they are reading.
Crafting
Technical Summary:
Likewise with the Market UI, very little changed between the different phases, other than the images for the player to view the items they can craft, ensuring that all the items correctly lined up with the selected image. This was to prevent the player from getting confused with what they were looking at and selecting to craft.
Reflection:
I think similarly to the Market UI, the image box needs to be transparent and then change to the selected item, so that the immersion of the UI isn't broken, as well as changing the crafting button to have text and change when hovered over. I also think the UI doesn't really fit the overall aesthetic, like the Market or the Main Menu, it could really do with some style enhancements to make it seem more significant. This UI could definitely benefit for some sounds for when you select an item and when you have crafted the item, since you still rely on seeing the "NOT ENOUGH MATERIALS" string appearing on screen.
Inventory UI
Technical Summary:
With the Inventory UI, we finally added images to all the remaining items to finish the consistency between the Market and Crafting UI and to help the player correctly associate the different items between what they are used and needed for. More significantly, we added the ability to select a specific method that comes with its own compass markers and objectives to follow, this allows for us to give the player more guidance to the method they are following, rather than the vague paragraph alongside each method. With the level also changing with every addition, we updated the map to be a static render of the map from above so that the player could navigate it a lot easier. The Map itself is the rendered look of the current map, which I brought into Photoshop to crop down and add the numbered markers to help the player navigate the environment.
Reflection:
I think similarly to the other UI images, the UI needs to have the white box invisible to make it fit with the overall aesthetic, as well as having the Escape Method tab have an indication as to which method has been selected by the player. Something that could also benefit from a change is the Map image, having a real time view of the level so that the large ship isn't always in the way, and help the player see where each NPC or Enemy is currently at and removes the confusion of seeing both Day and Night markers during the day.