Achievements Trophies and Cards Design

Trophies Design Style

This section describes the final design of the achievement trophy. The achievement is activated when the player achieves the acquisition conditions for a certain achievement during the game. Each time a player unlocks an achievement they will receive a corresponding bonus score. All achievement bonus points earned will be stacked on the player's total game score at the end of the game.

Trophies Design Concept

Achievements are divided into three levels, represented by the image of gold, silver and bronze trophies, with the highest level achievement being the gold trophy. Achievement acquisition difficulty increases with the level. The bonus points given by achievements will increase as the achievement level increases, and the bonus points corresponding to different types of achievements are different.

User Testing

• The user testing was conducted based on the concept design. The documentation for the same can be found here

Design upgrade process

After the initial round of surveys and user interviews, All trophies have been fully upgraded. The trophy upgrade before and after the gold, silver and bronze versions are shown below.

The previous version for Bronze Veteran Trophy	The previous version for Sliver Veteran Trophy	The previous version for Gold Veteran Trophy
The promoted version for Bronze Veteran Trophy	The promoted version for Sliver Veteran Trophy	The promoted version for Gold Veteran Trophy

Design Software and Techniques

Initial trophy image

Trophy coloring image

Bronze Trophy	Sliver Trophy	Gold Trophy

Trophy final production example (Master)

Bronze Master Trophy	Sliver Master Trophy	Gold Master Trophy

Colours chosen for Bronze trophies

Colours	Hex Colour Codes
	#854410
	#AC5916
	#E9B994

Colours chosen for Silver trophies

Colours	Hex Colour Codes
	#797979
	#939393
	#EAEAEA

Colours chosen for Gold trophies

Colours	Hex Colour Codes
	#F8ED33
	#FBD140
	#FFFFFF

Achievement Card Design Style

This section describes the final design of the achievement card.

Trophies Design Concept

Gold, silver and bronze trophies have corresponding achievement cards. The trophy is placed on the left side of the card, and the achievements corresponding to the trophy are on the right side.

User Testing

• The user testing was conducted based on the concept design. The documentation for the same can be found here

Design Software and Techniques

Card border coloring image

Bronze Card border	Sliver Card border	Gold Card border

Achievement card final production example (Master)

Bronze Master Achievement card	Sliver Master Achievement card	Gold Master Achievement card

Colours chosen for Bronze card border

Colours	Hex Colour Codes
	#362F2D
	#C69C6D

Colours chosen for Silver card border

Colours	Hex Colour Codes
	#555555
	#CCCCCC

Colours chosen for Gold card border

Colours	Hex Colour Codes
	#F8E279
	#E5BC2C

Implemented in the game

Achievement cards in-game display

Achievement reward points in-game display