Iropke Batang Typo Motion

Masking & Motion

React-based motion tool

When I had to develop a typography motion, I implemented the keyframe editing method such as After Effects in React and developed a masking motion tool so that it could be used when a similar motion was given.

In edit mode, keyframes can be inserted in the form of nodes to set long and short delays for motion, and grouped so they can be played sequentially or simultaneously.

The position of the inserted keyframe node can be moved by dragging or removed by right-clicking, and the masking effect is reflected in real time.

In motion preview mode, you can check the edited content with keyframes inserted, and it can be saved in json format, at distribution, the json is loaded and the motion is executed.