Wednesday, August 6, 2014

Fixing UX Prototype Issues

We sent out an email to our mailing list a few days ago with the first build of our Party Animals prototype.  Up until this point we hadn't shared the html5 prototype with anyone else, and the feedback that we got was very useful.  In short, our game was confusing.  Prototypes are generally cut a lot of slack by people because they are proofs of concept and only used to present the core concept of the game.  So in many cases a lot of user experience issues are not paid much attention to.  This is fine for action games, platformers, and sometimes even puzzlers, but we failed to realize that for a strategy game with a lot of data it's very important to even at this early juncture to have a UX/UI that clearly explains the important data points that the player needs to pay attention to.

Here is a sample of some feedback from Jakub, creator of the excellent indie game Postmortem (which is fortuitously on sale until August 9! I swear it was a coincidence!):

* Love the theme/humor of the whole game and the conversations. Seems like all the city leaders have their own personalities that it would be beneficial to learn and "exploit".
* I know it's a prototype but it needs more tooltips - I was confused by a lot of the numbers and labels, for instance by the High/Lows when I was contesting or educating people... is that my Low/High? Opponent? People's interest? Likewise with some other stats. 
* When I was choosing educate/contest I wasn't sure what area to pick (why does it matter? what do low/highs mean? what affects the outcome? how will it influence the votes?)
* It would be nice to know what affects success/failure rates of certain actions and what my initial stats do (I was still failing in a stat I put 5 in). 

So he likes the theme and the humor, which is good, since that's what we spent most of our effort on in the weeks leading up to the release of the prototype.  Sadly, that meant a lot of stuff was not as tended to as it could have been, including the UX.

Essentially what we did wrong was our data were laid bare and we just kind of hoped that the player would understand it as they played the game.  So for example this screen is showing your stats on the specific issue versus your enemy's stats on that issue by way of gray circles.  The filled up circles are the amount of that stat that has been "filled" by virtue of your candidate educating the population of the Kapitolyo.  The indicators next to the issue labels (ie high/normal) show you how knowledgeable the populace is about that subject, therefor affecting how hard it is to educate them.  But none of that is clarified by this screen or any other screen.  It's just a confusing mess.

So to fix that we asked ourselves, what does the player need to know? This new layout is hopefully much easier to understand (in fact if I have to explain it then we've failed) but for the sake of the blog I'll explain the changes we made and why.  First, we removed the indicators showing the player and enemy stats and the vs between them.  It's not important that the player knows that data, what is important is that they know that each district needs to have the issues that it's concerned about satisfied.  So we labeled the section on the right "Satisfaction" and made it clear that there are only 5 satisfaction circles that the player needs to fill up.  At a glance, the player knows the important information, which in this case is that they have fill up two education circles and their enemy has filled up one Education and one Law & Order.

The indicators for the districts' knowledge have been removed completely.Why?  Because the player doesn't need to know that right now.  Sure, its information that could be useful and you might argue that we might as well show it, but if it's not necessary then it's just visual clutter.  It comes up later on when it's important for that information to be known.

Here's another example of something we changed.  Democracy 3 is one of the inspirations for this game so we play it every now and again to see what makes it tick.  Democracy is such a visually simple game but there's definitely a lot to be learned from it.  For example during every term it shows you how the previous decisions you have made have made an impact on your constituents.  This is represented by a bar that shows their support for you.  If their support for you is waning an arrow pointing left shows up next to the bar, and vice versa if their support is increasing.  I noticed that my eyes were always drawn to these arrows as easy indicators of problems that need to be solved.  It tells the player "here's a problem" then the player can decide whether it's an issue or something that can be taken care of later.  It's also instantly readable, as opposed to the way we previously showed the data, which is by percentages.

I'm gonna plug the game design roundtable podcast here again because they had a recent podcast on information in games, and their discussion really helped me to suss out what ought to be displayed in the game.

Thanks for reading.  If you want to be up to date on the latest Political Party Animals news, sign up for our mailing list!


Party Animals Copyright © 2011 -- Template created by O Pregador -- Powered by Blogger