-edit- I recently tested exporting, and it appears to have stopped working on modern browsers. I will try to fix that when I have time.

Zapimator is an animation program designed to help you help quickly get ideas out.

Enjoy!

If you make stuff with my app, I'd love to see it, if you got a Twitter, please @ me with your cool animations! @capercube

Github Repo Link

How to use:

• A blank project starts with a 400 x 400 canvas (currently this cannot be changed without editing the project) and an empty layer, on which you can draw an image, you can view the borders of the layer by clicking "Debug" (debug graphics will be visible in the rendered video if you neglect to turn this off). You can also import an image with the "Add image layer" button on the left panel.
• Layers can be renamed by double-clicking them in the layer list.
• Layer duplication is a planned feature that is not currently working :( sorry!
• Layer order can be changed by using the up and down arrow buttons on the left panel.
• Layer blending-mode can be changed by using the blending-mode list on the right panel. The default mode is "Normal".
• Layers can be hidden and locked buy using the bottom two buttons on the left panel.
• The Top panel contains the play, frame step, loop toggle, record on click, brush, brush color, brush size, and eraser buttons as well as the timeline.
• The right panel contains the selected layer's properties as well as the length and frame-rate fields at the bottom.
• To animate a layer, select it from the list on the right, click the property animation toggle for the property you would like to animate, then click play. While a layer's property is toggled on, it records any changes, even during play-back.
• After recording, do not toggle off the layer's property you've just changed, as this will delete the recorded frames. This can be done to reset an animation.
• The "Save" and "Load" buttons on the bottom panel save your project as a .json file on your computer.
• The "Render" button will export the animation as a .webm (other video formats are planned to be supported). Once the render is complete, a preview of the video will appear at the bottom of the app. If you hover your mouse over the video, you should see a menu button which will include the option to download the video.

Whew, one of these days I'll make an proper tutorial on how to use this.

Keyboard shortcuts:

P - Play / Pause
< - Frame step back
> - Frame step forward
Shift < - First frame
Shift > - Last frame
V - Switch to move mode
B - Toggle brush mode
E - Toggle eraser mode
[ - Brush size down
] - Brush size up
Alt (in brush mode) - Pick color at mouse for brush
Alt (not in brush mode) - Pick color at mouse for background

Disclaimer: This app currently only works when using Chrome. Firefox almost works, but you might not be able to draw or export projects. This app also tends to run just a tad slow.

WARNING: This app is an early prototype, use this for large projects at your own risk! Save often if you care about your projects!