Author: Joud Labadi

Concept and inspiration

I thought a lot about what could be something to make this project about; I finally settled on two: Islamic geometric patterns and my passion for Arabic calligraphy.

I started learning calligraphy since I was in 8th grade, and one thing about calligraphy, and specifically the Jali Diwani type, is the layering. We start by writing the words or sentence, then the short vowels, and then we start decorating with different decorative elements. My idea for the midterm was inspired by this technique. I wanted to make a drawing by layering different drawings on top of each other. Additionally, I also wanted to mix Islamic geometry and its rigid, symmetrical designs with the Jali Diwani’s artistic, flowing design.

Inspirations:

Calligraphy:

Islamic Geometric Patterns:

Code and Algorithm

For the coding part, I used p5.js to create the designs by creating three separate layers, each with its own purpose. The first layer focuses on the eightfold rosettes and the main geometric structure, while the second adds more shapes and details to make the pattern more intricate. The third layer is different from the first two; it uses small circles and flowing lines inspired by Jali Diwani calligraphy to decorate the existing geometry without overwhelming it. I used loops, rotation, and mathematical rules to repeat the shapes across the page while keeping them aligned. By saving each layer as a separate file, I can place the drawings on top of each other and see how they combine into one composition. This approach also makes it easier to adjust individual layers and explore how the final design will look when drawn by the pen plotter.

Code outputs:

Layer 1: Base

Layer 2: Additions

Layer 3: Final touches

P5.js links:

https://editor.p5js.org/Joud_290/full/IvglpFPOZ

https://editor.p5js.org/Joud_290/full/eKW6_qDji

https://editor.p5js.org/Joud_290/full/InmCvDeha

Then, I tried to visualize the output in Inkscape to see how the three layers align together

Experimentation

Since there was a lot of overlapping, I wanted to experiment with a drawing that had a lot of overlapping first to see how it would work on paper. So this was the first experiment with the pen plotter. I experimented using different colored pens.

Afterwards, I started experimenting with different kinds of simple tiling, as my idea is all about layering and tiling

first with repeating circles:

Another one was with five pointed stars

Then I tried to make more than one simple repeating shape, which will be similar to the final version of the project

One thing about these experiments was that the pen plotter was not very stable when it came to lifting the pen off the paper; as shown in the pictures, it sometimes started marking the movement of the pen between the shapes as well.

From the first experiment, I realized that A4 paper will not be the best to use for layering, so I started experimenting with thicker papers:

More experimentation:

Final drawings

Layer 1:

Layer 2:

Layer 3:

Final combination:

Reflection

Throughout this project, I realized that creating a design digitally and actually drawing it using the pen plotter are two different things. One of the biggest challenges I faced was the pen plotter itself. During my first experiments, I noticed that the pen was not always lifting properly when moving between shapes, which caused unwanted lines to appear on the paper. This was especially noticeable in drawings with a lot of repeated shapes. Similarly, the pen sometimes was not on the paper while drawing, which made some parts of the drawings missing. Although these changes were not part of the original design, they made me realize how the machine’s behavior can affect the final result. I had to pay more attention to the spacing and alignment of my shapes, rather than only focusing on how the design looked on the screen.

Another important part of my experimentation was using different colored pens. I chose blue, black, and pink because I wanted each layer to be distinguishable while still working together as one composition. Blue and pink added contrast and made the overlapping lines more interesting. I also liked how the colors interacted when the lines crossed each other. Some overlapping areas appeared darker, creating an additional level of detail that was not noticeable in the digital version. This also helped me explore the contrast between the rigid symmetry of Islamic geometric patterns and the softer, flowing lines inspired by Jali Diwani calligraphy.

I also experimented with different types of paper. From my first trials, I realized that regular A4 printer paper was not the best choice for a drawing with so many overlapping lines. I decided to try thicker paper, which provided a more suitable surface for the repeated pen strokes and made the final drawing feel more substantial. The paper itself became an important part of the process, rather than just something to draw on.

Overall, I enjoyed seeing how a design created using simple coding rules could become something much more detailed when translated into a physical drawing. I also learned that the final result does not depend only on the code but also on the pen plotter, the pens, and the material being used. What I found most interesting was how the three layers gradually came together, similar to the process of Jali Diwani calligraphy that originally inspired my idea. If I were to develop this project further, I would experiment more with the placement of the decorative details and the order of the colored layers to see how they could change the final composition.

