Instead of keyframing every property by hand, you design a start scene and an end scene. SSHOW compares them and animates the differences — position, size, color, opacity, and more — into a smooth transition.
Note This guide currently covers scene transitions. Object-level timelines and keyframes are on the roadmap and will get their own section when they ship.
How transitions work
When you move from one scene to the next, the engine matches up objects and animates the change. The rules are simple and predictable.
- Objects with the same name across two scenes are smoothly morphed from one state to the other.
- Objects that only exist in the new scene fade in; objects that are removed fade out.
- The scene background color cross-fades between the two scenes.
Tip Give matching objects the same name in both scenes to make them morph. Rename to break the match and get a clean fade instead.
Timing
Every transition is controlled by a duration and an optional delay, and you can fine-tune timing per property.
- Duration
- How long the transition takes, in milliseconds.
- Delay
- How long to wait before the transition begins, in milliseconds.
- Per-property timing
- Override the default curve and timing for individual properties — for example, let opacity ease while position springs.
Easing
Easing shapes the pace of the motion with a curve. SSHOW ships common presets and a custom curve editor.
- Linear
- Ease in
- Ease out
- Ease in-out
- Custom curve
The curve editor lets you drag the two control points of a cubic-bezier to dial in exactly the feel you want, and saves your recent curves for reuse.
Spring
Prefer physical motion? Spring replaces the curve with a simulated spring that settles naturally. Three parameters shape it.
- Stiffness
- How strong the spring is. Higher values snap faster.
- Damping
- How quickly motion settles. Lower values bounce more before resting.
- Mass
- The weight of the object. Heavier feels slower and more sluggish.
What can animate
Transitions can move almost any visual property of an object between scenes.
- Position
- Scale
- Rotation
- Size
- Opacity
- Fills & effects
Object animation Coming soon
Transitions cover most motion by animating between two scenes. Object animation will add a true timeline — keyframing individual properties on a single object, independent of scene changes — for moments where you want fine, frame-level control.