Project Overview
For this midterm I wanted to approach Islamic geometric ornament as a system rather than a style. Instead of drawing an 8-fold star, I reconstructed the {8,8,4} tiling that produces it. The star is not designed first. It emerges from a checkerboard of octagons and squares.
I was interested in exposing the structure behind something we often read as decorative. Girih patterns are precise, proportional, and rule-based. They are algorithmic long before computers existed. After reconstructing the grid mathematically, I introduced controlled oscillation. The geometry breathes. The valleys of the star expand and contract subtly, but the proportional relationships remain intact.
This project investigates:
• Ornament as system
• Pattern as consequence
• Tradition as computation
• Geometry as inheritance
The woven strapwork illusion is achieved through layered strokes only. There is no shading or depth simulation. The complexity comes from repetition and constraint.
Oscillation
The motion in the system is driven by a minimal oscillator that functions as a time engine. Rather than animating positions directly, I use a simple class that increments a time variable at a steady speed. This time value feeds into a sine function, which subtly modulates the inward valley radius of each tile.
Instead of having every tile move in perfect synchronization, I introduce phase offsets based on distance from the center. This causes the oscillation to ripple outward across the field. The pattern breathes, but it does not collapse. The proportional relationships remain intact. The system moves without losing structural stability.
The {8,8,4} Grid
The foundation of the project is the alternating tiling of octagons and squares, known as the {8,8,4} tiling. The grid is constructed as a checkerboard: when the sum of the tile indices is even, an octagon is placed; when it is odd, a square is placed.
The spacing of the grid is determined by the apothems of the octagon and square. These radii define the structural rhythm of the tiling and ensure that the shapes interlock precisely. Every star, intersection, and strapwork path derives from these underlying geometric relationships.
I included a toggle that reveals this hidden construction grid. Conceptually, this was important. I did not want the ornament to detach from its mathematical logic. The beauty of the pattern comes from its structure, and I wanted that structure to remain visible.
Strapwork Construction
Each tile generates strapwork by alternating between two radii: the midpoint radius and the inward valley radius.
The process is repetitive and rule-based. First, the path crosses the midpoint of a hidden polygon edge. Then it rotates halfway between edges and moves inward to form a valley. This sequence repeats around the polygon.
The 8-fold star is not explicitly drawn. It emerges from this alternating rhythm. The star is a consequence of structure, not a predefined graphic element.
The Weave Illusion
The woven ribbon effect is created through two drawing passes of the exact same geometry.
The first pass uses a thick black stroke to establish the structural band. The second pass uses a thinner white stroke on top of it. This layering creates the illusion of interlacing.
There is no masking, depth simulation, or z-index manipulation. The woven effect emerges purely from stroke layering. I wanted the illusion to remain structurally honest and consistent with the logic of the system.
Interface
The interface is intentionally minimal. It includes a morph slider, a thickness slider, a hidden grid toggle, and simple keyboard controls to pause or save the canvas.
The morph slider controls how deeply the valleys cut inward. At a value of 50, the star sits in a balanced classical configuration. Moving away from this midpoint exaggerates or compresses the geometry, revealing how sensitive the form is to proportional change.
The interface supports exploration, but it does not overpower the geometry. The system remains the focus.
Video Documentation
what I intended to print at the cat
Reflection
This project shifted how I understand Islamic ornament.The 8-fold star is not a symbol to be drawn. It is a structural outcome.Working through the math made me realize that the beauty of girih lies in constraint. The system is strict, but the visual outcomes feel expansive.
What works:
• Immediate feedback through sliders
• Conceptual clarity via grid toggle
• Subtle motion that remains architectural
What I would develop further:
• Introduce color logic tied to oscillation
• Allow zooming and panning
• Experiment with density variation
• Explore extrusion into 3D space
This project feels like the beginning of a larger investigation into computational ornament and inherited geometry.
References
Conceptual Influences
• Islamic girih tiling systems
• Archimedean {8,8,4} tiling
• Khatam geometric construction
Technical Resources
• p5.js documentation
• The Nature of Code- Daniel Shiffman
• Trigonometric construction of regular polygons
AI Disclosure
AI tools were used to refine some code language when encountered functioning errors. All geometric logic and implementation were developed independently.