War of Nations is a popular free-to-play MMO Strategy game by Gree. The objective of the game is to expand your military bases, create a strong army and defeat your enemies across a gigantic map. You can capture enemy bases and claim them for yourself.

Game Project: War of Nations

Company: Gree

Role and Responsibilities: I was a Senior UI Artist at Gree and worked primarily on War of Nations. My main responsibilities at Gree was to collaborate with Game Designers and Product Managers on feature specs and provide them with wireframes, prototypes, and mockups.

won00.png
Feature: HUD Update  Goal: To refresh the HUD with new features like the SALE icon, additional resources, activities button, and new player's level container.  - With the new “SALE icon”, I’ve place it under the currency box that’s on the top right of the screen. I also repositioned the “Collect Box” to be under the “Sale” icon. The reason for placing the “SALE icon” and “Collect Box” under the currency box was to bring more attention to this area of the screen. Since users can tap on the “Collect Box” every hour to collect free gold, they will always notice the “Sale” icon and currency box. As a result, the users are more likely to check out the sales and currency store.  - In the old HUD, the resources are stacked vertically and are placed on the top right corner of the screen. In the new HUD, I redesigned the resources container so it’s laid out horizontally and is placed on the top of the screen. The resources stands out a lot more and it’s also on the same level as the currency box.  - I updated the “Player Level Container” on the top left corner of the screen. The updated version has a larger player level number, the VIP button is more integrated in the design, and I reduced the size of the level bar.

Feature: HUD Update

Goal: To refresh the HUD with new features like the SALE icon, additional resources, activities button, and new player's level container.

- With the new “SALE icon”, I’ve place it under the currency box that’s on the top right of the screen. I also repositioned the “Collect Box” to be under the “Sale” icon. The reason for placing the “SALE icon” and “Collect Box” under the currency box was to bring more attention to this area of the screen. Since users can tap on the “Collect Box” every hour to collect free gold, they will always notice the “Sale” icon and currency box. As a result, the users are more likely to check out the sales and currency store.

- In the old HUD, the resources are stacked vertically and are placed on the top right corner of the screen. In the new HUD, I redesigned the resources container so it’s laid out horizontally and is placed on the top of the screen. The resources stands out a lot more and it’s also on the same level as the currency box.

- I updated the “Player Level Container” on the top left corner of the screen. The updated version has a larger player level number, the VIP button is more integrated in the design, and I reduced the size of the level bar.

Feature: Activities Popup  Goal: To provide the user an activities manager so they can view all buildings that are active.  One of the pain points in the game for advanced users is when your base becomes larger, there are a lot more buildings to manage. It became a hassle to click on each active building to check on their status. This Activities Popup was designed so you can see all building activities in a list and be able to speed up or cancel their production.

Feature: Activities Popup

Goal: To provide the user an activities manager so they can view all buildings that are active.

One of the pain points in the game for advanced users is when your base becomes larger, there are a lot more buildings to manage. It became a hassle to click on each active building to check on their status. This Activities Popup was designed so you can see all building activities in a list and be able to speed up or cancel their production.

Feature: Missions  Goal: A popup that displays timed based challenges for the user to complete and be rewarded.  Each mission has a set number of tasks that the user has to complete. User are able to claim the reward for completing a task.

Feature: Missions

Goal: A popup that displays timed based challenges for the user to complete and be rewarded.

Each mission has a set number of tasks that the user has to complete. User are able to claim the reward for completing a task.

Feature: Campaign  Goal: To provide users with a single player campaign mode and special prizes.  In the left image is the main screen of the campaign mode. Users are able to access different types of dungeon with the Dailies, Limited, Siege, and Invasion tabs on the left. After tapping on a Dungeon map marker, the user have access to the mission map that’s displayed in the right image. Each mission is presented with an icon on the map. For a selected mission, the difficulty level, loot chance, and start button are displayed on the bottom of the screen. Starting a mission takes a set amount of energy. If you run out of energy, you can pay for more or wait until it fills up again.

Feature: Campaign

Goal: To provide users with a single player campaign mode and special prizes.

In the left image is the main screen of the campaign mode. Users are able to access different types of dungeon with the Dailies, Limited, Siege, and Invasion tabs on the left. After tapping on a Dungeon map marker, the user have access to the mission map that’s displayed in the right image. Each mission is presented with an icon on the map. For a selected mission, the difficulty level, loot chance, and start button are displayed on the bottom of the screen. Starting a mission takes a set amount of energy. If you run out of energy, you can pay for more or wait until it fills up again.