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

Sideburnout

2D Artist - Paradox Development Studio
1 Badges
Jan 14, 2013
59
289
  • Stellaris Sign-up
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.

3RR42ld.jpg



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


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 :D 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!
UdsMAB5.jpg



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 \common\portraits 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.

VmpC0jc.jpg



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 :p 'ere you go:





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

Yorkie-GBR

Kingmaker
93 Badges
Oct 23, 2012
797
325
  • Commander: Conquest of the Americas
  • Heir to the Throne
  • Europa Universalis IV: Wealth of Nations
  • Europa Universalis IV: Conquest of Paradise
  • Magicka
  • Divine Wind
  • Europa Universalis III Complete
  • Europa Universalis IV: Pre-order
  • Europa Universalis IV: Res Publica
  • Victoria: Revolutions
  • Crusader Kings II
  • Sword of the Stars II
  • Victoria 2: A House Divided
  • Victoria 2: Heart of Darkness
  • Cities: Skylines
  • Europa Universalis IV: El Dorado
  • Mount & Blade: Warband
  • Cities: Skylines Deluxe Edition
  • Sword of the Stars
  • Mount & Blade: With Fire and Sword
  • Crusader Kings II: Way of Life
  • Europa Universalis IV: Common Sense
  • Crusader Kings II: Horse Lords
  • Cities: Skylines - After Dark
  • Europa Universalis IV: Cossacks
  • Crusader Kings II: Conclave
  • Cities: Skylines - Snowfall
  • Europa Universalis IV: Mare Nostrum
  • Stellaris
  • Hearts of Iron IV Sign-up
  • Hearts of Iron IV: Cadet
  • Stellaris: Necroids
  • Europa Universalis III: Chronicles
  • Crusader Kings II: Charlemagne
  • Crusader Kings II: Legacy of Rome
  • Crusader Kings II: The Old Gods
  • Crusader Kings II: Rajas of India
  • Crusader Kings II: The Republic
  • Crusader Kings II: Sons of Abraham
  • Crusader Kings II: Sunset Invasion
  • Crusader Kings II: Sword of Islam
  • Europa Universalis III
  • 500k Club
  • Europa Universalis IV
  • Europa Universalis IV: Art of War
  • Europa Universalis IV: Call to arms event
  • Europa Universalis III Complete
  • Europa Universalis III Complete
  • Victoria 2
  • Warlock 2: The Exiled
That U-Boat wallpaper is great :)

ps: is your Forum title messed up, or is that intentional?
 
  • 25
  • 1
Reactions:

Gort11

Field Marshal
80 Badges
May 22, 2011
4.141
2.045
  • Victoria 2: A House Divided
  • For the Motherland
  • Hearts of Iron III
  • Hearts of Iron III: Their Finest Hour
  • Heir to the Throne
  • Leviathan: Warships
  • Magicka
  • Europa Universalis IV: Res Publica
  • Semper Fi
  • Crusader Kings II: Charlemagne
  • Victoria 2: Heart of Darkness
  • Warlock 2: The Exiled
  • Crusader Kings II: Jade Dragon
  • Europa Universalis IV: Third Rome
  • Tyranny - Tales from the Tiers
  • Stellaris: Leviathans Story Pack
  • Stellaris - Path to Destruction bundle
  • Europa Universalis IV: Conquest of Paradise
  • Crusader Kings II
  • Crusader Kings II: Legacy of Rome
  • Crusader Kings II: The Old Gods
  • Crusader Kings II: Rajas of India
  • Crusader Kings II: The Republic
  • Crusader Kings II: Sons of Abraham
  • Crusader Kings II: Sunset Invasion
  • Crusader Kings II: Sword of Islam
  • Divine Wind
  • Europa Universalis IV: Wealth of Nations
  • Europa Universalis IV: Art of War
  • Europa Universalis III: Chronicles
  • Darkest Hour
  • Europa Universalis III
  • Hearts of Iron IV Sign-up
  • Crusader Kings II: Monks and Mystics
  • Hearts of Iron IV: Together for Victory
  • Warlock: Master of the Arcane
  • Europa Universalis IV
  • Tyranny: Archon Edition
  • Europa Universalis IV: Rights of Man
  • Crusader Kings II: Reapers Due
  • Hearts of Iron IV: Colonel
  • Hearts of Iron IV: Cadet
  • 500k Club
  • Stellaris
  • Victoria 2
  • Crusader Kings II: Conclave
  • Crusader Kings II: Horse Lords
  • Europa Universalis IV: Common Sense
  • Pillars of Eternity
  • Crusader Kings II: Way of Life
