Skip to content

Character Design and Animations

n1ko4fun edited this page Oct 5, 2021 · 28 revisions

Character Design

As the overall theme for the game is space, with a Viking influence, the character was decided to be an astronaut. The rounded outline of the character and the accent colors used is taken from the design guide, which settled on a minimalist 2D style. Much of the inspiration behind the art style is from The Noun Project, an icon collection website. Illustrator has been used to create the astronaut. Viking horns and a rune have been added to the design in reference to the Ragnarok twist.

Finalised colored version

Character Animations

Jump

Megaman Jump

The primary inspiration for the jumping animation is that of Mario, consisting of a simple change in character to having an arm up and having the legs in a leaping motion. Looking at other sources of inspiration such as Mega Man it is clear having a common feature is having the arm(s) up to indicate the jump as the main visual que. The exact placement of arms and legs can alternate; however, it is clear the arms up animation in conjunction with elongating the body is an effective method of communicating the jumping motion and should be adopted as a result.

Another consideration is the number of keyframes used for the duration of the jump. Naturally, with more intermediate keyframes the jump will appear smoother. However, it is also important to consider the visual style desired of the game, smoother animations should be an active choice in style rather than being ubiquitously good feature to always implement. Ergo, the fidelity of other animations in the game should be considered to ensure consistency, making this an issue not isolated to this specific animation but a design choice of animation for the game overall. As a starting point a simple animation with minimal keyframes should be considered as a proof of concept to demonstrate the functionality of the animation.

As seen above, eight frames were made for the Jump animation. The eight frames consistuted one full loop of the character jumping, reaching it's peak in frame 4. The jump animation was communicated through the progressive raising of the arms and bending of the kneees.

Walk/Sprint

Intuitively, the walking animation should induce a swinging of the arms in conjunction with character steps. To create a running animation a distinction must be made from regular walking primarily in the form of the character leaning forward with more exaggerated leg and arm swings. The above examples show the use of multiple intermediate keyframes, however much like the jumping example, for the purposes of initial proof of concept less frames can be used. However, it must be noted that the greatest visual que seems to be that of the character leaning forward. By ensuring at the very least, this aspect of the design, the change in character state from walking to running can be adequately communicated to the player.

As seen above, the sprint animation consists of eight frames. The character leans forward during the sprinting motion in conjunction with leg and arm swings.

Above you can see the walk animation frames, simple with the hand and leg coordination matching. The middle state frame is the state when the hands and legs move back to a neutral stance.

Double jump

Basically, the double jump is a second jumping move based on a starting jump. Due to the presence of gravity, the trajectory of the jump is mostly parabolic, with the reaction force pushing the double jump performer back upwards during the second half of the fall. The jumps are designed according to the character's base, with the first jump retaining the previous movement. The second jump adds a spin to the character, inspired by the spinning motion of a character taking off upwards in flight in the game "Sky".

画板 5 副本

The second jumping action starts on the fifth frame after the first jump is reached on the fourth frame. In addition, some effects have been added to the character's rotation to give a better visual representation.

instant drop

The character is also affected by gravity according to the physics setting, when the character falls while walking at height, back down and hands and feet up according to gravity.

画板 5

In frame 5 the character starts to fall. In frame 8 the character's state reaches its fastest rate of descent.

Rolling

When there is an obstacle makes the character can only go under of it, this animation will play a role. The Rolling animation will make the character roll passing under the obstacle. 画板 1rollRE

Wall Jump

This animation will be used a scene of character falling down to a hole which makes the character cannot do the normal jump to escape. The character has to cross between the walls repeatedly to escape from the deep hole. However, the feature will not be implemented in Sprint3. 画板 1wallJumpFinalWiki

Table of Contents

Home

Introduction

Main Menu

Main Game Screen

Gameplay

Player Movement

Character Animations

Enemy Monster Design and Animations

Game basic functionalities

User Testing

GitHub Wiki Tutorial

Game Engine

Getting Started

Documentation

Entities and Components

Service Locator

Loading Resources

Logging

Unit Testing

Debug Terminal

Input Handling

UI

Animations

Audio

AI

Physics

Game Screens and Areas

Terrain

Concurrency & Threading

Settings

Troubleshooting

MacOS Setup Guide

Clone this wiki locally