DEV Community

Jawhar Kodadi
Jawhar Kodadi

Posted on

Exploring Moroccan Zellige Patterns with a Generative Art Tool I Created

Moroccan Zellige patterns have been captivating artists, designers, and architects for centuries. These intricate geometric designs are a symbol of the rich artistic heritage of Moroccan culture. I've always been fascinated by these patterns, and as a creative coder, I decided to build a Moroccan Zellige Pattern Generator using the p5.js library. In this article, I'll introduce you to the generator I've created, which allows users to explore the beauty of these patterns, customize them, and create their own unique designs.

Overview of the Generator:

I built the Moroccan Zellige Pattern Generator as a web-based tool that enables users to create stunning, customizable patterns using a simple graphical user interface (GUI). The tool offers various parameters to adjust, including the number of points, cell size, number of cells, shape size, rotation, and stroke width. Users can also toggle the grid display option to create a wide range of patterns.

Moroccan Zellige Patterns screenshot 1

My Inspirations:

My inspiration for creating this generator came from my love for Moroccan Zellige patterns and my passion for creative coding. I wanted to create a tool that would make it easy for users to explore these beautiful designs and have fun experimenting with different parameters to create unique patterns.

Using the Generator:

Visit the Moroccan Zellige Pattern Generator webpage.
Begin by adjusting the parameters in the GUI to create your desired pattern. Experiment with different values and settings to explore the full range of possibilities.
Toggle the grid display option to further customize your design.
Once you have created a pattern you are satisfied with, click the "Save as SVG" button to download the SVG file.
Use the exported SVG in your design projects, or share your generated patterns with others.

Screenshots :

Moroccan Zellige Patterns screenshot 1

Moroccan Zellige Patterns screenshot 2

Moroccan Zellige Patterns screenshot 3

Moroccan Zellige Patterns screenshot 4

Image description

How to make it better ?

I would appreciate feedback on the user experience and interface of the Moroccan Zellige Pattern Generator. Are the customization options intuitive and easy to use? Do you have any suggestions for additional features or improvements to the current parameters? Your insights will be valuable in refining the tool. Thank you!

Top comments (0)