I like the little touch where all the tank icons are heading toward the battle, except for the scout tank which is going in the opposite direction.
 
  • 9
  • 1
Reactions:

Adige

Spray and Pray Lord
70 Badges
May 13, 2011
274
133
  • Hearts of Iron III
  • Heir to the Throne
  • Iron Cross
  • Europa Universalis III Complete
  • Semper Fi
  • Supreme Ruler 2020
  • Deus Vult
  • Darkest Hour
  • Battle for Bosporus
  • Cities: Skylines
  • Europa Universalis IV: El Dorado
  • Mount & Blade: Warband
  • Mount & Blade: With Fire and Sword
  • Crusader Kings II: Way of Life
  • Europa Universalis IV: Common Sense
  • Crusader Kings II: Horse Lords
  • Europa Universalis IV: Cossacks
  • Crusader Kings II: Conclave
  • Victoria 2
  • Hearts of Iron IV Sign-up
  • Hearts of Iron IV: Cadet
  • Crusader Kings II: Reapers Due
  • Europa Universalis IV: Rights of Man
  • Hearts of Iron IV: Together for Victory
  • Crusader Kings II: Monks and Mystics
  • Cities: Skylines - Mass Transit
  • Europa Universalis IV: Mandate of Heaven
  • Hearts of Iron IV: Death or Dishonor
  • Europa Universalis IV: Cradle of Civilization
  • Victoria 2: Heart of Darkness
  • Crusader Kings II: Holy Fury
  • Europa Universalis IV: Golden Century
  • Imperator: Rome
  • Hearts of Iron IV: Expansion Pass
  • Hearts of Iron IV: La Resistance
  • Crusader Kings III
  • Europa Universalis 4: Emperor
  • Europa Universalis IV
  • Europa Universalis IV: Dharma
  • Hearts of Iron IV: Expansion Pass
  • For the Motherland
  • Europa Universalis III Complete
  • Europa Universalis III Complete
  • Europa Universalis IV: Rule Britannia
  • Cities: Skylines Industries
  • Victoria 2: A House Divided
  • 500k Club
  • Europa Universalis IV: Third Rome
  • Knights of Honor
  • Crusader Kings II: Charlemagne
Great DD thx. I hope you put some tank and plane arts to generic tech tree too. Because, just black look so ugly after seeing all these great stuff. :)
 
  • 3
Reactions:

RELee

Don't mistake my kindness for weakness
Demi Moderator
85 Badges
Apr 28, 2003
12.135
2.655
67
  • Stellaris: Nemesis
  • Europa Universalis IV
  • Europa Universalis III Complete
  • Crusader Kings III
  • Crusader Kings II
  • Rise of Prussia
  • Pride of Nations
  • Imperator: Rome
  • Sword of the Stars II
  • Sword of the Stars
  • Stellaris
  • Cities: Skylines Deluxe Edition
  • Rome Gold
  • 500k Club
  • 200k Club
  • Victoria 2
  • Hearts of Iron IV: Colonel
  • Hearts of Iron III
  • Hearts of Iron II: Armageddon
  • March of the Eagles
2D art is one of the more important aspects of PDS games. I don't envy you your job. Good work.

Also, I want your avatar so badly.
 
  • 9
  • 1
Reactions:

alkomon

First Lieutenant
16 Badges
Aug 23, 2008
203
201
  • Hearts of Iron II: Armageddon
  • For the Motherland
  • Hearts of Iron III
  • Hearts of Iron III: Their Finest Hour
  • Leviathan: Warships
  • Victoria: Revolutions
  • Semper Fi
  • 500k Club
  • Stellaris
  • Hearts of Iron IV Sign-up
  • Hearts of Iron IV: Cadet
  • Hearts of Iron IV: Together for Victory
  • Steel Division: Normandy 44
  • BATTLETECH
  • Hearts of Iron IV: Death or Dishonor
  • Hearts of Iron IV: Expansion Pass
@Sideburnout Please give us higher resolution picture of the "UI elements" , so we can start modding (changing tank pictures etc) :)

EDIT: no offence, you did a great work and it is very beautiful, but I prefer 1:35 tank models or real pics.
 
Last edited:
  • 1
  • 1
Reactions:

Cpack

