Considering the screen size of the iPhone 6 Plus and other similar mobile devices, I mapped what zones are easiest to access, to figure out where the main interaction should sit on the screen.
Generally the most important information is displayed in the top/left because people naturally tend to look in that direction when they read something. Information gets less important the more you move away from this area. Taking into consideration the previous step, we see that information should sit at the top, while interaction should be placed at the bottom of the layout.
According to a study by MIT, the average width of the human index finger is 1.6 to 2 cm for most adults. This converts to 45 – 57 pixels depending on the device PPI. The average width of the human thumb is about 2.5 cm, which converts to 72 pixels.
Laying out the elements with correct sizes and alignment.
Creating and polishing assets
Creating and polishing assets
Exported elements from Illustrator and Photoshop and animated them in After Effects
Doom 3 is a fast paced first-person shooter with horror elements. Players need to react quickly and be aware of their surroundings. HUD elements should be simple so they can be read quickly.
Health and Armor are two very important elements in the game. Players need to know exactly how much health and armor they have left, so they can decide which tactic to use. That's why these stats are displayed numerically instead of with bars.
The original game had a stamina bar with a pretty simple mechanic. The more you run the lower stamina gets. Stand still and it regenerates. But is it really that useful? In Doom 3 you mostly run TOWARDS enemies, not away from them. You have powerful weapons and lots of ammo to deal with almost anything. This is not a horror story where players run away from demons. It's about facing them... and blowing them to pieces! A classic stamina mechanic doesn't really make sense in this context so I kind of redesigned it.
Instead of stamina, use adrenaline. The more damage you take, the higher your pulse goes, giving you adrenaline and all your stats increase. You deal more damage, run faster, reload faster and you also regenerate some health points when killing enemies with headshots or melee.
Lets see it in action
Because this is an action RPG running in landscape mode, we'll probably mostly use our thumbs to control character movement and abilities. That's why all the interactive elements are at least 120px wide/tall.
