GlyphfieldDocs
Documentation/System reference

Motion overview

Choose between Animation, Lottie, and Design Lab for motion work by comparing their inputs, timing models, frame rates, and export formats.

Maintained with source

Glyphfield Studio has three tools that produce motion: Animation, Lottie, and Design Lab (the layered composition tool). All three take live materials from the Shader Library with its palettes and material time model. All three encode GIF with the same library and encode MP4 in the browser with the same encoder.

General Translation Animation sequence with storyboard and inspector
AnimationScenes · keyframes · audio
Lottie editor with a General Translation motion study
LottieVector playback · markers · recolor
NeedTool
A sequence of text, logo, and image scenes with transitions, keyframes, text entrances, captions, and audioAnimation
Playback, editing, recoloring, and trimming of a Lottie JSON or .lottie fileLottie
A layered poster whose shaders move, or a clip that cuts through several shadersDesign Lab
Choosing and tuning a live materialShader Library

Tool comparison

AnimationLottieDesign Lab
InputText frames, the brand mark, local images, audio filesBuilt-in studies, local .lottie or JSON filesLayers on artboards
TimingA hold and an outgoing transition per scene on a storyboard, and layer keyframesThe Lottie file's frames, in and out points, markers, speed, and directionShader time, and an optional shader sequence of 8–12 materials
BackgroundSolid, gradient, or a Shader Library material behind every scene, with per-scene overridesTransparent, a solid color, or a live materialAny number of shader layers
ExportsGIF, MP4 with audio, PNG poster frame, project filePNG frame, GIF, MP4, edited JSON or the original .lottiePNG, JPG, GIF, MP4, shader-sequence GIF and MP4, project file
Frame rates10, 15, 20, 24, 30 FPSGIF 25 FPS, MP4 30 FPS12, 15, 24, 30, 60 FPS
AudioYes, in MP4 onlyNoNo
Browser APIanimation.*lottie.*design.*

Shared rules

  • Each tool runs one export at a time.
  • GIF has no audio channel.
  • MP4 needs a browser video encoder. Glyphfield tries H.264 first and reports a missing encoder as an error. It does not produce a GIF in place of the MP4.
  • Stateful materials, such as Fluid Energy and the interactive Shaders.com materials, cannot be reproduced from a time value. Animation and Lottie refuse to export motion over a stateful background. Design Lab exports exact stills of them and refuses motion that samples them by timestamp.
  • A continuous animation clock does not make a seamless loop. Inspect several frames and the seam of every looping file.
  • Studio follows the prefers-reduced-motion setting, and Reduce motion in Visual settings pauses decorative effects. Exports still contain the full requested motion.

On this page