Field Marshal
38 Badges
Jan 16, 2003
3.000
716
  • Cities: Skylines Industries
  • Cities: Skylines - Natural Disasters
  • Stellaris - Path to Destruction bundle
  • Cities: Skylines - Mass Transit
  • Hearts of Iron IV: Death or Dishonor
  • Cities: Skylines - Green Cities
  • Hearts of Iron IV: Expansion Pass
  • Stellaris: Apocalypse
  • Cities: Skylines - Parklife Pre-Order
  • Cities: Skylines - Parklife
  • Hearts of Iron IV: Field Marshal
  • Stellaris: Megacorp
  • Imperator: Rome Deluxe Edition
  • Imperator: Rome
  • Hearts of Iron IV: Expansion Pass
  • Cities: Skylines - Campus
  • Hearts of Iron IV: La Resistance
  • Stellaris: Federations
  • Battle for Bosporus
  • Cities: Skylines - After Dark
  • Europa Universalis III Complete
  • For the Motherland
  • Hearts of Iron III
  • Hearts of Iron III: Their Finest Hour
  • Europa Universalis III Complete
  • Europa Universalis III Complete
  • Semper Fi
  • 500k Club
  • Cities: Skylines
  • Hearts of Iron II: Armageddon
  • Cities: Skylines - Snowfall
  • Stellaris
  • Stellaris: Galaxy Edition
  • Stellaris: Galaxy Edition
  • Hearts of Iron IV Sign-up
  • Stellaris Sign-up
  • Hearts of Iron IV: Cadet
  • Hearts of Iron IV: Colonel
Wow!!! :eek:

So here I can post my partially unanswered modding questions:

1) Can I mod country specific ship profiles, also different for the 4 tech Levels? --> Seems to be yes
2) Can I mod country specific tank profiles for the variants of TD, SP-AA and SP-Arty (like Hummel Profile for the Pz.IV Sp-Arty variant)? ---> not sure
3) Can I mod country specific airplane profiles for the carrier variant? ---> not sure
4) Can I mod variant specific profiles for ships, tanks, planes? (f.e. Bf-109 has different Profile than my newly created Bf-109 G) ---> not sure, some Kind of predesigned pool necessary

like this:
Hearts of Iron IV - Development Diary 52 - Modding
 
  • 3
  • 1
Reactions:

Gamer_1745

Field Marshal
65 Badges
Sep 2, 2012
7.907
4.231
www.youtube.com
  • Hearts of Iron III
  • Hearts of Iron III Collection
  • Semper Fi
  • For the Motherland
  • Hearts of Iron III: Their Finest Hour
  • Imperator: Rome - Magna Graecia
  • Europa Universalis 4: Emperor
  • Age of Wonders: Planetfall Sign Up
  • Imperator: Rome Sign Up
  • Warlock 2: The Exiled
  • 500k Club
  • Europa Universalis IV: El Dorado
  • Pride of Nations
  • Europa Universalis IV: Common Sense
  • Crusader Kings II: Horse Lords
  • Europa Universalis IV: Cossacks
  • Europa Universalis IV: Mare Nostrum
  • Hearts of Iron IV Sign-up
  • Hearts of Iron IV: Cadet
  • Europa Universalis IV: Rights of Man
  • Hearts of Iron IV: Expansion Pass
  • Steel Division: Normandy 44
  • Europa Universalis IV: Mandate of Heaven
  • Steel Division: Normandy 44 Deluxe Edition
  • Hearts of Iron IV: Death or Dishonor
  • Age of Wonders III
  • Steel Division: Normand 44 - Second Wave
  • Europa Universalis IV: Cradle of Civilization
  • Victoria 2
  • Hearts of Iron IV: La Resistance
  • Europa Universalis IV: Rule Britannia
  • Europa Universalis III Complete
  • Hearts of Iron IV: Expansion Pass
  • Europa Universalis IV: Dharma
  • Europa Universalis IV: Golden Century
  • Hearts of Iron IV: Expansion Pass
  • Europa Universalis III Complete
  • Europa Universalis IV
  • Darkest Hour
  • Arsenal of Democracy
  • Hearts of Iron IV: Expansion Pass
  • Europa Universalis III
  • Europa Universalis III Complete
  • Divine Wind
  • Heir to the Throne
  • March of the Eagles
  • Europa Universalis IV: Call to arms event
  • Europa Universalis IV: Res Publica
  • Europa Universalis IV: Conquest of Paradise
  • Europa Universalis IV: Wealth of Nations
I really like the color scheme of the game! You have done very well! From some of the WWW game play, I don't like the near 'Day Glow' & overly modern graphics for buildings like bunkers & AA guns. You images of Tanks & the like I have seen in the many DDs & WWW games.
 
  • 2
Reactions: