Development:Animations

This article contains information for Programmers working or interested in working for The Mana World

This article contains information for Artists working or interested in working for The Mana World

This article is for reference purpose

The features described in this article are already implemented in the game. The article should describe how a certain aspect of the game currently works. You may of course edit this article to improve the description of the circumstances. Your opinions or improvement suggestions about the described aspects themself are of course appreciated, too. But please put these on the discussion page of this article to keep facts and fiction separated.

TMW follows the same conventions as laid out by the client manaplus

Example of a sprite definition

The animations of all sprites are defined by xml documents. Here follows an example:

<?xml version="1.0"?>
<sprite name="player" action="stand">

	<imageset name="base" src="graphics/sprites/player_male_base.png" width="64" height="64" />

	<action name="stand" imageset="base">
		<animation direction="down">
			<frame index="0" />
		</animation>
		<animation direction="left">
			<frame index="18" />
		</animation>
		<animation direction="up">
			<frame index="36" />
		</animation>
		<animation direction="right">
			<frame index="54" />
		</animation>
	</action>

	<action name="walk" imageset="base">
		<animation direction="down">
			<frame index="1" delay="75" />
			<frame index="2" delay="75" />
			<frame index="3" delay="75" />
			<frame index="4" delay="75" />
			<frame index="5" delay="75" />
			<frame index="6" delay="75" />
		</animation>
		<animation direction="left">
			<sequence start="19" end="24" delay="75" />
		</animation>
		<animation direction="up">
			<sequence start="37" end="42" delay="75" />
		</animation>
		<animation direction="right">
			<sequence start="55" end="60" delay="75" />
		</animation>
	</action>

	<action name="attack" imageset="base">
		<animation direction="down">
			<sequence start="9" end="12" delay="75" />
			<end />
		</animation>
		<animation direction="left">
			<sequence start="27" end="30" delay="75" />
			<end />
		</animation>
		<animation direction="up">
			<sequence start="45" end="48" delay="75" />
			<end />
		</animation>
		<animation direction="right">
			<sequence start="63" end="66" delay="75" />
			<end />
		</animation>
	</action>

</sprite>

So if you want to load the playerset you just load player.xml and it takes care of loading all related images. Of course delays are defined in milliseconds.

Specifications

<sprite>

A sprite is an object which can carry several animations, hence we call the root element the sprite. The sprite tag has two optional properties variants and variant_offset. These are required when there are multiple very similar versions of a sprite in one spriteset. One example for this are the hairset spritesets. The variants property defines the number of variants in the spriteset and the variant_offset property how many sprites are between the first sprites of the variants. When defining multiple variants you only define the animation sequences of the first variant. the engine then shifts the index parameters when it needs another.

<action>

collection of the animation in different directions that belong to an action the character can perform. the properties are the imageset the animation phases are taken from and the name of the action.

Current actions as defined in the base sprite 1.0: Default Walk sit dead attack attack_bow Directions: NSEW

New actions/directions will be added as the sprite progresses. Sprite 1.5 work can be seen here art trello

The action type matches the item.xml:

    <item id="522"
        image="equipment/weapon/dagger-sharpknife.png"
        name="Sharp Knife"
        description="A really sharp knife. Don't hurt yourself!"
        effect="Damage +10"
        type="equip-1hand"
        weapon-type="knife"
        attack-action="attack"
        weight="150">
        <sprite>weapon-dagger.xml</sprite>
        <sound event="strike">weapons/knives/sharpknife-miss1.ogg</sound>
    </item>

Would use attack from the sprite sheets or default if attack is not declared.

<animation>

Defines an animation sequence that should be displayed when the sprite object faces in a specific direction (attribute "direction").

the possible directions are:

up
down
left
right
default

when a specific direction isn't provided, the default direction is used instead. When no default direction is defined, the first defined direction is used.

Every <animation> has one or more frame or sequence child elements and an optional <end> element.

<frame>

Defines one frame of the animation. The only required property is index. Optional properties include offsetX, offsetY and delay.

index defines the index of the graphic on the spriteset.

The delay property specifies the number of milliseconds the frame is displayed before it is replaced by the next frame in the sequence. The sequence restarts when the last frame is finished. When no delay is specified (or specified as "0") the animation doesn't continue when this frame is reached.

The frame element has the optional properties offsetX and offsetY to specify an offset from the default drawing position for that frame. This allows the animation of for example the hairset (or any equipment) to reuse the same frames with different offsets.

<sequence>

The sequence tag defines one or more phases of animation. It has the required properties delay, start, and end. The delay property specifies the delay in milliseconds between each phase. The start and end properties define the first and the last indexes of the animation sequence on the spritesheet.

<end>

When the animation sequence reaches an end tag, the animation stops and the sprite animation is returned to the "stand" state. This can be used for one time action sequences like attacking. This tag has no properties.

<include>

Can be used to include another sprite definition file. If you want to override the images, you need to specify them before the include element. If you want to override any animations, you have to do so after the include element. Example:

<sprite>
	<imageset name="base" .../>
	<include file="other-sprite-file.xml"/>
	<!-- possibly override or introduce new actions -->
</sprite>

hairstyles

Most hairstyles which only have one frame for each direction and death, so five frames. The offset for the hairstyles is standard to either haristlye01.xml or hairstyle13.xml

Currently the hairsprites follow the hairsprite convetion