Objects: Programmatic design app
After getting an iPad pro, as everyone, we started playing with amazing Procreate
app. Personally, I do not have that much of drawing skills but I like to draw lines, cubes and geometric patterns on paper when I am bored. That made me think about a small drawing/design app which allows users to create such things with a programmable interface.
First draft
Then I started playing in my 15 minutes free time in a day. (Having one boy and a baby takes all your free time away). Here is the first ever demo.
https://jsbin.com/siyafut/15/edit?js,output
How to use
Program will have 3 main components.
Object: Will serve a basis to creating patterns. Object can be a rectangle, circle, free drawing and so on. User will be able to change the look of object through styling properties.
Cloner: Can be applied to objects. This will clone the object in a specific way and create a pattern (group in fabricjs). After that, another(or the same cloner) can be applied to the end result.
Modifier: Can be applied only groups, since, modifies the objects in group in some structured way. Can create a color gradient, can change some arbitrary propery of all the objects depending on some custom function (linear, exp, ...)
There will be read-to-use cloners and modifiers and user can copy and edit the code. Or, crete new cloners or modifiers from scratch, with code and/or some UI.
This is starting of a fun project which I do not commit anything.
The next demo:
- Separate cloners (circular, pyramid) and modifiers (opacity modifier)
- Make cloner parameters (clone count) editable with a UI, some range sliders.
- Keep the position and size properties of the resulting group while changing cloner/modifier parameters.