Attack Speed Animation Design - UQdeco2800/2022-studio-2 GitHub Wiki
Overview
The following page discusses the design process for the attack speed animation in sprint 2. Initially, draft designs were drawn of various items associated with speed. A survey was then conducted in order to help determine which sketch best fit in with the rest of the game's designs, while also considering the Greek mythology theme and plumber storyline. The attack speed buff design was then finalized in consideration to the user-testing feedback.
Final Design
note: for ease of viewing, the size of all animations has been increased.
Initial Designs
Clock
Inspiration: The clock design was based off the look of a car's odometer, but was made colorful to better conform with the overall design of the game.
Wind
Inspiration: This design was meant to resemble a gush of wind, appearing to push the player ahead.
Caduceus
Inspiration: This design was meant to conform with the theme of Greek mythology, as the caduceus was carried by Hermes, the God of speed.
Lightning
Inspiration: Initially, the lightning was sketched roughly to appear realistic. It was then decided that a more arcade-like design, inspired by Super Mario, was preferred.
Lightning Ball
Inspiration: This design is based off the DC comic character The Flash, who is well-known for his super-speed powers, but was made following the color palette in the design guidelines, using blue rather than red.
User-Testing Initial Designs
In order to determine which of the initial designs was most suitable to be implemented into the game as the attack speed buff, a survey was conducted.
For each design, participants were asked to respond to two statements with a number from 1-5, with 1 being "I disagee" and 5 being "I agree". The statements asked were:
- The design fits into the game's overall theme
- The design well represents a speed buff (i.e. looks like something you would expect to speed up the player)
The results of which are summarized in the bar charts below:
The lightning and caduceus animations tied as the highest rated design for fitting best into the game's overall theme, both receiving an average rating of 4.3750/5. The clock design was determined to be the most irrelevant to the theme, receiving the lowest average rating of 3.5/5.
The lightning animation received the highest rating of 4.375/5 regarding how well the design represents a speed buff. Conversely, it was observed that many respondents did not associate the caduceus with speed, as this design received the lowest average rating of 3/5.
Respondents were also asked "Which design do you (overall) prefer for the attack speed buff?". The lightning animation received the majority, 62.5%, of votes, followed by the caduceus then the lightning ball designs, which received 25% and 12.5% of votes respectively. The clock and wind animations received no votes.
The raw data from the survey is presented below. Note: "The design fits into the game's overall theme" has been shortened to Q1 and "The design well represents a speed buff (i.e. looks like something you would expect to speed up the player)" has been shortened to Q2 for readability.
| Respondent # | Clock Q1 | Clock Q2 | Wind Q1 | Wind Q2 | Caduceus Q1 | Caduceus Q2 | Lightning Q1 | Lightning Q2 | Lightning Ball Q1 | Lightning Ball Q2 |
|---|---|---|---|---|---|---|---|---|---|---|
| 1 | 3 | 4 | 5 | 3 | 5 | 4 | 5 | 4 | 5 | 4 |
| 2 | 2 | 2 | 4 | 4 | 3 | 1 | 4 | 5 | 3 | 2 |
| 3 | 5 | 2 | 4 | 4 | 4 | 3 | 5 | 5 | 4 | 4 |
| 4 | 4 | 4 | 4 | 5 | 5 | 5 | 5 | 5 | 4 | 4 |
| 5 | 2 | 4 | 4 | 5 | 4 | 2 | 4 | 4 | 3 | 3 |
| 6 | 3 | 4 | 5 | 5 | 5 | 1 | 5 | 4 | 5 | 5 |
| 7 | 3 | 3 | 3 | 3 | 4 | 4 | 3 | 3 | 5 | 5 |
| 8 | 4 | 5 | 5 | 4 | 5 | 4 | 4 | 5 | 5 | 5 |
| Average | 3.25 | 3.5 | 4.25 | 4.125 | 4.375 | 3 | 4.375 | 4.375 | 4.25 | 4 |
Link to Survey: https://form.jotform.com/222512703999058
Intermediate Designs
From the survey results, it was made clear that in addition to being the preferred overall design, most respondents also agreed the lightning animation best fit into the game's overall theme and looks most like an item that would speed the player up. Hence, the final animation was designed based off of the initial lightning draft.
Further inspiration was taken from the thunder cloud buff in Mario Kart, which gives the player a constant boost of speed.
Mario kart thunder cloud image
The lightning design was altered slightly to use the exact colors (02778e, fffbf4, fff702, fff280) specified in the Design Rule Book. Several small changes were then made regarding the cloud's movement, shape and where the lightning bolt should sit over the cloud before a decision was finalized.
The cloud was then made to blink in the animation, and was given a blushing face to appear more friendly, in order to emphasize that it is a positive buff.
Final Design
