TheGatewayOfRealities
patreon
UI Redesign + New Weapons
🕑 Added 2018-08-13 06:01:58 +0000 UTCThank you!
First of all, thank you for supporting our project this month! With this fuel we're able to make yet a next step towards the big upcoming pre-alpha release. Just can't wait till you, dear patrons, can play it and see for yourself how far we've come from the last version!
UI Redesign
The current interface and HUD for the game isn't great... (I don't even want to show a screenshot of the old version D: )
Reason is that stuff was just added as need arised, elements and code piled on top of each other without proper direction. It also was repurposed multiple times to suit different gameplay ideas we were trying out in the beginning. It didn't support 4K resolutions, got pixelated, and after last engine update it just got totally broken!
So yes, it's definitely time to tidy things up for the next release and make a total overhaul of HUD and UI. That's why in this post we're introducing the new, minimalistic, futuristic, scalable, UI!
Vitals & Status Effects
Starting off with the most important HUD element - the "health bar", well it's a bit more than that. Firstly it displays 3 all-familiar stats (HP, EN, ST).
The red one (HP) is named "Aura" because it's not health exactly - it is your personal force field shield which protects you from various harm and acts as an invisible environment suit.
The actual health starts to take damage after shield is depleted, and it isn't measured in points, instead the damage will be represented as persistent injuries and diseases, which player will need to heal individually.
Those are essentially "debuffs", negative status effects, which you can see on the right side - they are also useful to let the player know if their character is hungry, uncomfortable in the current environment, got mud or other sticky stuff all over themselves, if for some reason player didn't notice that directly on the character's scales.
The 5 little bars on the bottom represent various values from body simulation, which is yet to be done.
Weapon & Quick-Access Items
The first box shows information on what weapon/tool is currently equipped, what augment it has inserted in (and how much durability the augment has), as well it shows ammo and status of other weapons.
The second box shows the selected item from the quick access inventory, letting you select and use consumables on the fly.
The weapon augment system is something I haven't talked about. I'll make a dedicated post about it later, but in a nutshell, those are special items, similar to runes in fantasy RPG games, which are inserted into gear to boost stats or alter it.
Chat
Any multiplayer game needs some form of communication, so we made a text chat with support of channels, global and local chats, and private messages.
Even though it doesn't look too complex, its packed full of functionality, which is important for players who like to roleplay a lot. And it has autocomplete for all system commands - tech savvies will feel right at home!
Right Panel (Inventory)
The inventory layout is similar to the previous release, however now it will have a much better and stylish appearance. We're also playing with the idea to let players reorder the sections of inventory manually, as well as collapse unused ones.
Item information is displayed when player hovers the cursor over them (or selects with the controller), it instantly pop-ups tooltips like this one:
There are also other tabs for simulation and knowledge tree, but those are not designed yet, so I don't have anything to show for this atm...
Action Selection
I've been trying to come up with a good design for this menu for a very long time.. I've done dozens of sketches, thought about numerous ideas, but none of them were "good enough". Some of them had a complicated nest structure, others displayed grids which would reorder themselves based on frequency of usage... Yeah... you see where it's going...
Then.. one day... I played a game called Prey (its very good) and as I got my action wheel populated with more items and skills, something truly amazing suddenly happened... The wheel formed into a spiral!!! A sudden beauty of simplicity and ingenuity of the UI design really got to me, and I was like "That's it! I've come up with a new recipe!".
Here is a reddit link of that wheel in action from Prey https://www.reddit.com/r/prey/comments/69vpqu/the_favourite_wheel_changes_when_filled_so_good/
Well, you might think "ah you're stealing ideas now" - No I'm not! I'm inspired by this, just as well as by other games. The menu concept still looks different from Prey and it's tailored for our needs.
The primary purpose of this menu is to offer a selection of actions you can perform on the ground, objects and other characters. From picking up twigs to mating - actions are everywhere.
Main Menu & Customization
And, don't forget the menus! When you press that esc button, a thing pops up that lets you control the game itself!
Needless to say, this is a pretty self-explanatory screen, it just also badly needed a change. Like the idea from before, the game starts with the Gateway floating in space and your own personal character standing in it. From there various buttons will take you places.
One of such places is settings, the concept above is merely just a representation of different button types, building blocks for later, not the actual layout of gameplay settings. From top to bottom:
- Name: Text input field
- Color: Color pickers (only hue and saturation XY sliders)
- Theme: Radio buttons (I don't think we'll be making actual different UI themes)
- Resolution: Drop-down box
- FOV: Float slider
- Delay: Integer slider
- Disable in combat: toggle-button (same as a checkbox)
- Sensitivity: Another float slider (displays fractions instead of whole numbers)
The customization screen uses similar elements as settings, that's the beauty of modular design, however there are additional button types. Unlike the previous example, this is roughly how a customization screen will look like in the end (but with more options).
Firstly, there are pickers of various unlockable content objects: skin patterns, color gradients, anatomy bodyparts, clothing, etc. Once a button with a left facing arrow is clicked, it will display a grid of options (at the time of writing this post the grid wasn't completed, I just couldn't wait another day longer and hold off on all that)
Secondly, the color gradients offer some control over them, if user clicks on the colorful boxes they will be able to change Phase and Bias (those are big math words, we're probably going to replace them with something more user friendly), represented as white crosshairs over the boxes. Moving them changes the gradient preview strip on the bottom, and changes the nature of the color applied to character itself... Sounds complicated, but you'll understand immediately after trying it out once.
And lastly, for each bodypart (and clothing) there is a little palette and brush icon, which, once clicked, will lead you to the customization of that specific bodypart - where, for example, head colors can be changed independently from body colors (or be chosen to be automatically set the same, inherited) and further bodyparts (head features, horns, hair) can be selected.
New weapons (wip)
And lastly, a little sneak peek of the new weapons, still work in progress, roughly blocked out, but those will be important in showcasing all the combat related mechanics we've done so far, so they might as well look like actual weapons and not placeholders!