Concept

My design is based on how a simple rule can create an organic-looking form. I started with the basic idea of a snowflake (or a flower, idk :)) and represented each spike as a repeated rectangular block arranged radially around a central point. Instead of making all the spikes identical, I used a mathematical function to change the radius and height of each spike. This creates controlled variation, making the snowflake look less mechanical and more natural.

I also wanted to add some kind of random element into this assignment, which serves the concept well because randomness is a part of how nature works. The code also randomly generates the number of spikes, ranging from 3 to 7, so each version of the design can be slightly different. As a result, the final object sits somewhere between natural growth and structure.

I was particularly interested in exploring how I can depict the difference between natural imperfections and computer-generated repetition. I tried to recreate this idea computationally rather than manually designing every spike.

p5j sketch

https://editor.p5js.org/Joud_290/full/eqZRVQq_E

p5j generated pictures

The random function was used to determine the number of spikes/petals of the object. I set it to be between 3 and 8.

Prusa Slicer

The object after slicing on Prusa Slicer

Final physical result

In p5.js, I first created the flower shape using repeated petals, rotation, and some mathematical variation. At this stage, it was mainly about getting the overall pattern and shape that I wanted.

When I imported it into PrusaSlicer, I could see how the design would actually work as a 3D object. It was the step to check for any errors in terms of connectivity, edges, etc. After editing, the shape became more solid, and I could see the thickness and the way the spikes would be printed layer by layer. There was initially a problem with open edges, but it got resolved

The final 3D print ended up being very similar to the PrusaSlicer preview. There were only small differences from the physical printing process, but the details of the shape stayed the same. This was useful because it showed me that the design I created digitally translated quite well into the actual object.

I also found that each stage showed something different. p5.js was just for creating the pattern, PrusaSlicer was for preparing it for printing and running to see if it has any problems, and the final print showed how the design actually worked as a physical object.

Reflection

never tried designing 3D objects with code before, so even though it was challenging at the beginning, it was a fun project to work on. I learned how to use different techniques in p5.js to get a specific shape that I wanted. I used sine waves to control the size and height of the petals and make the design change more smoothly. I also learned that creating something digitally and turning it into a physical object are two different steps. Seeing the design in PrusaSlicer and then as an actual 3D print helped me understand how the code and the physical printing process connect. Overall, this project helped me become more comfortable with using code as a way to create and experiment with 3D forms.

Concept

My design explores how a simple shape can create a more complex visual pattern through repetition and variation. I began with a grid of repeated shapes and used a rule based on distance from the center. This allowed the individual shapes to change gradually across the design rather than just translating identical shapes.

I experimented with this pattern with circles and squares. In the circle design, the circles become larger toward the center and smaller toward the edges. For the square design, I added variation by changing both the size and rotation of the squares based on their distance from the center of the grid.

The goal was to see how a simple variation could produce a more complex overall physical pattern when fabricated.

Digital experimentation 

I first experimented with the spacing and size of the repeated shapes in p5.js. I changed the spacing between the shapes and the maximum size of the shapes to see how these changes affected the density of the pattern.

I then used the distance of each shape from the center to control its size. This created a gradual transition from smaller shapes on the edges to larger shapes moving toward the center.

After testing the circle version, I experimented with squares. The square design introduced another variable, which is rotation. The amount of rotation changed depending on the square’s distance from the center, just like the size, creating a more dynamic pattern than the circle version.

Code for squares:

let cols = 15;
let rows = 15;
let spacing = 16;
let maxSize = 14;

function setup() {

createCanvas(250, 250, SVG);

noFill();
stroke(0);
strokeWeight(1);

drawPattern();

noLoop();
}

function drawPattern() {

let centerX = width / 2;
let centerY = height / 2;

for (let row = 0; row < rows; row++) {

for (let col = 0; col < cols; col++) {

  let x = 10 + col * spacing;
  let y = 10 + row * spacing;

  let distance = dist(
    x,
    y,
    centerX,
    centerY
  );

  let size = map(
    distance,
    0,
    170,
    maxSize,
    3
  );

  push();

  translate(x, y);

  rotate(distance * 0.03);

  square(
    -size / 2,
    -size / 2,
    size
  );

  pop();
}

}
}

function mouseClicked() {
save(“squares.svg”);
}

Code output trials: 

