GDV P.2.3.5 Drawing with the pen tablet

Here is the original text which I copied from the Generative Design website. Compared to a conventional mouse, a pen tablet puts several more parameters at a user’s disposal, including pressure and position. When drawing, the pen movement can be better recorded and interpreted so that the movement of your hand can be reproduced more accurately. When you use a pen tablet you are closer to the generative process. The other parameters provided by a pen tablet are transferred to a basic element (in this case a pen). The azimuth, pressure and inclination define the rotation, saturation, and length, respectively, of the element. The parameters are read using the tablet classes of the book’s Generative Design Library. The form is not loaded from an SVG file but rather drawn as a curve, enabling the individual curve points to be manipulated more easily. And here you can find the original code where I started with:

For everyone who is not able to work with Processing I have put all the variations of images I have made on a Flickr summary page which you can find here:

Because all the programs I worked with are using the Generative Design Library it is not possible to show the JavaScript version. Unfortunately JavaScript does not support the Generative Design Library. Instead I have provided the Processing sketches when you click on the previews on this page:

To start off I tried to find out why the function frameRate is used in the original code. So I switched it off (commented it out). But even when switched off the program just keeps on painting the objects. When frameRate (10) the drawing lags behind. FrameRate (30) seems to be right but I’ll switch it off for the time being. I did not see any reason to switch it on again.

While checking what the other keys were doing I noticed that the more you push the pen the higher the saturation and lesser transparency becomes. The (vertical) position of the pen changes the shape of the drawn object. And when I change the orientation of the Wacom tablet itself? Well it seems that it influences the angle aswell. And you can draw curtain-like images with it 🙂

I did not like the white stroke around the objects. Switched StrokeWeight off. In case 1 it doesn’t draw anything. In case 2 and 3 it still draws (the default) black stroke. Switched noStroke on in setup. Used grey as a placeholder. In case 1 it makes very muddy images.

Did some experimentation with the grey color. Replaced it by almost a full red. If it can be red it can be every color. Eh… case 3: color julia? That must be a joke referring to Julia Laub of the Generative Design team (I think).

Another thing which I do not like is the shape of the drawing-object. I wonder if it is possible to change that too. I changed the elementLength (or penLength) to 2000. This gives the possibility to draw shapes which remind you at cloth or silk-like structures.

In the initialization part at the top of the program I changed the variables FromColor and ToColor to yellow. Gave it an alpha of 20. I think some color adaptation is needed in the keyReleased part. Changed that too. And gave them all an alpha of 20. h1 and h2 are a bit cryptical names for me. So I changed those to radiusTop and radiusBottom. Might not the best name but it is less mysterious (for me). Removed all random things and gave radiusTop and radiusBottom a value of 2. Still in curtain mode though.

What happens if I give the two radii negative values? For instance -20? Well… not much. I changed it now to -100 and there seems to appear a kind of curve. Lets exaggerate that and change it to -1000 for both radiusBottom and radiusTop. I get straight lines. Lets divide them into -500. Still doesn’t make sense. -250? Back to where we started? -100 than?

Changed radiusBottom and radiusTop both to -50. Changed julia to green (0, 255, 0, julia). Changed the elementLength = penLenght * 100. Changed the randomness of radiusBottom and radiusTop to a 100. But I do not like that the element stays green. The 6, 7, 8, 9, and 0 keys have no influence on the green color. So I commented out the complete julia and replaced it with the code of case 2 (with a little change). I also changed all alpha’s from 20 to 40 because I thought that the image would better stand out.

Checking if changing some numbers in the array is giving me some new opportunities. Changed the elementLength but it did not give me any new ideas. Changed the strokeWeight in julia. That seems not to matter at all. Switched off noStroke in setup. That did not help. In case 1, 2 and 3 I replaced fill by stroke. A lot of minor changes which did not lead to any sensible result. Changed elementLength to 1000. So I tried to restore some of the original settings and finally ended with taking an espresso.

After that espresso I changed (just for  fun) the tablet’s position 90 degrees anti-clockwise. That gives a totally different image when drawing with the same settings. Did the same with a 90 degrees clockwise change of the tablet. Tried one with 180 degrees. That was a difficult task. But it gave me an interesting image. Switched penLength back to * 250. That was its original setting. And started to draw a kind of Northern Lights vertical swinging lines.

Restored the original float radiusBottom (line 113). But it did not give good results. Changed radiusTop to 80 and started drawing horizontal lines.

Set all alpha channels to 5. RadiusBottom random (400). And radiusTop to 80. Now its a matter of point and click to place the objects.

Multiplied elementLength (line 161) * 5.33. This gives cloud-like images. Or if you might make vertical movements it can give vertical structures

Doubled the elementLength (line 161) and made horizontal movements with the pen on the tablet. After that I multiplied penLenght to 1000. And made vertical movements to get transparent plastic-foil-like images.

In this version almost all settings are the same as in the beginning. except for case 1 and case 3. Julia has changed lately (and I see change as a positive thing 🙂

Henk Lamers


Comments? Leave a reply.

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s