The Alliance participation UI I created the UX for this menu and contributed towards the visual language of tinting the alliance icons and adding UI capsule gradations to visually indicated who is on your alliance or on the enemy alliance. © Disney/ Marvel 2019
New Icons
New icons that I designed for Alliance War. One of which is a very important icon used to identify an unclaimed room slot in your alliance helicarrier. Using an orange color coating to notify that a room is available. Once you claim a room slot, your flag icon is used as a metaphor for claiming your stake in the ground and the color coating changed from orange to blue. The icons were designed in white and tinted in the game engine for optimal performance.
I also helped pre-visualize the flag animation in Adobe Animate seen above that helped inform the animation you see in game. The flag was eventually converted into a 3D mesh and animated. Credit to Egon Sternecker (animation), Coachey Cantu(Rigging), Don Johnson and Patrick Ghiocel(Foxnext) for technical support and implementation.
The PIP
The pip in theory made sense, basically taking the idea of taking one indication of group represented here as a little 'PIP' and breaking down that group into a branch of smaller groupings. The pip is seen in the image above with the numbers on them 1-8. Each of those pip graphics contains part of your alliance squad of 5 team members per 'PIP'.
For a long time the 'PIP' was very confusing. The UX department adding a number system which helped identify this problem. To the right of this screen you can see how the Pips looked like for a long time. Eventually I was tasked to visualize how these pips would look and color map them to there meaning.
My Icons were added to the main menu for Alliance War.
The UI was built on a UI sprite sheet system. Typically a 1024x1024 sheet. Looking at our left 'The original UI sprite sheet, The problem is the button art is taking up 45-50% of the sprite sheet footprint and was not optimized well or a good use for the future. The art was not scalable or created in vector, so instead of making many buttons art assets to fit different ratios, I vectorized the button art and built to to be 9-Sliced scalable not only for implementation but could also be used for mockups.
I also provided optimization implementation ideas to limit the amount of button footprint on the UI sprite sheets.
The Art of the Game: Marvel Strike Force book was published by Marvel December 2019. My art and UI and credit is featured in the book along with many of the talented artist, ui designers and illustrators who developed the look and feel of the game. You can get the book in many places but below is a link to where you can get it at Barnes & Nobles.
