THE PREVIOUS DESIGN
Trade interface with Trade window for Portugal open.
In Hearts of Iron 4 one of the most recurring action a player is doing is to trade for resources. The Trade interface is used to conduct trade of Resources between nations within the game. By trading a Resource with a country the player reserves some of his/her Factories to the country that delivers the Resources. Factories are used for constructing buildings (Military Factories, Forts, Naval Bases etc).
In order to conduct trade with another country the player goes through these steps shown in this flowchart.
Nations that has no connection by land to each other have to also use Convoy Ships to receive their goods. Convoys are also used for transporting and supplying troops. How many ships are required for the trade with a nation varies.
How much Resources the player can trade for depends on what Trade Law they have and how high opinion all the other nations has of the player's nation (Influence). E.g. if France and Norway wants to trade with Spain and France has a higher Influence than Norway then France's trade gets prioritized over Norway's. Meaning that if Spain don't have enough to fulfil the trade to both countries then France gets the Resources first and Norway gets what is left.
Opinion is based on things like if two countries has the same ideology (Fascist, Democratic, Neutral or Communist). The higher the Influence the more inclined a nation is to trade away a higher sum of it's Resources. The player is able to sort the list by Resources, Countries, Influence, Trade Law, Export and Delivered.
The flaws to be solved and redesigned.
What this interface was lacking was a clearer way of presenting all the Resources (how much of each is available, how much is needed etc) and a better choice of what information to show the player at what time and where.
Visualization of Resources:
How the Resources were shown you got a lot of repetition with the text that list things like Produced, Imported and so forth. Having the paper background and then the black text together also made it very hard to distinguish each text entry. Unless you looked directly at the numbers it was very hard to see if you had a surplus or deficit of a Resource.
The six Resources in the game and their stats. Whenever a Resource is missing a sound effect plays and a small notification comes up at the top of the screen.
Trade screen where some Resources has a surplus or a deficit.
In the image above there is a deficit of Tungsten and Steel. The black text on the golden brown paper however makes it difficult to at a glance see which row of text indicates what.
The amount of Factories that were traded away for Resources was also cryptic. Fore one thing it used the terminology “Traded Goods” to display Factories that were traded away or available. A term that is never used elsewhere in the game.
Factories used for trading.
In the image above the player has in total 21 Factories and 20 of them are traded away, the last one is available. To count the Factories as “traded-away/available” is unclear, especially if you look at it for the very first time. Hovering over it would display a tool-tip that elaborates on the information however, but that was information you would only get if you knew you could do that and it required an extra step to get that information (hover mouse over the text).
Trade Law and Influence:
The Trade Law entry is unnecessary, because during a session an AI controlled nation very rarely changes Trade Law and what it effects is the amount of resources available for trade. So the information that the player is mainly interested in is how much a country has of a certain resource, not why they have it. The whole space that is occupied by the Trade Law and it's icons can therefore be allocated to something more useful to the player.
As for Influence it's importance in the interface is also rather questionable. It decides which country gets the first share of a traded Resources. The countries were the player usually have a low Influence level are countries that the player are at war with or plan to be at war with and would therefore not want to trade with them anyway.
Contries with two different Trade Laws (Free Trade and Export Focus).
There is nowhere where the player can filter by how many Convoys a trade will cost. If the player is in a situation where e.g. Steel is in high demand and the only countries that have Steel require convoys to trade with. On top of this the player have a lot of troops that needs to be transported and supplied. In this case the player would most likely desire a way to sort by Convoys required in the Trade screen. This was not possible in the old interface.
FIlters for countries.
Another option that was missing from the interface was the ability to sort by subjects. If you play as a country like Great Britain who has several "subject states" like Canada, South Africa, India and Australia, you would maybe in some cases want to only trade with them because the trade would then only benefit you and your subjects (you get the Resources and they get your Factories).
What my redesign resulted in.
To improve upon this interface I first looked at how I could improve the representation of Resources and their statistics. As mentioned earlier there was a lot of repetition in having a separate stats window for each Resource and it took up a lot of extra space. Not to mention how unclear the status text was.
In the sketching process I ended up with two iterations; one still trying to reuse many of the old design's esthetics and another that restructured many of the old elements.
Iteration A. Redesign with old elements.
Iteration B. Redesign with new and restructured elements.
Iteration A had the same boxes for each Resource, but replaced the paper background with a plane black color, displayed the total amount of each Resource that was available and replaced Surplus/Needed with Used. With this the player would be able to see how much of each Resource was drained from usage (producing equipment) and see the surplus/needed amount next to the Resource name. Trade Law and Influence was removed and replaced with Convoy Use. Trade Law and Influence info was still accessible via a tool-tip that came up by hoveringthe mouse over each Country.
Trade Law and Influence tool-tip.
Iteration A did however not solve the issue with repeating the stats for each Resource. Iteration B followed the same steps as Iteration A butt it condensed the Resource panels into a single horizontal spreadsheet, thus solving the problem with repetition and also reduced the amount of text in the interface.
So the final changes to the interface resulted in the following;
Redesigned Trade screen
Trade screen close-up.
Produced has been changed into Extracted in order to differentiate it from the new entry Production and to better represent what it actually symbolizes (e.g. metals are mined from regions on the map, not produced).
The redesign of the Trade interface was a satisfactory change to the previous interface. It made managing the trade of Resources better by rearranging the structure of the interface, freeing up space and giving more options to work with.