1 - Unit names are repeated multiple times.
2 - Die rolls ("4,3,6,2") and results ("attacker hits=2") are intermingled with no structure.
3 - No visual cues to distinguish "good" from "bad" events. Skimming is impossible. You have to actually read carefully.
4 - Events that affect the attacker and the defender (or, alternatively, the player and the opponent) are intermingled.
5 - Intermingling of text, numbers, and symbols (eg, "=") makes the text hard to read.
6 - The "status information" panel is too small to hold all the information from a combat. There is no visible scrollbar (even though scrolling works) so it's not clear to the user that they can interact with it.
7 - Point 6 means that the verbose information linebreaks at unhelpful places, further cluttering up the panel.
8 - During the enemy's turn there is no way to pause the game, so the panel is flooded with detail that no user can possibly read. This problem gets worse in larger games.
Here are some suggestions to make it better. I'll be trying to address all of the above except point 8.
Let's start by looking at an example of what a combat looks like today:
This is the prototype of the unreadable verbose information panel. It's so busy that I can't even begin to explain which parts of it I don't understand, because I can't even parse it. It doesn't all fit in the panel at once, so if you want to actually read it, you need to scroll through three vertical screens of information.
Let's make it better. We're going to do this in three phases, separated roughly by how difficult they would be for the developer to improve.
Phase 1 will be adding just a little bit of color to the important numerical results to make them stand out.
Phase 2 will be adding structure to the text.
Phase 3 will be adding some very simple graphical elements.
After phase 3, we can take a break and people can chime in with comments, and suggest further improvements.
PHASE 1: Use of color.
Just doing this makes it much more clear what the heck happened. However, some men are red/green colorblind, so let's do a mockup using cyan/orange instead of red/green:
Personally I think the red/green version is punchier and more clear, but you'd probably want to let colorblind users have a switch in the settings for accessibility.
PHASE 2: Organization.
This is still a torrent of information all jumbled together. Let's organize it in a semi-tabular form to be more useful.
Just by doing this we get a few immediate benefits. First, we don't have to keep repeating the unit name (which can be long and bulky) over and over and over again. Second, the user can tell visually which results apply to which side -- "I am on the left, and my opponent is on the right." Thirdly, we've gotten rid of a lot of the symbols ("x=y") because the relationship is implied spatially.
PHASE 3: Images
We can push this further by using images in place of the numerical die rolls. Doing that immediately draws the users' eyes to the die rolls, eliminates the need to have text explaining "this is a die roll", and lets them interpret the result intuitively, via pattern-matching:
I've highlighted the "successful" die rolls here with an outline. Whether or not you'd want to do that in practice I'm not sure, but I wanted to see how it would look. I also eliminated the "DR=0" non-die roll completely, although I guess if you felt it was important you could use a glyph of a blank d6.
Here's the same mockup, only this time in green/red instead of cyan/orange:
Now that we have something actually readable, I can immediately form the question "What does the die roll in the cohesion test actually do? What does the [-1] mean? Is that a modifier, or the total result?" Phase 4 of the process would be specifically visiting just the cohesion tests and reformatting them to be more comprehensible.
But, before I do that, I think it's time to take a breath and ask people (and, especially, the developers) what they think.
Regards,
peter