Fabrication experiments

I fabricated multiple versions of the designs to compare how the digital patterns translated into physical material would look. The first physical version used the circular pattern using cardboard. The result showed a clear gradient in the size of the openings, with larger openings toward the center and smaller openings toward the edges. 

Trial 1:

I then fabricated the square pattern using acrylic. During fabrication, I encountered a problem in the center of the design. Because the spacing and geometry caused the material between some of the openings to become too thin, the center of the piece became weaker than intended, so the pieces close to the center started falling.

Trial 2

In the next version, the design remained based on the same square pattern, but the adjustment caused the overall pattern to shift slightly from the center. Although this was not exactly the result I originally intended, it became another useful observation about the relationship between the digital design on p5.js and the physical fabrication process.

Reflection

Overall, I experimented with shape, size, spacing, rotation, and the relationship between the digital pattern and the physical material. The physical results helped me understand how generative design needs to account for both visual rules and material constraints.

Concept

For this project, I wanted to create a simple low-tech drawing system that combines my control with an element of randomness. My idea was to use a spherical object covered in paint and allow it to move across a sheet of paper, creating lines and marks as it moves. I would control the marble’s movement indirectly by tilting or moving the surface. The marble rolls, changes direction, and interacts with the edges of the surface, making it difficult to predict the exact drawing in advance. I was curious to explore how a simple system could produce a result I could influence but not fully control.

The Drawing Machine

My drawing machine was made using a hard surface (my discrete book) that I can move, a blank sheet of paper, edges made of paper board, ink, and a roughly spherical object made from paper and a marble covered in tape. I taped the paper to the surface and placed the edges so that the marble wouldn’t fall out, and covered the marble and the paper object with red ink. I then moved the surface in different directions, allowing the ball to roll across the paper and leave paint marks behind. The surface provided a stable ground for the marble to move freely. However, its uneven shape made its path less predictable. The machine’s focus was on the process of producing the drawing rather than on building a complicated mechanism.

Below are a couple of trials where I was testing how much the edges could remain in place when moving the marble and the paper around.

Drawing Outputs

I produced several drawings by changing the way I moved the surface. In some attempts, I moved the surface slowly and gently, which allowed the ball to create more controlled lines. In other attempts, the marble would get stuck near the edges, and the paper sphere often stopped producing more irregular and overlapping marks. The amount of paint and the shape of the ball also affected the results. Although I could influence the general movement, I could not determine the exact path of every line. This made each drawing unique, even though they were created using the same objects.
Trial 1 output:

Trial 2 output:

Trial 3:

Process and Challenges

The process began with finding materials that could work together to create a simple drawing machine. One challenge was finding a suitable spherical object. Since I did not initially have a marble available, I considered making one from aluminum foil. However, the object did not end up being perfectly spherical, but its irregular shape could actually contribute to the unpredictability of the drawing. Another challenge was controlling the amount of paint. Too much paint could create large smudges, while too little might make the marks difficult to see. I also had to experiment with how much to tilt or move the surface. Through these experiments, I learned that small changes in the materials or movement could produce noticeably different results. Also, one challenge was that while the marble moved more or less normally, the spherical paper ball barely moved, which made the results unexpected. In addition to the way I tried to tape everything together, sometimes the tape would not hold the edges properly, which caused the marble to fall out of the edges.

Reflection: Control, Chance, and Authorship

This project made me think about the difference between controlling a drawing and creating the conditions for a drawing to happen. I controlled the materials, the design of the machine, the amount of paint, and the general movement of the surface. However, I did not control the exact path of the marble or the final drawing. The imperfect shape of the marble, its interactions with the surface, and the movement of the paint introduced an element of chance. I still consider myself the author of the work because I designed the system and made the decisions that allowed the drawings to exist. In addition to moving the surface. However, the final images were produced through a collaboration between moving the surface by myself, the machine itself, and the unpredictable movement of the imperfect marble.

Relation to Sol LeWitt’s Paragraphs on Conceptual Art

In relation to Sol LeWitt’s Paragraphs on Conceptual Art, I think the main idea of my drawing is in the way I designed the machine and the process I used. The final drawing is important, but I think the idea behind how it was made matters more. I chose the materials and decided how the ball would move, but I couldn’t fully control the lines it created. The machine and chance helped shape the final result. For me, the drawing is about the process and the balance between what I control and what I leave to chance.