Turn Based Strategy - Good UI Analysis 01
Hi All,
Today we are talking about Turn Based Strategy (Empire Building) Games and what makes good UI. This is the first article in the TBS Games UI Analysis series.
Firstly to be sure that we understand the difference between UI(GUI) and UX.
UI is a User Interface (GUI - Graphical UI). As its name says it is Interface for the user identified by its looks (design), and what action it does (Interface to do some Interaction). While UX is short of User Experience, which is also self-explanatory. That's an experience that a user has while he uses UI while playing TBS game in our case.
On this Civ 5 example, you can clearly see what you should do next, what are notifications to deal with. You see text ADOPT POLICY calling you for most important next action from others possible. All notifications look like rounded buttons calling you for click action to get more info.
The self-explanatory design here is obvious for +1 icon informing you that one of your Cities Grown +1 population, or even more obvious Hammer Icon calling you to select what to build next. While clicking on them will often locate and zoom you on the map or open dialogue with possible actions to additionally help you out with your task.
Tooltips are good!
Even if the UI (like obvious button with clear Icon) is pretty much self-explanatory I think it is always good practice to introduce tooltip when you hold a mouse over it. That way user can be sure what will happen when he clicks it, and if he got something wrong you will spare him of unnecessarry clicking. Especially as those notifications will often disappear after they are clicked.
Therefore tooltips are good, especially as you can put shortcut Keys there that helps player remembers them as an additional benefit. If there is an option to disable it later then it is even better.
But Long text should be avoided even in tooltips. If you cant explain in a sentence or two then something is probably wrong with the gameplay and UI. You can put an additional link to help page about concrete action (like civilopedia) if you want to provide all details, but try to keep tooltip explanations short. They are there so people don't need to go through boring tutorials and remembers what means what, and what it does.
That was brief brainstorming on the importance of Self Explanatory Design and especially Call for Action in good UI in Turn Based Strategy Games, that of course, can be applied on games in general.
If you like this article, stay tuned, as more topics on Good UI will come explaining some other important things like Classification of Info in UI, Responsiveness, Intuition, Management screens...and othe aspects of good UI.
What is your opinion, which TBS Games you find to have good UI and why, let me know in comments, I would like to hear an opinion of real TBS Games fans? Especially if you put a lot of hours in those games, either playing or creating them?
Please subscribe/follow if you like this article and you are interested to read more on TBS Games.
Thank You
BadHabit.
Today we are talking about Turn Based Strategy (Empire Building) Games and what makes good UI. This is the first article in the TBS Games UI Analysis series.
The difference between UI and UX
UI is a User Interface (GUI - Graphical UI). As its name says it is Interface for the user identified by its looks (design), and what action it does (Interface to do some Interaction). While UX is short of User Experience, which is also self-explanatory. That's an experience that a user has while he uses UI while playing TBS game in our case.
Self Explanatory Design + Call for Action
UI is there so you can do something with it, even if it is something passive as to just get Information from it.
A good example of a call for action in TBS Games is NEXT TURN button.
It needs to be well designed, that it's obvious it is a button that should be clicked if it is a desktop channel, or to be dragged if its mobile or tablet of course if that is appropriate for that channel. It should be obvious what it is and how to interact with it on a channel that player use.
One UI for all channels is rarely an optimal experience. It is optimal from a production costs point of view, but that not our topic here.
NEXT TURN button has to be clearly visible and to attract your attention but only when it makes sense to click it. If it blinks, for example, all the time it is same as it not blink at all, except it is maybe more noticeable. You know the saying if everything is a priority then nothing is a priority. That's true with UI design also, for all types of games, not just TBS Games.
Good UI shouldn't call you for action until it is a reasonable time for it. If you have more units to move or things to handle in the city, good UI should not call you for NEXT TURN, it should call you to finish those other things first.
Good UI should guide you through the game flow to makes things easier for you with enough information to help you, but also not limiting you and annoying you by not letting you to do something you want on your own order or way. Of course, this applies only if it doesn't conflict with game rules and mechanics. Good UI Always show only possible actions. If something is not possible at the moment or with current selection it should be clearly disabled, preferably with info on mouse over why, or it should be hidden in whole.
To summarize: Good UI is there to help you out with what you should do and how to do it, and then get out of your way, and don't unnecessarily distract you.
A good example of a call for action in TBS Games is NEXT TURN button.
It needs to be well designed, that it's obvious it is a button that should be clicked if it is a desktop channel, or to be dragged if its mobile or tablet of course if that is appropriate for that channel. It should be obvious what it is and how to interact with it on a channel that player use.
One UI for all channels is rarely an optimal experience. It is optimal from a production costs point of view, but that not our topic here.
NEXT TURN button has to be clearly visible and to attract your attention but only when it makes sense to click it. If it blinks, for example, all the time it is same as it not blink at all, except it is maybe more noticeable. You know the saying if everything is a priority then nothing is a priority. That's true with UI design also, for all types of games, not just TBS Games.
Good UI shouldn't call you for action until it is a reasonable time for it. If you have more units to move or things to handle in the city, good UI should not call you for NEXT TURN, it should call you to finish those other things first.
Good UI should guide you through the game flow to makes things easier for you with enough information to help you, but also not limiting you and annoying you by not letting you to do something you want on your own order or way. Of course, this applies only if it doesn't conflict with game rules and mechanics. Good UI Always show only possible actions. If something is not possible at the moment or with current selection it should be clearly disabled, preferably with info on mouse over why, or it should be hidden in whole.
To summarize: Good UI is there to help you out with what you should do and how to do it, and then get out of your way, and don't unnecessarily distract you.
 |
| CIV 5 - Good UI - Call for Action examples |
The self-explanatory design here is obvious for +1 icon informing you that one of your Cities Grown +1 population, or even more obvious Hammer Icon calling you to select what to build next. While clicking on them will often locate and zoom you on the map or open dialogue with possible actions to additionally help you out with your task.
Tooltips are good!
Even if the UI (like obvious button with clear Icon) is pretty much self-explanatory I think it is always good practice to introduce tooltip when you hold a mouse over it. That way user can be sure what will happen when he clicks it, and if he got something wrong you will spare him of unnecessarry clicking. Especially as those notifications will often disappear after they are clicked.
Therefore tooltips are good, especially as you can put shortcut Keys there that helps player remembers them as an additional benefit. If there is an option to disable it later then it is even better.
But Long text should be avoided even in tooltips. If you cant explain in a sentence or two then something is probably wrong with the gameplay and UI. You can put an additional link to help page about concrete action (like civilopedia) if you want to provide all details, but try to keep tooltip explanations short. They are there so people don't need to go through boring tutorials and remembers what means what, and what it does.
That was brief brainstorming on the importance of Self Explanatory Design and especially Call for Action in good UI in Turn Based Strategy Games, that of course, can be applied on games in general.
If you like this article, stay tuned, as more topics on Good UI will come explaining some other important things like Classification of Info in UI, Responsiveness, Intuition, Management screens...and othe aspects of good UI.
What is your opinion, which TBS Games you find to have good UI and why, let me know in comments, I would like to hear an opinion of real TBS Games fans? Especially if you put a lot of hours in those games, either playing or creating them?
Please subscribe/follow if you like this article and you are interested to read more on TBS Games.
BadHabit.
No comments:
Post a Comment
We would like to hear your opinion, please comment: