Overview
Most images in the game consist of a single static image or gif, but it’s also possible to create "custom" poses compositing one or more images which can then be animated through movement, rotation and scaling.
This provides several advantages over static images. For instance:
- Animating multiple compressed .PNGs often requires less file space than a .GIF while looking better
- Key frame-based animation allows for more fluid and dynamic animation than frame-by-frame GIF
- Images can be reused to save on file space. For instance, two sets of poses that differ only by a pair of glasses can use custom poses to composite the glasses on top of one set of poses, eliminating the need for the second set entirely.
- Continuing with #3, if you decide to change how the glasses look, you only need to change one image instead of regenerating an entire set.
Composition
Poses are composed of one or more sprites. A sprite is linked to an image (usually a .PNG) which can be moved around and rotated independently on the canvas, and a pose is created by layering one or more sprites on top of each other and positioning them as desired.
Layering
By default, sprites are layered in order of creation. The first sprite (topmost on the timeline) appears behind all other sprites while the last sprite (bottommost on the timeline) appears above everything else. If this is not adequate, you can apply custom layering by assigning a custom layer value to the sprite by selecting that sprite in the timeline and giving it a non-zero Layer value in the Sprite Settings.
Sprites all occupy layer 0 by default, so giving one sprite a layer of 1 will put it above all other sprites regardless of their positions in the timeline.
If you need to reorder sprites without assigning a custom Layer, you can drag a sprite in the timeline by grabbing it by its title bar and dropping it into the desired position.
Pose Creation
The first time you visit the Pose Maker for a character that has no custom poses, everything will be disabled except the box in the bottom left. This box contains a list of the character’s current Custom Poses. Select one to start editing it. To create a new pose, click the +. This will enable all the other regions on the screen.
The first thing that becomes available is the Property Window directly to the right of the pose list. This contains information about the entire pose. There isn't very much to do.
- Id: The pose's unique ID which functions the same as a standard pose's file name.
- Base Height: Reference height for images. This acts sort of like a global scaling factor. It's very unlikely you will ever need to stray from the default 1400.
About the Pose Id
Initially "new_pose", the ID is the name of the pose as it appears in the Dialogue screen when writing lines. If your pose ID is "my_pose", it will appear as custom:my_pose in the Poses dropdown of a dialogue line.
Like with images created from a Template or Pose List, it’s possible (and generally desirable for organization purposes) to prefix your pose with a stage number in order to group poses for use across multiple stages, or to limit the pose as only being available for selection in that particular stage.
Looking at Florina, for reference, she has custom poses named 2-bee, 3-bee, and 4-bee. This lets her use a single dialogue case that applies to stages 2, 3 and 4 using the custom pose "custom:bee" (stage prefixes are omitted from the selection dropdown). Outside of stages 2, 3, and 4, custom:bee is unavailable.
Property Window
The area to the right of the Pose List is a context-sensitive list of properties that let you manually edit properties for the currently selected pose, sprite, property, or keyframe. There are a few properties than can only be accessed here (ex. sprite opacity), but most properties can be modified in more convenient ways elsewhere in the Pose Maker.Timeline

The timeline provides a high-level overview of all sprites in the pose and their animation key frames.
Breaking down the above timeline, there are 3 sprites present: florina, wing1, and wing2. Each sprite lists all properties that are being animated, or at the very least stray from their defaults. Since a sprite at the minimum will generally consist of an image and 2D position, Source, X, and Y are almost always present. Other properties will appear automatically when applicable.
Sprite Title Bar
Above the property rows in a sprite is the title row. This contains a thumbnail of the sprite as well as its ID. A collapsible divot lets you hide the sprite’s individual properties in the timeline to clean up the view.
The link to the left of the eyeball allows you to link a sprite to another one. Linking a sprite will attach it to that sprite so that it moves, scales, and rotates with the parent linked sprite. If a parent sprite is already linked, the icon will display the thumbnail of whatever sprite is linked.
The eyeball is a visibility toggle that lets you hide a sprite from the live preview. This does not actually impact sprite visibility in the pose itself.
Key Frames
The Pose system uses motion tween animation where only a few key frames are defined and the system automatically fills in the frames between the key frames. This process is known as tweening.
For example, if at time 0s a sprite has a key frame where X: 0 and another key frame at time 5s where X: 10, then the animation will smoothly move X from 0-10 over those five seconds, computing the inbetween frames automatically (ex. At 2.5s, X should be 5).
Gray diamonds in the timeline represent key frames for that particular property. Each property (X, Y, X Scale, etc.) can be animated independently from other properties.
Yellow diamonds are sprite-level key frames that allow for moving, cutting, pasting, etc. an entire group of property key frames at once.
White diamonds represent the current selected key frame. You can select an entire group of frames by clicking the yellow diamond, or can select properties individually by clicking them directly. By holding Ctrl while clicking, you can select multiple properties’ key frames, but only within the same time group.
How the inbetween frames are computed can be tweaked by two values: the easing method, and the tweening (or interpolation) method.
Easing
The easing method controls the physics of the animation. For instance, a Linear ease will move through the frames at a constant rate, whereas an Ease-In ease will start off slowly and speed up as it approaches the end of the animation. Each property can be tweaked individually by clicking the graph and choosing the desired easing operation.

