Homework

I've been working on two elements of my thesis — creating a brush and a simulation of characters with social energies.

BRUSH


The first part of my thesis aims to capture people’s drawings on a touchscreen(iPad) and store them as vectors/points in arrays so they can be animated.

I had already previously had a sketch that does that tracking of the points. Instead of drawing with circles like most p5.js drawing systems will work. I wanted to draw lines to save the number of objects I was drawing and storing. The idea is that vector coordinates would be stored in an array when the mouse is pressed, then a line would be drawn using the vector and the previous vector in the array.

Log of the array. Each path is a new started line storing all of the vector points

Log of the array. Each path is a new started line storing all of the vector points

Basic brush tracking, drawn by lines

Basic brush tracking, drawn by lines

Then I found a tutorial that uses p5 to create more natural strokes based on Hook’s law. This tutorial focuses on adding “physics” to the brush so the points are delayed when drawn based on the friction/spring values that mimic the dragging motion of brushes. I was more interested in the difference in the stroke weight based on the distance of the points being made giving the effect of brush pressure. The tutorial does this by getting the velocity or the speed/distance of the lines being drawn. I translated the original tutorial into vectors and applied it into the class that I created to store all of my vectors.

Screen Recording 2024-02-28 at 11.06.59 PM.mov

The next step is adding segments in between the lines so multiple shorter lines with different stroke weights are drawn in between two points to smooth out the difference. Then by adding two lines that offset from the main line, it gives the effect of multiple brush bristles that natural brush drawings have.

Screen Recording 2024-02-28 at 11.14.16 PM.mov

Because I had the lines created in a class with the array of points I stored I was able to add some variables and animate them to make the drawings more dynamic.

Screen Recording 2024-02-28 at 11.19.42 PM.mov