test content
What is the Arc Client?
Install Arc

Gestalt Psychology and the STO Interface

SystemSystem Member, NoReporting Posts: 178,019 Arc User
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
Post edited by Unknown User on
«1

Comments

  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    I havent even thought about Gestalt since my college Art History lectures.


    .
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    I havent even thought about Gestalt since my college Art History lectures.
    I learned about it in psychology but I suspect I'll hear about it in my humanities course this quarter.

    It's a good set of guidelines to help understand how the brain interprets visual information.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    hehe...I just thought it as something I HAD to listen to to get my degree.


    Studio Artists and Art Historians get along about as well as a TRIBBLE in the car goes over on a first date.


    .
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    hehe...I just thought it as something I HAD to listen to to get my degree.
    At least I'm finding a use for it in "real life" (if the forums count). :D

    What about the ideas? Could the buttons do with a bit more polish to make their use clearer?
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    Yes.

    [][][][]
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    very much so.

    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.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    I love the color difference to be frank. That is why I play with the BO showing since the functions are organized as such. It would be nice if the color extended to the actually icons as well. I'm sure a great many players would appreciate it. I would also like to see maybe a split color or even a toon power tray added so one always exactly what powers they have.

    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...
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    .Spartan wrote: »
    I love the color difference to be frank. That is why I play with the BO showing since the functions are organized as such. It would be nice if the color extended to the actually icons as well. I'm sure a great many players would appreciate it. I would also like to see maybe a split color or even a toon power tray added so one always exactly what powers they have.

    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...
    Supposedly that's a possibility.

    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). :D

    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
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    Definitely think this is a good idea.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    I learned about it in psychology but I suspect I'll hear about it in my humanities course this quarter.

    It's a good set of guidelines to help understand how the brain interprets visual information.


    I learned about it from watching Transformers. The combiners are also called gestalts.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    naphl wrote: »
    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!
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    Love your examples there. The colours and the distinction between the different levels of powers are awesome!
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    I like the idea a lot, though, I myself haven't had difficulty differentiating between one skill or the other.

    Gotta hand it to ya, Darren, you always have a good post thats fun and interesting to read. :)
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    One of the big things I miss about WoW was the ability to completely TRIBBLE with the UI, there are a number of changes I'd make and your idea here, Darren, is fascinating and got me thinking.

    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.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    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 is color cues denoted what system is primarily affected (i.e. hull, shields, weapons)

    • What if icons could be used to denote a more powerful ability from a smaller 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

    That would be great!
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    Overall, I agree with the point you're making, though I don't know that I'd choose to make my icons look quite as you have. Which is why I like to think the best thing they could do is to give us an API for UI customization, much as WoW does. Let the playerbase go wild and customize the look of their interface however they please, as long as it's all just cosmetic changes.

    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.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    Ayradyss wrote: »
    Overall, I agree with the point you're making, though I don't know that I'd choose to make my icons look quite as you have. Which is why I like to think the best thing they could do is to give us an API for UI customization, much as WoW does. Let the playerbase go wild and customize the look of their interface however they please, as long as it's all just cosmetic changes.

    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.
    I agree that inferface customization would be great.

    In fact, user-interface customization is already possible:
    coderanger wrote:
    So the rundown on mods/3rd-party tools. Nothing is particularly preventing people from using our UI system to make mods other than that we haven't said how yet. If you were particularly inventive, you could probably figure it out. The reason we haven't made it public is because the system is designed for our use and nothing more, and it is surprisingly easy to crash your game client with bad UI script. That said, in theory the worst you can do is to crash your client so we have no particular objection to people trying this if they so choose.

    As for making a more robust system that is actually suitable for end-users, we have no objections to this (it wouldn't be able to do anything the existing UI can't do, so mostly this would be reskinning existing UI), but there is no time allocated for it in the foreseeable future. Ditto for making a web API, we all agree it would be nifty, but it isn't a priority so it isn't likely to happen any time soon.

    The rule for all of these things remains the same (and applies to things like macro programs): if using it gives you an in-game advantage such that we need to investigate why you are doing "better" than everyone else, we will not be kind when the ban-hammer starts to swing. Use anything you at your own risk.

    Let the UI scripting language hunt begin! :D
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    I can see what your getting at but I honestly wouldn't want the colour scheme change. To many garish colours so close are not nice for the eye to look at no matter what some strange branch of science you use. The addition of the icons to show skill level are are good inclusion and should be looked into but please, if, and that a big if, the devs decide to go down this route please give us the option of not having it shown in this manner. I and many others are clever enough to know which skills we put where and which key triggers them.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    Summit wrote: »
    Love your examples there. The colours and the distinction between the different levels of powers are awesome!

    The great think is - I purposefully didn't draw anything.
    I merely use hue/saturation->"colorize" settings in photoshop
    or
    copy and pasted the "+" symbol with a drop shadow to make it still pop-out from the interface


    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. :D

    In fact, what if I used LCARS colors for the system differentiation? Though that palette is quite limited.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    ELITE-Kaos wrote: »
    I can see what your getting at but I honestly wouldn't want the colour scheme change. To many garish colours so close are not nice for the eye to look at no matter what some strange branch of science you use. The addition of the icons to show skill level are are good inclusion and should be looked into but please, if, and that a big if, the devs decide to go down this route please give us the option of not having it shown in this manner. I and many others are clever enough to know which skills we put where and which key triggers them.

    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.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    I already made some progess on the UI customization. Managed to turn on and off any specific UI element. Added an interesting, and completely resizable (both X and Y axis) power tray. Resized the stock power trays to hold 10 or more elements. The problem there that you can't put any power to the tray element >10 so it is really no use. Also added a good targeting reticle for FPS mode. And just for fun, revealed the TOS hud.
    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 ;). But adding an extra color layer to show the level of the power is not possible at the moment.

    Oh and as a sidenote, some UI elements can, indeed, crash the client in an instant.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    One more thing: mouseover should indicate which BO the skill comes from just in case you have duplicate skills.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    [*]What if color cues denoted what system is primarily affected (i.e. hull, shields, weapons)

    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
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    I would love for this to happen.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    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.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    Or x for damage?
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    I absolutely agree with the idea of this post.

    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)
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    I actually like the way the colors seem to make it look as well. Not to mention the indicators on bottom for what level the skill actually is ALSO help out in their own ways. I honestly opt this gets adapted into the UI of the game, it would probably help balance out the single color setup I'm getting used to seeing - ALTHOUGH

    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.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    (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)
    Is your tray locked?

    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.
    Sigrid wrote: »
    I actually like the way the colors seem to make it look as well. Not to mention the indicators on bottom for what level the skill actually is ALSO help out in their own ways. I honestly opt this gets adapted into the UI of the game, it would probably help balance out the single color setup I'm getting used to seeing - ALTHOUGH

    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.
    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.
  • Archived PostArchived Post Member Posts: 2,264,498 Arc User
    edited June 2010
    Dear Darren, I have but one question, how many times have you refused Cryptic when they offered to hire you? :D Cause quite frankly, that would be the only explanation as you why STO's interface looks the way it does! They wanted you on-board, and you refused! :p

    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.
This discussion has been closed.