Game News Colony Ship Update #39: User Interface Improvements

[Infinitron]

Tags: Colony Ship: A Post-Earth Role Playing Game; Iron Tower Studio; Vince D. Weller

Vault Dweller got tired of posting the same screenshots over and over with only incremental improvements, so he skipped last two months' Colony Ship development updates (though check out this "micro-update"). Iron Tower are still waiting on the last of the animations, portraits and armor models before the combat demo can be released, but this month they have something new to show. Behold the latest iteration of the game's user interface:

As you probably know, we're waiting for the missing animations (the once long list has been reduced to two-handed weapons and grenades), portraits (8 NPC portraits to go), and armor (all vests, boots and leggings, helmets, goggles, and gas masks are done; waiting for the jackets and coats, which will be done after all animations are in). While we're waiting, we made some changes and improvements.

- removed all caps from the textbox, added a corresponding skill and level to the weapon slots, the character level, plus replaced words like DMG and AMMO with icons to reduce clutter, added a reaction chance, resized the overhead portraits.
- replaced the disco floor with the movement range but if you prefer the grid you can bring it back via Options.
- still working on the firing range as we need to show both the effective and maximum ranges
- added proper cursors for all occasions (pointer, examine, target, interact, open, climb, etc)
- replaced the old targeting info with a new one (blue - critical, green - hit, yellow - graze, red - miss; pressing ALT gives you a full breakdown of each value)
- replaced the old overhead icons with new ones (the eye shows the effect of your cover, its effect on the enemy's THC; the shield shows the enemy's cover, its effect on your THC)

It's still work in progress, but do let us know what you think.
​

Check out the image captions in the full update for a few extra details. Hopefully they can still get that demo out by the end of the year.

 

[Darth Roxor]

i don't know how the previous version of the ui looked but if these are supposed to show 'improvements' then my god it must have been distilled eye cancer

 

[Sacibengala]

You guys should check out wasteland 3 UI for some tips. :D

 

[Shadenuat]

56% not being exactly in the centre of the circle triggers me so much

 

[Daedalos]

It looks abit messy and cluttered Vince, but I like the improvements. It does need to be cleaned up alot and sleekend up

 

[AbounI]

WTF ? I can't believe it !

http://www.irontowerstudio.com/forum/index.php/topic,7778.msg156110.html#msg156110

 

[Vault Dweller]

i don't know how the previous version of the ui looked but if these are supposed to show 'improvements' then my god it must have been distilled eye cancer

It looks abit messy and cluttered Vince, but I like the improvements. It does need to be cleaned up alot and sleekend up

Suggestions are welcome.

 

[Mustawd]

Suggestions are welcome.

If you are able to post a UI-less image it might make it easier for some creatively inclined users to create a mock-up version to compare against yours. Just a thought.

 

[Fryjar]

i don't know how the previous version of the ui looked but if these are supposed to show 'improvements' then my god it must have been distilled eye cancer

It looks abit messy and cluttered Vince, but I like the improvements. It does need to be cleaned up alot and sleekend up

Suggestions are welcome.

Hey VD,
the game definitely looks great and the latest iteration on the interface is a clear improvement.
Nevertheless, I agree with the sentiment that it is still too cluttered at the moment.

A view suggestions from the top of my head on this when looking at the screens:
- Remove the picture of your char from the bottom of the screen and only show them at the top left. The bottom of the screen is too busy at the moment, and the picture along with the info below it is mostly redundant (move the XP bar to the top left though)
- Showing shield symbols for all possible cover locations along with the two or more red hit/accuracy symbols for all enemies again makes the screen very busy. Hide them by default and make them toggleable on/off by pressing a key. Without pressing the key, only show the context sensitive cover and red symbols when moving the cursor next to cover and hovering over an enemy
- Try not to go overboard with the number of red/green symbols over your enemies' heads, in particular when moving. When moving maybe show the modifications to the to hit chance below the original symbols, you don't need a different symbol for it
- There is way too much info displayed by default when trying to fire at an enemy (big picture, enemy in the middle). The only info that should be displayed by default is the to hit circle, the damage range on top and a red bar without numbers for the enemies' health over their head. With the press of the alt key you can show all the additional info you have right now on the screen (i.e. precise hit points left, ammo etc.)
- Reduce the size of the to hit circle and the to hit number, its unnecessarily large at the moment. Maybe change the red,green,yellow,blue colouring for the different hit ranges (critical, regular hit, graze etc.) to something more harmonized, the contrast is a bit strong, but this is a matter of preference of course
- For the combat log on the lower left, try to tone down the range of colours used for highlighting a bit, having too many colours here can appear distracting from the actual action on the screen. Maybe one different colour from the standard white is enough for highlights. Also a different background shade than the current (transparent?) black would help readability

 

[luj1]

Looks cluttered af

 

[Vault Dweller]

Suggestions are welcome.

If you are able to post a UI-less image it might make it easier for some creatively inclined users to create a mock-up version to compare against yours. Just a thought.

We can't consider a brand new interface at this point, but we'll gladly consider suggestions about improving the existing one.

Nevertheless, I agree with the sentiment that it is still too cluttered at the moment.

It is but it's still work in progress.

- Remove the picture of your char from the bottom of the screen and only show them at the top left. The bottom of the screen is too busy at the moment, and the picture along with the info below it is mostly redundant (move the XP bar to the top left though)

The weapon slots won't look good without the portrait and you won't be able to tell which character they belong it.

 

[HoboForEternity]

WTF ? I can't believe it !

http://www.irontowerstudio.com/forum/index.php/topic,7778.msg156110.html#msg156110

