Topic: Geppetto is a free animation tool to embed WebGL animations in a website

[Software Santa]

Geppetto is a free and open animation tool to embed WebGL animations in a website

https://geppetto.js.org/

Geppetto is a free and open animation tool to embed WebGL animations in a website


Geppetto
WebGL animation toolkit to create beautiful animations that also allow real-time control.

Download the desktop app to create Geppetto Animations:

Windows
    Windows version

Mac
    x64 version
    arm64 version

Linux
    amd64 version
    arm64 version

Online resouces
    Manual
    Forum
    Repository Desktop app
    Changelog

Embed animations on a site
    Library on NPM
    Repository Player lib
    API Documentation
Geppetto is a free and open animation tool to create and embed webGL animations in a web site. This is the repository for the desktop app to create the animations. Made with Create React App and Electron.

    Geppetto demo
    Geppetto JavaScript Player library
    Documentation
    Discussions

What is Geppetto?
Geppetto consists of two parts. A desktop application to define animated images, and a JavaScript library to play them.


How does it work?
You need to create a texture file as .PNG. in Geppetto you will make layers from your texture, and compose them into your image. Next step is to add mutations to your layer tree to create motion. You can then create timelines to define multiple animations.

These animations (the created .json file and your texture .png) can then be loaded using the geppetto player and embedded in a website or electron app.


Geppetto is meant to be an application to create WebGL Animations. The process of creating an animation has the following steps:

    Create a texture (outside of Geppetto)
    Create layers from the texture
    Stack/place the layers
    Add mutations to the layers
    Create controls on the mutations
    Create animation tracks from the controls

The contents of step 1 is your texture (most of the time: a .png file) The contents of the other steps will be stored in a .json file.

https://github.com/matthijsgroen/geppetto

https://www.electronjs.org/apps/geppetto

https://geppetto.js.org/