Gestalt Psychology and the Star Trek Online Interface
building a better user-interface using psychology
Background:
The interface has gone through several revisions since it was internal beta, closed beta, open beta, and even after launch.
There was a time when the interface was colorful with very busy (but very pleasing) buttons.
This was replaced by single hue buttons.
Unfortunately, a lot of principles behind intuitive interface design are lost.
If you put the icons for Engineering Team I and Engineering Team III side-by-side, they look identical.
Bridge Officer skills that affect different systems look very similar too - with only small details to let you know which is which.
This is a sore spot in STO's other-wise impeccable changes to the user-interface.
A Simple, 2 Question Test:
Consider the following test image I created, comparing STO's current set-up to my own ideas:
- What if color cues denoted what system is primarily affected (i.e. hull, shields, weapons)
- What if icons could be used to denote a more powerful version of a skill from a lower one?
If you think the row of modified buttons I created is easier to understand, you've just learned a basic lesson in psychology: Gestalt's principle of similarity - that our mind groups similar shapes together and separates dissimilar shapes
Comments
.
It's a good set of guidelines to help understand how the brain interprets visual information.
Studio Artists and Art Historians get along about as well as a TRIBBLE in the car goes over on a first date.
.
What about the ideas? Could the buttons do with a bit more polish to make their use clearer?
[][][][]
the whole UI needs work IMO.
the amount of blue seen in this game via the interface, buttons, interiors, etc...is way over the top.
the UI should be an easy fix, its just image skins I am assuming.
I just hope they do it sooner than later....maybe season 2 will have some improvements? if not...the wait will be long I'm afraid.
my wish is to be able to set the overall UI theme to whatever scheme I choose.
In short the UI is pretty raw yet methinks. I so wish they would allow us to create our own. I would love to have a Romulan themed one! I'm sure the community could come up with pretty good ones. Of that is provided that a much better UI is not already done but being saved as a Store item but I digress...
However, we haven't be given the go ahead to do so.
It'd be great. I"m sure a few intrepid players could do it (I'd help).
Check this out to see some of the more colorful choices:
http://www.youtube.com/watch?v=o8xmHnTz_M0#t=2m40s
Larger inventory buttons, more color, and even animated bridge officer faces in panels:
http://www.youtube.com/watch?v=o8xmHnTz_M0#t=0m44s
I learned about it from watching Transformers. The combiners are also called gestalts.
Well, we are getting saucer separation some day.
Galaxy Class: Battle Bridge in Disguise!
Gotta hand it to ya, Darren, you always have a good post thats fun and interesting to read.
I'd like to see the columns sorted by system, so that I can easily see which skills fall under which system and line them all up in a row, since I rarely have more than 3 it would fit... except when I try to line them up there either isn't enough space (because I can't play with the tray's scale).
I'd like to see tray labels for systems, so I can easily tell what's going to be affected by a cooldown. I often can't remember what a skill belongs to in the thick of a fight, so I might use a skill first and realize the one I wanted to follow it up with is now in cooldown because there's no easy way to tell which skills are on the same system until after you use one of them.
I'm too lazy to mock up a screenshot, maybe I'll do that later this weekend. Nice work, but I'd like to add that placement and framing is just as important to me as coloration.
That would be great!
This also takes some portion of the workload off the dev teams plate and gives it over to enterprising players. The dev team still has to develop, document and maintain the API, but once that's in place, I wouldn't expect it would take huge effort to keep it up-to-date with any actual changes in the way the client UI functions. (I'm assuming that such changes are likely few and far between, though I could be mistaken.)
I'm sure that, given the tools to create such customization, the players would turn out some very impressive alternate UI looks. (And likely a lot of not-so-impressive ones, but that's the way of things. Presumably someone would start uploading and sharing the things, and we could pick and choose the ones we like, or create our own.)
EDIT: Though this topic might fit better in the Feedback/Controls and User Interface section.
In fact, user-interface customization is already possible:
Let the UI scripting language hunt begin!
The great think is - I purposefully didn't draw anything.
These are extremely easy changes to make.
I'd do a pass for every bridge officer power icon in game, for free, Cryptic - if you'd make it a selectable option.
In fact, what if I used LCARS colors for the system differentiation? Though that palette is quite limited.
I completely agree.
I only made the changes as an example (not something I'd expect forced on players).
However, as an option, it'd be appreciated (just an optional ability).
Some may prefer the colors and others may prefer a single hue but having another option wouldn't be so bad.
I realize that the different color bridge officer mini-trays and their sequential order are also a factor in determining use but this is lost when selecting skill tray option #3 from the lower right-hand side of the screen.
The problem I face now that I can't make parent-child linking. The genaddwindow has only 1 input parameter and puts the element directly to the root. Also I can't seem to create new jails. Or change the positions of elements on the jails.
I somewhat familiarized myself with the STO UI scripting. It is a pretty standard script, however you can't change the bin file so I can't apply changes at that level right now. I suspect that you may be able to use a plain text overwrite/extension file, but I don't know how at the moment.
Re-coloring the power icons is very easy
Oh and as a sidenote, some UI elements can, indeed, crash the client in an instant.
Great, though the colors should also be user definable. I do have to commend you for your image. I was all set to tear into the idea about the number one rule about designing user interfaces: Never rely on color contrast otherwise you neglecting color blind people" but the colors you chose would be distinguishable by the most common form of colorblindness. If you threw green in, then I'd have a much stronger point of contention.
Color contrast is definitely a good. But like I said, it should be user definable to aid in those who are colorblind. This has already been an issue brought up before and I've done a small part to try to suggest a color labeling scheme to help the colorblind know how to at least avoid mismatching colors for those that care about that sort of thing.
Also, there should be something visually different as well. Might I suggest cutting notches off of the corners of the buttons to symbolize skill rank as well? At least then there's something physical beyond just color to describe the ranks.
(edit) scratch that last part, the +s you used are a much better idea
Some suggestions:
+ for heals
O for damage
^ for buffs
V for debuffs
+ = ensign
++ = lt.
+++ = ltcommander
++++ = commander
even the symbol plus the slot (1, 2, 3, 4) would be appreciated for those using the non-minitray example, i.e. +1 through +4.
At the moment I only which skills I click because I remember their position on the tray. Whenever that changes for some reason (new rank/tier) I'm completely lost for a while. Different hues would be great (even though I wouldn't make them as drastically different as in the OP's suggestion).
I also agree with the need of a skill rank indication. And showing which officer grants you a skill in the tooltip would be nice as well.
(And while we're add it. I'd like the option to remove buttons from your tray. It's either not there or I'm too stupid to find it)
What color would abandon ship become? >.> the one skill that few of us use, however have found chances to do massive damage with in some highly indirect way.
Hit "P" and make sure the box is unticked.
From there you should be able to drag powers off or right click(I forget which) on you tray.
BOff minitrays can't be edited - that I'm aware of.
Presumably - there'd be a neutral color. I'd say cover the big three: weapons, hull, shield - and leave everything else in a fourth, neutral color.
Any more than that and it starts to get unintuitive (i.e. does light purple do something different from lavender?) etc.
Just as there's not enough color sorting - there can be too much.
OK, kidding aside, this is again, another excellent idea which I thoroughly and wholeheartedly support. To Cryptic's defense, I can only say that they were probably too busy adapting their engine technology to think about making their UI actually intuitive.
I'm hoping Cryptic reads this thread and adopts your idea.
EDIT :: If you examine the power-set icons in City of Heroes/Villains (two older games made by Cryptic) you can notice they've put this idea into practice, so I'm sure it's possible in STO as well.