Rest in Peace

 

[Lady_Error]

There is way too much info displayed by default when trying to fire at an enemy (big picture, enemy in the middle). The only info that should be displayed by default is the to hit circle, the damage range on top and a red bar without numbers for the enemies' health over their head. With the press of the alt key you can show all the additional info you have right now on the screen (i.e. precise hit points left

I agree with this. The most important info is the health bar of the enemy and the hit chance percentage. Even the expected damage is not necessary since it can be seen on the bottom in the weapon box anyway. Additional info should come up only when hitting a key (eg. Alt) or you could add an option in the settings to always display more info.

The UI itself:

- I would make the remaining AP more prominent, since it is something you always check in combat. The AP bar should be more easily visible and maybe bigger/longer instead of being just one of the bars below the portrait.

- The "regular shot 4AP" bar should be a button, if it is possible to choose an aimed shot, burst etc. instead. Right now it is not obvious that you can click on it to select something else.

- I would also make this button bigger (since it is more important) and remove the "bolter" and "rounder" bar in the weapon box (doesn't seem like info you need all the time). Or make the weapon image a bit smaller to make more room for the button.

- The remaining ammo is another thing that you check all the time. Right now it is also kind of getting lost among the other info. For example, I liked that in Underrail the remaining ammo is prominently displayed.

 

[Darth Roxor]

Suggestions are welcome.

When I first saw the screens out of context ("ui improvements"), I thought everything there was placeholder. The floating numbers and such in the game area proper don't even bother me as much, but the windows at the bottom of the screen really need changing. "Our UI is a bunch of black screens, 10/10 would design graphics again". At the very least they need some frames, if only to stand out from the game area - since everything here seems to be grimdark, the UI windows meld with everything else, initially I even thought they were half-transparent.

 

[Elhoim]

- There is way too much info displayed by default when trying to fire at an enemy (big picture, enemy in the middle). The only info that should be displayed by default is the to hit circle, the damage range on top and a red bar without numbers for the enemies' health over their head. With the press of the alt key you can show all the additional info you have right now on the screen (i.e. precise hit points left, ammo etc.)

It's also showing the enemy armor DR under the health. We'll trim a bit, but DR information is quite important.

 

[Elhoim]

- The "regular shot 4AP" bar should be a button, if it is possible to choose an aimed shot, burst etc. instead. Right now it is not obvious that you can click on it to select something else.

When you hover over the slots the attack icons appear:

The hover on the attack and you get extra options and info:

But you can cycle through them using the 1-4 keys.

1 is regular attacks (snap, regular for ranged).
2 is aimed (torso, arms, legs, head).
3 is especial attacks (burst, double shot, etc)
4 is reload.

 

[Lady_Error]

Here is a very rough suggestion:

- Weapon images a bit smaller and further apart (seems aestheticically better)
- A good idea would be a sort of metallic border around the boxes, maybe even with a few connecting "pipes" or electric wires between the boxes

- AP bar on top and different color ("End Turn" should probably be more button-like)
- The Level Up experience bar is thinner than the health bar, so as to emphasize the importance of the health bar

- Underneath the weapons the free space can be used for the special attack icons (in that case, the AP bar on top can be stretched all the way across the weapon images)
- Or you can use the free space under the weapons to display the total and remaining bullets or the energy bar for the weapon (similar to Underrail)

 

[Fenix]

 

[Ismaul]

The Level Up experience bar is thinner than the health bar, so as to emphasize the importance of the health bar

Let's go further: why have an XP bar at all?

It's irrelevant for tactical gameplay. And I'm sure the detailed info (current XP and XP required for the next level) is displayed in the character screen. I don't need to see that info all the time, it's not an XP grinding game.

 

[Flint]

Most labels for bars (hp, ap, xp) are closer to the wrong bar. "HP 37/40" is closer to the AP bar than to the actual health bar. This reduces readability as eye gets confused about what labels what. It will look much cleaner if you move text a few pixels closer to the respective bar. Same with the lvl/hp/ap sandwich at the bottom.

I think it is even better to switch labels and bars around, like in my third example. Looks more natural to me to have the bar already labeled when scanning from top to bottom.

 

[AdolfSatan]

Here's a mockup of how I think it could be cleaner

Alternatively, put all of the info below. Text panel on the lower right (expanding upwards), and turn order on the now empty lower left.

Most of the extra info (grazing, possible covers, etc, should be toggled on held button, not shown at all the times). I'd also eliminate clarifications like hold alt button for extra info that only need to be seen once. Say it in the manual, do a tutorial, whatever you want, but don't make me read the same tidbit when I'm going for my hundredth kill.

I'd take it easier with the neon glow marking the moving area too.

When you hover over the slots the attack icons appear
The hover on the attack and you get extra options and info
But you can cycle through them using the 1-4 keys.

While I wouldn't remove these options, I'd allow for attack selection upon rmb wherever the aim is.

 

[AdolfSatan]

Also, this might seem dumb, but weapon orientation as shown in portrait makes a huge effect on how the player will feel. Bear this in mind when designing the UI as well.

In FO 1/2, some balance was achieved by keeping them more-or-less horizontal.

 

[Shadenuat]

it is easier to read info on the upper right corner

No it isn't

now I don't want to bring up Pillars as example of anything but I'd say portraits at bottom left ui-center and text-right is pretty standard spread and works fine.

ToEE also did this with Initiative on top

 

[AdolfSatan]

Seems you answered before I managed to squeeze-in my edit. I mentioned that same distribution as an alternative below the picture.

 

[Deleted Member 22431]

Wrong thread.