Item bar

The item bar is showing how many items the player has, the capacity of each item is 10. The original idea is coming for here:

It pointed out that the item bar should have items, which is water water, food and health. We designed and upgraded it based on the draft, that item bar with the style of the entire game and the original item. The item bar final operating rules in the game were determined as: If the player picked up items, the number will increase. If the player used items, the number will decrease.

Initially the quantity of each items are three

If the player picked up an item, the number will increase

If the player use an item, the number will decrease

Then the item will be activated.

Its design is consistent with the overall design elements of the game as always and needs to be consistent with the design elements and colours of the original item. The main colours and design elements of water droplets, food and health are the same as Increase Thirst, Increase Hunger and medical kits, which are 1. Blue, water. 2. Brown, chicken legs. 3. Red, medical kit. The design of the elements highlights the pixel style, which is reflected in the obvious jagged edges of the item.

User Testing

User testing for the scoring system was done by an online zoom meeting. Testers experienced the system through the remote control of zoom functionality. The test time for each user is guaranteed to be within 20 minutes.

Testing Process(two rounds of testing, detail in testing page)

Round 1: Interview

Round 2: A/B test + Interview
Evaluation

For the item bar, testers thought it can be bigger(already prove it)

Design Software

Adobe Illustrator CC 2017
Procreate(iPad)
Aseprite

Style Guide/Design Standards

Pixel Grid Resolution

Style

Colour Palette

Colours chosen for item bar icons

Item outer border

Water

Food

Health

Others

Item bar basis for decision

We have designed different styles of drafts to filter because the draft design is relatively complete (with colours, borders, etc.). Therefore, in this project, we did not adopt an iterative design but selected the results based on the basis. Next will explain the reasons why each one was not considered as the final design.

Water

1.

The design of this icon is too similar to Increase Thirst's (both are blue water drops). We hope to have the same design elements, but we don't want to be too similar, so we didn't adopt them.

2.

The design of this icon is still a water drop element. Although it is a little different from XX, this is still not selected as final. The reason is that the original size of the image is 256px * 256px. After putting it into the game, the pixel characteristics are not obvious. The main style is not very consistent, so there is no choice.

3.

The design of this icon is an element of a water bottle. It has the same water element as Increase Thirst, but it is different. The main reason for not choosing this is that the design has more classical elements (glass bottle, wooden bottle stopper), and the game background is a contemporary city. We hope that all the designs can be more in line with the game background, so we did not choose this design.

4-6

The above three icons are the same as the main style of the game so that the mineral water bottle as the main element is very modern. The reason why there is no choice is that compared with the final version, these three details are not as rich as it (such as the highlights on the bottle, etc.), so there is no choice.

7

This version and the final version are designed with modern elements (mineral water bottles), but compared to the final version, this design is wider, and the display on the game is not as good as the final version.

Final version

Food

1.

The reason for not choosing this as the final version is the same as the third one. Because of the size and resolution, after the picture is inserted into the game, the pixel features are not obvious and different from the main style of the game, so this design is not selected as the final design.

2.

Compared with the final design, the design is of the same style and size, but compared to the final design, the design lacks details (the ratio of bones to chicken legs, etc.), so this design was not selected.

3.

Compared with the final version, this version is not as good as the final version in details, and the color of this version is not as comfortable as the final version in the game.

Final version

Health

1-2

The main inspiration for the above two designs comes from the blood pack. Although the main colour is red, which is the same as the heart, it is somewhat different from the medical pack, so these two were not selected as the final version.

3-6

The main factors of the above three designs are medical packs, which are the same as the medical pack elements on the page, but after being placed on the game page, the pixel features are not obvious, so they are not selected.

Final version