Differences

This shows you the differences between two versions of the page.

--- anim_char_tutorial [2017/11/13 08:56] – justin
+++ anim_char_tutorial [2017/11/14 08:45] (current) – justin
@@ Line 36: / Line 36: @@
 =====Creating the Walk Animation=====
-(Simple walk animation can be made with just 3 frames. Duplicate Frame #1 and move frame to end using Move button)
+A simple walk [[animation]] can be made with just 3 frames. Duplicate frame #1 and move it to the end using the "Move Current Frame Right" button on the [[animation]] toolbar. This new frame will now be frame #3 and will serve as the first frame of our walk [[animation]].
 {{:wiki:anim_char_move_frame_button.png?nolink|}}
-(First frame, swing one arm forward and bend opposite leg backward, vice versa with other arm/leg)
+In this new frame, modify the model so one arm is angled backward and the leg on the same side is angled forward. Also make adjustments to the other arm and leg but in reverse (the arm angled forward and the leg angled backward, as shown in the image below).
 {{:wiki:anim_char_frame_03.png?nolink|}}
-(Duplicate frame #1 again and move to end, this is Idle second frame, arms down and legs straight)
+Go to frame #1 and duplicate it again, then move it to the end by clicking the "Move Current Frame Right" button twice so it is now frame #4. This will be the second frame of our walk [[animation]]. The [[character|character's]] arms and legs should be straight down, so you can keep the frame as is, or make some minor adjustments like moving the arms slightly away from the body as shown below.
 {{:wiki:anim_char_frame_04.png?nolink|}}
-(Third frame, duplicate of first walk frame but flipped horizontally)
+The third and final frame of the walk [[animation]] should be similar to similar to the first one, but with the arms and legs flipped. Go to frame #3 and click the "Duplicate Current Frame" button followed by the "Move Current Frame Right" button to move the new frame so it's now frame #5. Ensure you are in the "Front View" then click the "Flip Model Horizontally" button ({{:wiki:shape_flip_horizontal.png?nolink|}}) to flip the model.
 {{:wiki:anim_char_flip_button.png?nolink|}}
+Frame #5 should now look similar to the image below.
 {{:wiki:anim_char_frame_05.png?nolink|}}
-(Define animation similar to idle animation)
+Now that we have the 3 frames created for the walk [[animation]], click the "Add Animation" button ({{:wiki:add.png?nolink|}}) on the [[animation]] toolbar and define its settings as shown below. The walk [[animation]] will use the Ping Pong type instead of Loop. With the Ping Pong type, the frames will be played in order, then reversed back to the start frame, and so on. In this case, the sequence of frames will be 3, 4, 5, 4, 3, 4, 5, etc.
 {{:wiki:anim_char_walk_settings.png?nolink|}}
+Click OK to finish defining the [[animation]], then click the "Play" button ({{:wiki:control_play_blue.png?nolink|}}) on the [[animation]] toolbar to see the walk [[animation]] that you've created!
 {{:wiki:anim_char_walk.gif?nolink|}}
-At some point, explain how to tweak the speed as the animation is playing, may also need to be adjusted based on the character's movement speed and how it appears in-game.
+Click the "Play" button again to stop the [[animation]].
+=====Tweaking and Testing the Animations======
+After you've defined an [[animation]] in the [[Voxel Editor]], you can later adjust it from the [[Model Properties]] panel on the left. Expanding an [[animation]] in the list will display its settings, most of which can be edited. You can tweak the speed as an [[animation]] is playing to see the effect in real-time.
+{{:wiki:model_props_anims.png?nolink|}}
+Once you are done, save the model and [[exporting_your_game|export your game]] to test out the new [[animation|animations]] that you've created!
 {{:wiki:anim_char_example_game.gif?nolink|}}
 ~~NOTOC~~

RPG in a BoxOfficial Documentation

User Tools

Site Tools

Differences

Page Tools

RPG in a Box
Official Documentation