You can visualize how easing works by entering playback mode. The green bar represents the overall animation time/frame. Each property has an additional blue bar showing its eased time.

In the screen above, property 1 has no key frames past time 0, so is not animated at all and has no blue bar. Property 2 is using linear easing, so it progresses at exactly the same rate as the overall animation. Property 3 is using ease-in, so it starts off lagging behind the true time, but upon nearing the completion of the animation at 2:00 seconds, it has nearly caught up.
Interpolation
While easing controls the relative speed at which an animation progresses through its frames, Interpolation controls how the values are computed at each tweened frame.
There are currently three methods of interpolation available, accessible from the 2nd icon on a property’s header.


The graphics above represent the interpolated movement of a sprite’s (X,Y) position over 3 key frames.
- Using Linear, the sprite moves in straight lines between each key frame.
- Using Spline, the sprite attempts to smooth its path between the frames. Spline-based movement in the Pose system is very basic; you cannot adjust the control points to alter the curve like you would find in more sophisticated systems.
- Using None, the sprite doesn’t fill in the frames at all; it jumps directly to the next key frame upon reaching that key frame’s time. This is most commonly used when animating the Source property to simulate frame-based animation (in fact, animating Source will always use None regardless of the setting).
Looping
To the right of the interpolation icon is the looping toggle. When this is enabled, the property will loop endlessly even after the animation finishes. Looping occurs from the first key frame affecting this property to the last key frame, which are not necessarily the first and last frames in the entire sprite animation.
Timeline Controls
The timeline contains a red bar indicating the active time, which represents where key frames will be inserted. To move the active time, you can either drag the fatter handle at the top of the red bar, or selecting a key frame will jump the time to that frame. Clicking in the timeline header (above the sprite boxes) will jump to that time snapped to the nearest half-tick mark.
The timeline controls in the upper left provide other means for navigating through the timeline. In order,
- Jump to the start of the animation.
- Jump to the previous key frame of the selected sprite.
- Pause/begin live playback.
- Jump to the next key frame in the selected sprite.
- Jump to the end of the animation (the latest key frame among all sprites in the pose).
- Zooms out the timeline to get a higher level view (ctrl+mouse wheel also works).
- Zooms in to allow for finer tuning of the time.
Playback
The Play button will start or stop animation playback. There are three play modes accessible from the dropdown arrow next to the Play button. The Play button itself will use whatever mode was last selected.
- Play to End:The pose will play from beginning to end once.
- Play Repeating:Upon reaching the end, the pose will immediately restart and keep playing indefinitely
- Play Once With Loops:Upon reaching the end, the pose will continue to play any looped animations. This is how the pose would actually look when viewed in-game.
Key Frame Editing
You can add a new key frame to the selected sprite by clicking the “Add Key Frame” button at the top. This will insert an empty key frame at the selected time. You must have a sprite selected for this button to be available.
Alternatively, you can move the time bar to the desired position and it will automatically insert a key frame upon editing one of the values in the Property Window. This is important: the property window displays the values at the current frame, which is not necessarily the selected key frame if you’ve moved the time bar. Click a diamond on the key frame to jump back to it if necessary.
The Property Window displays all properties at the current frame.

