Hearts of Iron IV – Development Diary 53 – 2D Art

Source

Hey people, this weeks topic is about the 2d art, everyone’s favourite yay! Let me start by introducing myself, I’m Mats Virtanen, aka Sideburnout, I´ve done most of the 2d art in the game, from the cover, loading screens, interfaces, icons down to the smallest land battle modifier (only made a handful of the portraits though). I´m a classic forum lurker so I seldom post stuff, but rest assured i read as much as I can, the forum is always a good place to check out if I need references, a good laugh or just inspiration.

So, how do you go about to create the graphical profile of Hearts of Iron 4. First of, get in the mood. Glenn Miller is always a nice start Since the beginning i´ve watched countless documentaries, war movies, series like band of brothers etc. Other ww2 games ofc and the team itself! I love the 30-40ies music and wartime posters so these were a natural inspiration too.

So, we knew that HoI3 was a bit… clunky when it came to accessibility and frankly a bit daunting for many because of that. Changing this was our first priority when we started out. With lots of good lessons learned from EU4 and with a UX designer aboard from the start for the first time, a lot has changed compared to HoI3. We skipped the fullscreens and went for smaller windows instead for example, this way you can still keep an eye on the map and it´s really needed in MP. As in EU4 we went for the icon+tooltip solution instead of excel-sheets filled with text. In general we have tried to streamline the interface, ranging from less clicks to reach important screens, trying to show more info from the map itself, using alerts etc, making it easier for the player to play the game and not fumbling around in the UI. One problem we had in EU4 was window sizes in higher resolutions, forcing us to painstakingly recreate bigger sizes of most of the main windows so players would benefit from higher res, ie showing longer lists etc. In HoI4 we solved this by creating all main windows with a tiling background as a basis.

Another change from hoi3 is a more detailed and decorated look and feel, the general windows have this gritty and dark look so the more saturated or detailed icons will pop out more! Speaking about icons, since we skipped the photos this time we knew there would be a lot of them but i was never prepared on the scale of it. The game kept growing and growing and HoI4 now has over 1200 tech, idea and focus icons combined. Over 420 leader portraits and over like 1600 or something different UI elements.

Here is some early concepts of the ui panels, at this stage we were only trying to catch a general feeling.

When it comes to making historically accurate tanks, equipment, leader portraits etc we use all kinds of references. Thankfully the second world war is thoroughly documented with blueprints of basically every kind of equipment used or not-used in the war and it can quite easily be found online. We however take it a bit longer and try to depict how tanks that never even reach the concept-stage would look, ie fantasy-tanks Here we tried to follow the look and feel of the tanks that were actually built, besides searching online for absurd ideas etc, we found some neat references i the forums as well.

We faced numerous problems here and there during the process of making the game obviously but the text would be lengthy if i got into the details, instead i´ll try to answer as many questions as i can in the thread, and maybe we can set up a separate thread with tips n tricks for 2d mods.

Anyway, here’s some tanks!

2D Modding
Ok, time for some technical stuff. Another priority we’ve had since the beginning is to make the game more mod friendly than ever. For this we’ve created some tools and new tech which has been extremely helpful. For example we use a new gui-windowtype called “containerWindowType” which basically uses a tiling background (can use a fixed one aswell ofc) and is vastly superior to our older windowtypes. In this type of gui-element you can set the size in either pixels, or just let it fill a certain % amount of the screen. You can also use overlaying tiling backgrounds, add icons that are centered in a tiling window and so on, you can ofc create containerwindows inside other containerwindows. There is an assortment of tiling backgrounds and overlays ready for use in the game btw. Another new and very nifty thing we use is the gridbox, gone is the days with our old clunky listtypes. The gridbox is tied to a containertype window and works as a gridbox, you can set size in pixels or %amount of parent window, you can set max amount of entries to be shown vertically or horizontally. Ofc the containerwin uses automagic scrollbars, making life a bit simpler

All country specific equipment has a country tag so it’s easy to add new equipment, for example “GFX_USA_tactical_bomber2_medium” = “GFX_countrytag_equipmentname_medium”, just by adding the country tag before the equipment name the game will automagically place your pic in the relevant techtree and every other place the equipment icon is used. When it comes to leaders you’ll just have to go into the script files and change the path to the asset said leader uses.

You can also add generic leaders to the list of portraits this country will use when generating new ones. The file is located in commonportraits Also you will no longer have to search through the gui files for certain elements, we now shift+alt right click on a object and choose open in a small popup to get you directly to the line in the gui where the element is placed. Most changes you make in the gui will automatically reload the interface so no need to manually go in and reload like in our older games. I could go into detail with this for hours but i´ll cut it with this ugly pic instead.

Here´s a quick 3 min “mod” of the diplo win, im using our “guibounds” tool here that shows the size of the element i’m currently hovering over, also seen is the shift+alt right click popup that takes me directly to the right line in the correct gui-file. All i did was resized the windows, the decorative elements and entries are fixed sizes though so here it looks fuggly , you need to make new art or photoshop the ingame assets (old school style) to make it good looking, but i think that there is a lot to choose from ingame if you want to fiddle with ui mods! This is just a super quick mini example of how the new windows works.

I’m really looking forward to see how you’ll mod the game, would love to see some badass total conversions.

Anyways, since i didn’t give you any new gameplay info in this DD i thought i´ll give you two huge wallpapers instead ‘ere you go:

It’s been a really fun yet sometimes bumpy road but we’re nearing release now Can’t wait for it! Keep the sand out of your weapons, keep those actions clear. I’ll see you on the beach.