0b5vr/automaton

Animation engine for creative coding

Animation engine for creative coding

Playground! (Tutorial)

Try our playground! It comes with bunch of examples.

https://0b5vr.github.io/automaton/automaton-with-gui

You might want to also check examples of the core package.

What is this

Automaton is an animation engine for creative coding. While you're doing creative coding, doing time-based animation by code sometimes causes you so much pain. This project provides a framework and its GUI to connect your coding pieces with animations.

It's intended to be used in 64k intro, so I'm trying my best to make its footprint as small as possible. The package automaton have a minimal set of features that is required to play animations and it does not have any dependencies. The package automaton-with-gui intended to be used in development stage is pretty big since it contains third party codes like React.

Packages

• @0b5vr/automaton
  • Core package of the automaton
• @0b5vr/automaton-fxs
  • A package that contains bunch of automaton fxs
• @0b5vr/automaton-fxs-v2compat
  • A package that contains Automaton v2 compatibility fxs
• @0b5vr/automaton-with-gui
  • A variant of automaton that comes with GUI!

Friend projects

• automaton-electron
  • Electron client of automaton
• automaton-lua
  • Lua binding of automaton

Have a problem?

There are pretty much no users other than me so lacks documents if you want to use. Please feel free to ask questions on Twitter ❤

License

MIT

automaton's Issues

Get rid of gulp+browserify (new build system)

Since it's weird

Requirements

• Compatible with Vue and TypeScript (or Babel)
• Can output .js, .min.js and .nogui.js
• Easy to read/write npm scripts

`automaton.load()` should perform re-render and history-drop

TypeScript: let's give it a shot

Ghost other curve

Show other parameters curve. should be togglable

CONTRIBUTING.md

is good

GUI beat snap triplet and shuffle

GUI: Make curve unique

it should preserve channel events when deserializing a data??

Use beat as a time unit in GUI

Make entrance more friendly

• How to use section on root README
• Intention on root README
• Add descriptions about iife names
• Link back to GitHub from the playground
• Note that the project doesn't have any user other than me

Docs does not work properly

I have no idea how http://fms-cat.com/automaton/docs/modules/_automaton_.html does not work

I didn't know the concept called .npmignore has its own existence

holy

Introducing unit test

I heard mocha + chai combo is very good to do

Blender-like timeline exploring with mouse

like, Left click + drag = move, Middle click + drag = zoom

typescript don't like tuple defined in json

we probably want to change SerializedBezierNode to mere number[] ...?

"MIT License" link on about screen cannot be pressed

nooooooo

multiple selection -> delete

should be relatively easy

region repeat

playlist

ah,,,

easier save

Using LocalStorage or FileSystem

size, interoperability oriented new serialization format

Channel.update should not emit events

Imagine using a value of channel B from update event of channel A, the value taken from auto( 'B' ) inside of the event listener is a value from previous frame, which makes a massive disaster when you are seeking.
I want to cue events while it's doing Channel.update and then execute the listeners using Channel.consumeEvents after every channels are updated

GUI: terribly slow with a lot of timeline items

gui: theming

paramlist's char size is too big / looks pretty bad with long param name

Trying to create node while no param is selected spits an error

holy sh

EventEmittable -> Observable

see if it's easier to maintain...

I might also introduce observable to the core

ChannelList/CurveList: Ctrl+Shift+wheel to zoom horizontally and vertically at the same time?

multiple selection

i fucking know

Seek on timeline doesn't work properly when it's x-zoomed

lit

Repeat curves on channel

Shift + Drag nodes under snapping does weird

It fixes vertical movement but still snaps it to nearest snap, this is not intended behavior

Bezier curve does ultraweird behavior under start.value == end.value

NaN de

Event emission!!

What I wanted to do:

automaton.on( 'scene/something', ( event ) => {
  console.log( event.type ); // 'start' | 'update' | 'end'
  console.log( event.progress ); // 0.0 - 1.0
  // time, beginTime, endTime or whatever
} );

I completely have no idea what kind of UI is the best to achieve this shit 😩
Possibly pianorolls??????? I'm dumb

Async precalc

since some fx process can be a performance issue