Values in black are directly defined by a key frame at that time.
Values in gray are auto-computed values based on the tweening settings and the key frames before and after this point in time.
Blank values are properties that are not defined in any key frames (i.e. are not being animated at all) and will just use their default values (100 for opacity, 1 for scale, and 0 for everything else) for the whole pose.
Changing a value will add or replace whatever value is currently in the key frame. You will immediately see a diamond appear in the timeline, and a new row for that property if this is the first key frame affecting it.
Clicking the eraser will wipe out the value back to blank. If no other key frames touch that property, then the property row will disappear from the timeline. If no other properties exist in the key frame, then the key frame will be removed completely.
Key Frame Editing in the Timeline
The Property Window lets you adjust individual properties of a key frame, but you can also modify parts of a key frame from the timeline itself. Selecting a keyframe enables the following options the right-click menu:
- Cut (Ctrl+X): Copies the selected key frames into the clipboard and deletes them from the sprite
- Copy (Ctrl+C): Copies the selected key frames
- Paste (Ctrl+V): Pastes a previously copied key frame into the current selected time. Any properties already existing will be overwritten by what’s in the clipboard.
- Duplicate (Ctrl+D): Deletes the selected key frames.
- Delete (Del): Deletes the selected key frames.
- Split animation: Toggles whether the key frame splits up the property's animation. A split is represented by a half diamond. When animating, key frames starting at the split are treated as a completely separate set of frames from those preceding it.
While a keyframe is selected, you can drag it back and forth on the timeline. Dragging the yellow diamond will drag all the properties with it, while dragging an individual property will drag it alone, separating it from any other properties’ key frames at that time.
By default the key frame will snap to the tick marks. Hold shift to move without snapping.
Canvas
The canvas on the right half of the screen provides a live preview of what the animation looks like at the currently active time in the timeline.
The dashed vertical bar represents the center of your pose. This will line up with the center of your character’s position at the table when in game. The following controls are available for manipulating the canvas view:
- Right-click and drag to pan the canvas.
- Hold ctrl+mouse wheel to zoom (alternatively use the toolbar buttons)
Editing
You can select sprites in the canvas and edit them through a point-and-click interface as opposed to typing values into the Property Window. Editing from the canvas will auto-update properties in the Property Window and create key frames as needed for any properties that are modified. While a sprite is selected:- Translate: Drag the sprite to move it to a new position.
- Scale: Drag the edges of the sprite to scale it.
- Rotate: With the mouse hovering over the outside edge of the sprite, a curved arrow appears. Drag this to rotate the sprite.
- Skew: Hold shift and hover over an edge of the sprite to skew (shear) it.
- Adjust Pivot: Drag the black dot to move the sprite's pivot point. The pivot point is the point around which the sprite will rotate and scale.
Record Mode
By default, when in playback mode, the editing gizmos will disappear, showing a read-only preview of the sprite. By entering Record mode (Record button on the canvas toolbar), you can continue to edit a key frame and get live updates to how it affects the animation.Markers
Game markers can hide sprites in game. The Markers… toolbar button lets you change what markers are active in order to preview how it would look using that set of markers.Sprites
To select a sprite, click the sprite's title bar, or anywhere in the timeline that isn't a keyframe. When a sprite is selected, the following properties can be edited in the Property Window:- Id: Every sprite needs a unique ID.
- Start: The sprite's starting point in seconds. For example, a Start value of 1 second will cause the sprite to not appear for 1 second. You can also change a sprite's start point by dragging its box left or right in the timeline.
- Marker: Optional check for whether the character has said or not said a marker. This works the same was as the Said Marker condition in dialogue. If the condition is not met during the game, the sprite will not display.
- Layer: Sprite's sorting layer. Higher values appear above lower values. All sprites on the same sorting layer will appear in the order they appear on the timeline.
- Pivot X: The sprite's X pivot, which is a percentage from the left of the sprite. You can adjust this in the Live Preview by dragging the sprite's black dot.
- Pivot Y: The sprite's Y pivot, which is a percentage from the top of the sprite. You can adjust this in the Live Preview by dragging the sprite's black dot.
Properties
To select a property, click its name on the row header in the timeline. When a property is selected, the following properties can be edited in the Property Window:- Looping: When checked, the property's animation will loop indefinitely upon reaching its last keyframe. Looping properties are represented by a looping arrow in the header and a repeat sign (𝄇) in the timeline following the last key frame.
- Easing Function: Property's easing function for tweening. See Easing above.
- Tweening Function: Property's interpolation function for tweening. See Interpolation above.
Key Frames
To select a key frame, click its diamond in the timeline. When a key frame is selected, the following properties can be edited in the Property Window:- Time: The key frame's time within the animation.
- Source: The file for the image to display. Images must be within the opponents folder, but do not have to be within your character's folder. Click the ... button to bring up a file selection form. When first adding a sprite, this is done automatically for the key frame at time 0.
- X: Sprite's X position, where X=0 means the sprite is centered horizontally. By default this is 0. When the pose's Base Height is 1400, 1 unit corresponds to 1 pixel.
- Y: Sprite's Y position, where Y=0 means the sprite is flush with the top of the canvas. By default this is 0.
- Opacity: The sprite's transparency level. 0=fully transparent and 1=fully opaque. By default this is 100.
- Scale X: Horizontal scaling factor. 1 means no scaling, 2 means double width, -1 means flip horizontally with no scaling, etc. Scaling is based on the sprite's pivot point. By default this is 1.
- Scale Y: Vertical scaling factor. 1 means no scaling, 2 means double height, -1 means flip vertically with no scaling, etc. By default this is 1.
- Rotation: Rotation in degrees where 0 is facing up. By default this is 0.
- Skew X: Sprite's horizontal skew/shear. By default this is 0.
- Skew Y: Sprite's vertical skew/shear. By default this is 0.