Calligraphic and Typographic

Generative Arabic Letterism works might appear callgiraphic, yet they retain a strong typographic element. This image also retains the JavaScript code that was used to generate the work. (Hint: try viewing the image's jpeg discription.

Generative Arabic Letterism works might appear calligraphic, yet they retain a strong typographic element. This image also retains the JavaScript code that was used to generate the work. (Hint: try viewing the image’s jpeg description).

The original intent of Generative Letterism was to mimic Arabic Letterism that is mostly calligraphic. I started building a database of calligraphic shapes by tracing the calligraphic elements used by the Iraqi calligrapher Khaleel Zahawi in his Letterism works. I then used computer code to arrange these letter elements in artistic compositions. The code I wrote did not generate calligraphic form by itself nor did it modify Zahawi’s calligraphic forms.

Arabic typographic art is still in its infancy.

Arabic typographic art is still in its infancy.

The approach of using unmodified “glyphs” is more akin to typographic usage of letter forms than it is to a calligraphic approach. The resulting works of Generative Letterism so far is quite close to mainstream Letterism works and the calligraphic versus the typographic basis might not matter much thereof.

Typographic art by a Persian artist.

Letterism work by a Persian artist. The effect is very typographic, especially in the ellipses. The means, however, might have been calligraphic.

One of the technical aspects of traditional Arabic calligraphy that was preserved in Letterism is the even distribution of shapes in the visual field. Solid form is usually evenly balanced with void space in calligraphic works. Conventional typography also aims to achieve this balance and hence the notion and practice of kerning is an essential element of typographic layout. The even distribution of letter forms is still a goal I am trying to achieve in Generative Arabic Letterism.

zahawi

Textural effect in Letterism results from the balanced distribution of solid and void

The code controlling the placement of letter forms in Generative Letterism includes variables that help achieve homogenous density of letter clusters in a given area of the art work. The artistic expression is very much the result of tweaking these variables as much as it results from the design of the generating algorithm. This is common in generative art.

Generative Arabic Letterism bunches the Arabic characters using mathematical formulas and a random number generator.

Generative Arabic Letterism bunches the Arabic characters using mathematical formulas and a random number generator.

In Generative Letterism the calligraphic expression is mainly preserved in the individual letter shapes that are used. The code also aims to achieve calligraphic expression by recreating the rhythm and sweep, that is characteristic to Arabic calligraphy, in the distribution of letter shapes on the art board. The difference however is easily seen and the Letterism generated so far is quite distinctive.

Expression

My approach in art and design usually originates in the aesthetic rather the symbolic. I personally value works of art with a good aesthetic appeal and bother little about the meaning of the work.

If it is beautiful, then it is art

If it is beautiful, then it is art to me. Paul Klee, Ancient Sound

But that does not mean that I do not enjoy works that embody symbolic representations. In fact I find that most people seek meaning in art and seem to value meaning over the aesthetic quality of an artwork. This has led me to consider the expressive qualities in the work I am doing in Generative Arabic Letterism.

One day I am going to be a surrealist. A work by Magritte.

One day I am going to be a surrealist. A work by Magritte.

The central driving force that has taken me through toil of making Generative Arabic Letterism work was the simple idea of making computers generate art work that looks like Arabic Letterism. As I mentioned earlier, conventional works of Arabic Letterism had the randomness that computers could easily mimic, thus encouraging me to pursue the idea to produce the works I had in mind.

When I saw these works by Wissam Shawkat, I knew I could generate them with programming.

When I saw these works by Wissam Shawkat, I knew I could generate them with programming.

In spanning the two realms of Generative Art and Arabic Letterism, I am tempted to review my work on the basis of the expressive qualities of each of these art styles.

The expressive power of character clouds

The expressive power of unpredictability. Something else was actually intended in the programming of this work. The output, however, was a pleasant surprise.

I find that most of the Generative Art works express spatial structures ranging from molecular to cosmic. They are expressive of the science and the mathematical basis of natural forms. The aesthetic and symbology of matching art with science is appealing to me and has always been an idea that I try to express in my work.

Spatial structures generated by mathematical formulas

Spatial structures generated by mathematical formulas

Being a novice in the area of generative art, my current work at this stage is rather more “Letterism” than “Generative”. Here again I find that my work retains the main expressive values of conventional Letterism in terms of deconstruction, the beauty of Arabic calligraphy, and local identity.

Art is also a product of its time and Generative Arabic Letterism, by means of its process at least, expresses many contemporary paradigms. Among these are the internet and computer paradigms that are explicitly expressed, such as the use of public knowledge available on the internet, QR code access, and USB technology.

Perhaps the strongest first impression that viewer has from a single collection of Generative Arabic Letterism works is the variety of the color schemes used. The work of artists usually show a limited spectrum of color, as they usually focus on certain color schemes in the periods of their creativity, or even on one scheme for the entirety of their work. I followed a different approach.

I habitually use the internet to brainstorm and shop for ideas. For Generative Arabic Letterism I went even further to include the internet as a direct generative variable. I can download from the internet color schemes that I use to color the generated art. This is probably a new paradigm which I also consider part of the message that comes out of Generative Arabic Letterism.

Color schemes in Generative Arabic Letterism are mostly prefabricated and downloaded from online color scheme utilities.

Color schemes in Generative Arabic Letterism are mostly prefabricated and downloaded from online color scheme utilities.

The next step I intend to implement in relation to the internet is the extraction of the digital genetic code of each work and store it on the internet. The code will live in the internet until such time comes when I want to reuse the genetic code of a certain work to generate more art from it and in relation to the original work. Owners and viewers of the original work could access the digital genetic code through a QR code stamp that appears on the nameplate of the work.

QR code will be used to access the digital genetic code of Generative Arabic Letterism works.

QR code will be used to access the digital genetic code of Generative Arabic Letterism works.

The Code

Works of art are usually introduced with the medium used to create them.Computer code is the medium of Generative Arabic Letterism. The code used starts with generic coding constructs of programmed in JavaScript and builds higher order programming objects that are capable of generating art.

The programming objects are actually abstractions in themselves. Based on its visual characteristics, Generative Arabic Lettersim could be classified within the territory of Abstract Expressionism. It is also embodies abstractions in the alphanumeric dimension in the form of the programmatic objects used to create the visual abstractions.

An example of an object is listed in the following:

// Arabic Letterism
// Khalid M. Khalid
// October 2012

// Scattering letters about a straight line

#target illustrator
#include "./letterism-core(T).jsx"
#include "./DotMachine.jsx"

function clsLetterBandFlat (fitpath, frequency, amplitude, size, density, dstyle) {
	var point = fitpath.pathPoints[0];
	var p1 = new clsPoint(point.anchor[0], point.anchor[1]);
	point = fitpath.pathPoints[1];
	var p2 = new clsPoint(point.anchor[0], point.anchor[1]);
	var d = p1.distance(p2) / frequency;
	var h;
	var w;
	var lt;
	var dt;
	var rect;
	// Todo: solve setup drawing style from within vs from outside
	var ds = new clsDrawingStyle();
	ds.fillOpacity = 60;
	ds.stroked = false;
	ds.filled - true;
	var top = p1.y + amplitude;
	for(var i = 0; i < frequency; i++) {
		for (var j = 0; j < density; j++){
			if(flipCoin(0.75)) { // 75% characters, rest dots
				h = getRandomNumber(0.75,1.5) * size * amplitude;
				//Debug
				///var ln = new clsLine(point, point.polar(ang - hpi, amplitude - h));
				//ln.draw();
				lt = new clsShapeObject();
				w = h / lt.height * lt.width;
				rect = new clsRectangle(p1.x - d * i - w / 2, top - getRandomNumber(0, 1) * (amplitude - h), w, h);
				//Debug
				//rect.draw();
				ds.fillColor = gColorScheme.getIndexedColor(getRandomInt(0, gColorScheme.palette.length));
				lt.fit(rect, ds);
			}
			else { // draw some dots
				h = getRandomNumber(0.1, 0.2) * size * amplitude;
				w = getRandomInt(5,10) * h;
				rect = new clsRectangle(p1.x - d * i - w / 2, top - getRandomNumber(0, 1) * (amplitude - h), w, h);
				ds.fillColor = gColorScheme.getIndexedColor(getRandomInt(0, gColorScheme.palette.length));
				dt = new clsDotMachine(rect, ds);
			}

		}
	}
}

var gOrigin = Origin();
gShapeTree = readXMLFile();
gColorScheme = new clsColorScheme();
gColorScheme.getAiPalette("purple");
if(app.activeDocument.selection.length > 0) {
	var p = app.activeDocument.selection[0];
	var lb = new clsLetterBandFlat(p, 20, 150, 0.5, 5);
}
gOrigin.restore();

Numeric abstractions have long since fascinated me. It was in secondary school when I studied differentiation and integration that I came to realize the capabilities of mathematics in modelling reality. My delight was heightened when I discovered the capabilities of Object Oriented Programming, where physical reality could be abstracted in programmatic objects that had properties and behavior.

Computer coding is not entirely technical. In itself, whether used to generate art or in other mainstream applications, computer programming exhibits certain aesthetic characteristics. I find that there is a kind of abstract beauty in recursion, for example, while most of the pleasure I find in programming arises from creating programmatic objects that are abstractions of some process or a real life object. Once I am successful in building a self-contained robust programmatic, I then go crazy with it by passing it the parameters that would make it do all things I want it to do. The organization of code into neat structures that represent simple and replicable solutions is indeed an artistic process as much as it is scientific.

Building the Generative Arabic Letterism system went through two stages. In the first stage the focus was on building a library of primitive objects such as points, lines, circles, rectangles, and letter shapes. Once this infrastructure is there, higher level objects made would have names that are symbolic of the art they attempt to create. You would find objects such as LetterMosaics, Centrefuges, or LetterBands each with a specific usage and visual output.

I have been using computer programming for many personal projects in the past 20 years or so. My first coding experience was with BASIC, and even that primitive language appealed to me with an aesthetic sense. I expressed my fascination then in a poem written in pseudo-BASIC syntax. The aesthetic appeal increased with the migration to more powerful procedural programming language, and ultimately with Object Oriented Programming.

My poem in BASIC is listed below:

'C H I M P S   B Y T E
'BY KHALID M. KHALID
'BAGHDAD 1991

10 CLEAR
20 EASY, SLOWLY : CLEAR
30 AND FORGET
40 WHAT THEY SAY
50 COME
60 COME TO ME
70 YOU'VE GOT EYES
80 YOU CAN SEE
90 SO WHY NOT FOR ONE TIME
100 BE FREE
110 FOR TIME=MORNING TO NIGHT
120 DAY AFTER DAY
130 IN DELIGHT
140 WITH WORDS THEY PLAY
150 NIETZSCHE SAID:"GOD IS DEAD"
160 NEXT
170 NIETZSCHE IS DEAD
180 GOTO 300
190 IS IT TRUE:IS IT TRUE:IS IT TRUE:IS IT TRUE
200 THAT ME:THAT ME
210 AND YOU:AND YOU
220 LIVE ON A PLANET OF APES
230 YOU'VE GOT EYES
240 YOU CAN SEE
250 WHAT THE NATIONAL GEOGRAPHICAL SOCIETY
260 IS DOING
270 TO YOU:TO ME
280 X$=G$+U$+I$+C$+E$
290 X$="ROT THE WORLD"
300 HELL
310 END

Yet, despite my very high interest in programming, I have not really studied programming or software engineering systematically. My approach is pragmatic and I only researched what I need to get the ideas in my mind done. Being a professional programmer was not my objective. The trick here is to follow a balanced approach in how much one would invest in learning the programming techniques that would do the job.

In many ways, I consider the internet my teacher. In most of the times it would have the answer to my questions. Whatever programming technique I needed I could find on the internet, most of the times for free. I do not remember having to purchase code for any of my projects. The internet certainly has the potential to make a shift in the learning process for the coming generations. With minimal basic education the internet could provide for the knowledge needed in any discipline.

Arabic Letterism

Arabic Letterism is a contemporary style of abstract art created by Arab artists. As the name implies, it features Arabic letters and Arabic calligraphy as the main expressive element. Arabic Letterism attempts to establish identity in Arabic abstract art and invests in the beauty of Arabic calligraphy to achieve novel forms of expression.

One of the early Letterism works that influenced me. The work is by the Tunisien, Nja Mahdaoui. Mahdaoui who was seeking for a local identity discovered a novel and very expressive abstract representation of Arabic calligraphy. His work is actually purly calligraphic. The small shape atoms that he uses embodies Arabic calligraphic content, yet they do not represent Arabic letters.

One of the early Letterism works that influenced me. The work is by the Tunisian, Nja Mahdaoui. Mahdaoui who was seeking for a local identity discovered a novel and very expressive abstract representation of Arabic calligraphy. His work is actually purely calligraphic. The small shape atoms that he uses embodies Arabic calligraphic content, yet they do not represent Arabic letters.

Calligraphic shapes, modernly expressed. A work of Arabic Letterism by Wissam Shawkat.

Arabic Letterism deviates from traditional calligraphy and combines calligraphic motifs within modern abstract art themes. Traditional calligraphy is about the aesthetic representation of semantic content through the controlled and fluid drafting of letter shapes. Letterism on the other hand is not concerned with the semantic content and is freer in the use of medium and forms of presentation.

An example of traditional Arabic calligraphy. The famous Turgra implementing the phrase: “Bismillah arrahman arraheem” (In the name of God, the Most Merciful, the Most Compassionate”.

Arabic Lettersim was not invented by calligraphers who were seeking new forms of expression. It was created by abstract artists who needed to achieve identity in the works they produced. It could also be considered as a modern interpretation of the traditional calligraphic styles. Arabic Letterism has also developed into many distinctive styles that reflect their cultural background and the approaches of their creators.

letterism

The spectrum of Arabic Letterism styles. From left to right, the shades of Arabic Letterism, range from the traditional calligraphic exercises (musawadat) to works that employ letter-like shapes. The works here from right to left include  Abbas Baghdadi, Wissam Shawkat, Nja Mahdaoui, Rasheed Quraishi, and the last on the left is by Hamza Bunoueh.

A final observation I wish to make about Arabic Letterism is its deconstructive nature. Arabic Letterism seems to be a critical and reconsidering view of Arabic calligraphy. It attempts to deconstruct the traditional usage of calligraphy in the attempt of finding a contemporary meaning and expression of the calligraphic vehicle.

Hello world!

The WordPress blogging service provides the title “Hello world” when you initiate a blog with them. I kept this title because it happens to be traditional first output from a programming language that you would learn.

In many ways the title remains appropriate to this blog about Generative Arabic Letterism. The title very well signifies the birth of a new approach to both Generative Art and Arabic Letterism. I will try to speak about Arabic Letterism in a coming article as I just wish to announce here the birth of this new experiment.

The very first automatically generated work that I made. The rectangles were meant to be contained and neatly packed within the large rectangle in the centre. The work still looks very artistic though. A space filling algorithm was used with strict rules. However, the algorithm was allowed to set the size of subdividing rectangles at random. Autonomy and randomness are the basis of the Generative Art that I try to adhere to.

The very first automatically generated work that I made. The rectangles were meant to be contained and neatly packed within the large rectangle in the centre. The work still looks very artistic though. A space filling algorithm was used with strict rules. However, the algorithm was allowed to set the size of subdividing rectangles at random. Autonomy and randomness are the basis of the Generative Art that I try to adhere to.

One of the first outputs. An attempt to fill circular wedges with the three first test letters, Waw, Dal, Noon without a dot.

My objective was to use programming to generate works of art that employed Arabic calligraphy motifs. I also aimed from the beginning to produce large works that could be displayed in galleries and other places alongside other works of art. This led me to consider using Adobe Illustrator program as the workbench for my experimentation as it both vector based and provided a programming extension.

I started experimenting with Adobe Illustrator scripting since the beginning of 2012. Adobe Illustrator provides a number of scripting options, and I settled for JavaScript for a number of reasons. I was familiar with JavaScript which I used in an earlier project, so the learning curve to its application in the Adobe platform wasn’t that steep. JavaScript is also a very flexible and forgiving language and there is a huge knowledge base available online.

I have had long experience (non-professional though) in programming. Along this experience I have come to appreciate the creation of programmatic objects following the Object Oriented Programming approach. JavaScript is not technically and Object Oriented Programming language. Yet it is flexible enough to allow some kind of Object Oriented Programming inside. Constructing objects that contain all the information and functionality that you need is really convenient. For this project I needed a few main objects that includes a database of letter shapes and another object for the individual letter shapes. I also devised a rectangle object which actually serves as the basis of letter shape positioning in the artwork.

The first attempt to create a work of art programmatically was based on area filling. The idea was to tightly fit random generated rectangles in the art board area and position an Arabic letter inside them. A recursive process was the natural solution. Through the recursive subdivision of the rectangular area of the art board, the whole of the area could be filled with rectangle. Below are some figures that illustrate the idea.

The core Arabic Letterism engine randomly selects a letter shape form the database of Arabic calligraphic letters and fits in a rectangle.

When rectangles get small, a DotMachine object takes over to fill the small rectangles with rhomboid dots used in Arabic calligraphy.

The function of the rectangle object mentioned earlier is to help in establishing the geometric order of the artwork. I created other objects to perform the coloration. These objects hold a color palette and would assign colors at random to the randomly generated rectangles and to the letter shapes, which are also selected at random from the database object.

Area filling process recursively subdivides a rectangle to nine sub-rectangles. The colors are chosen randomly. Transparency produces better schemes. The image represents one of the first outputs which shows the framework used for letter fitting.

As I hope to discuss in future articles, Generative Arabic Letterism also employs a number of contemporary paradigms in its process. The color palettes, for example, are sometimes borrowed from online color scheme web sites, such as Kuler. Generative Arabic Letterism thus attempts to build on publicly available creativity and synthesizing this knowledge in a new form of art.