Started: 2015
Last Updated: 2019
Art Studio is a painting tool. My goal was to provide basic drawing tool functionality while keeping the design intuitive and fun, with features represented by stylized versions of their real-world counterparts, rather than by menus and buttons.
Click on the brushes to use them. Click and drag to paint, or right click to fill the whole canvas. Click the pencil to use it. Holding right click with the pencil will erase (draw white). Click the undo button to undo the last stroke or paint fill. Click on the paint splotches in the palette to change colors, or click on the paint tube to select a color using rgb sliders. From the color picker, click the save icon to save the current color to one of the four slots. Click on any of the saved colors to switch to that color. Click on a saved color, then the trashcan icon, to remove it from its slot. Click the bowl of water to reduce the opacity of the paint. Click the paper towel to reset to fully opaque.
Added a "water bowl" and "paper towel" which allow the user to control the opacity of the stroke.
Moved from Khan Academy to this website. Added a color picker. Users can select colors, save them to four slots of storage, and remove colors from storage.
Added pencil and eraser.
Added a "paintbucket" tool: users can right click to cover the entire canvas. Bug fix: paintbrush no longer displays under undo button.
First release on Khan Academy using their interactive processing.js editor. Paintbrushes, palette, canvas, painting functionality, undo button.
Source Code for Art Studio
The source code is licensed under
Attribution-NonCommercial-ShareAlike 3.0 Unported (CC BY-NC-SA 3.0)