Paper’s No.

BUE-FISC – MCAA 09
-
Motion Effects of Arabic Typography on Screen -Based Media

ABSTRACT:
The term of motion Typography is used primarily in a visual communication
based on the visual display, as we can adjust the font moving through the
screen. We can say that the term of motion typography is a general term
which express the motion of the text that requires changing in the spatial
arrangement of typographic elements when adding the dimension of time. In
This paper we discuss the concepts and the different effects of motion Arabic
typography. We show what extent the general characteristics of Arabic
writing and letterform impact on the nature of the movement. We represent
how we can get Harmonious and fluent movement for Arabic fonts in digital
communication media. On the other side, the research present new kind of
motion text called “karrataine typography”.

Conference Topic: Multimedia

Keywords:
Arabic Typography, Motion Typography, Kinetic Typography, Fluid
Typography, Temporal Typography.

1. INTRODUCTION:

There is no doubt that motion typography is a new way of communication, which differs from the methods
provided by the static (printed) typography. The ways of expression extend through the digital media,
furthermore, they open the possibility of communication with others through time. Unlike the static typography -
in the printing media- more possibilities can be detected by adding the dimension of time, which is impossible to
be represented in the paper media. The electronic display media differs from its predecessor of paper media in
clarity and the ability to view large size of information. An Establishment of a new visual languages to display
information can exploit unique capabilities of the computer to create animated and three-dimensional text. The
use of motion on the computer screen has a role in changing how we design, read, and interact with typography.
After the spread of computer systems, the design and implementation of digital fonts has been developed.
This development is accelerating by time, which led to the emergence of new technologies and solutions. In spite
of the number of font designers in the world increasingly dramatically – because this specialization is available
in many universities and taught in the departments of visual arts or visual communication in the faculties of arts
and architecture- it is facing significant weakness in the Arab world, and the number of digital Arabic font
designers are too few to be distinct.
When we look to the Digital Arabic Font, we find that most of these fonts that have emerged so far did not
represent even a part of the aesthetics of Arabic fonts. Despite the good attempts emergence of Arabic letter form
in printing fields on the computer, but these attempts were not enough to make the font fits with the logic of
movement, without compromising with the aesthetic values for the Arab fonts. All of these make Arabic fonts
Motion Effects of Arabic Typography on Screen -Based Media

the last one on the concerns list of software companies, as well as private companies, which manufacture and
develop graphics and design programs on the global level.

2. TYPOGRAPHY IN TIME:

More liberal concepts for using motion typography have entered in designers terms, which show that any
typographic information change over time is a motion, regardless whether there is a change of position or not, so
we need to differentiate between different types of using typography in time, Fig.1. The terms - will be
explained- participate together in the use of text during a certain time, or more precisely, enter the dimension of
time through a typographic work.

Fig.1 The classification of typography in time

2.1 MOTION TYPOGRAPHY:

We can say that the term of motion typography is a general term to express the absolute motion of the text
that requires changing the spatial arrangement of typographic elements. It is defined as text that changes in color,
size, or position over time.

2.2 KINETIC TYPOGRAPHY:

Kinetic typography generally refers to expressing with type over time (Jun, 2000). Kinetic typography can
add expressive messages, such as feeling and directions, to the motion words. The movement carries with it a
status of expression to provoke a particular emotion, mostly depends on the actual move of the text, where the
text is used without any change of its letterform (hassan, 2013). Kinetic typography is used in most cases to
transport and deliver the expressive condition for speakers, also transmit the tone of voice, character features and
emotional states by means of transforming the typographic features in time (Niksa Babic, 2008), (Uekita, 1995).

Fig.2 Nick the Greek - Ben White 2007

2.3 FLUID TYPOGRAPHY:

2
Motion Effects of Arabic Typography on Screen -Based Media

The term „fluid‟ typography was used in the 80s by Eduardo Kac to describe his „holopoetry‟ (Kac, 2007). In
this type of typography it is not required to represent the motion as actually move, in other words elements
change its location, the characters possible to stretch or distort or disintegration or reassembled etc. A fluid
letterform “does not have a fixed form. It may evolve, change, and crucially it may assume new identities. This
allows the introduction of a new identity without the introduction of an additional form. This inconsistency
between the number of actual forms and the number of perceived identities is a defining characteristic of fluid
type” (Brownie, 2007 ). These Identities fluctuate between the poles (which the shapes and identities and signs
are in a top of completion and clarity), but the period of time between those poles present abstract and unclear
forms.

Fig.3 Stills from True Lies title sequence, Kyle Cooper, USA, 2004.

2.4 TEMPORAL TYPOGRAPHY:

The temporal typography deals with the motion effects that displaying text in gradually way through specific
time period. Hillner (2009) writes “temporal typography shows typography forms change dynamically over time,
and enhances the expressive aspects of the typographic messages through the manner in which it is changing on
it, and makes the reading process more slowly. One of the key advantages of temporal typography is that
emotive expression can be enhanced by the definition of the graphic transition”.

Fig.4 Unfolded – Tomi Vollauschek -1999

2.5 VIRTUAL TYPOGRAPHY:

Is the form in which the viewer is expected to be dissolved in typography during a period of time, Virtual
typography makes people experience time as intensive because it imposes a state of confusion. The virtual
typography includes a change in the nature of the information, meaning that the change is not in appearance of
the typographic arrangement only, but that the text elements evolve directly from the image, In other words, the
results of the virtual typography come from a change of official representation of the meaning of itself, it
includes the change in the nature of the information instead of just changing the spatial arrangement only, the
structural composition is unknown start for the viewer. Virtual typography exists prior to the manifestation of a
linguistic code; before it turns into „actual‟ typography it cannot transport any literal meaning (Hillner, 2009 ).
Motion Effects of Arabic Typography on Screen -Based Media

Fig.5 Channel 4 – Brett Foraker

2.6 KARRATAINE TYPOGRAPHY:

This term describes a new type of motion typography, which is used to present a meaning of visual words.
Karrataine is a word of Arabic origin, which means twice. Karrataine typography describes a case of movement
where the character appears twice in different two image, the first image is the actual form of letter and the
second image represent the explanation of the word that is heard in iconic form. When viewing example of
karrataine typography, we observe that forms fluctuate between letter identities and meaningful icons. This
requires the viewer to reassess his or her perception through the Metamorphosis process. The viewer can try to
predict what icon will appear next, and how it will appear through various cues of individual letterform, Fig.6.
The viewer depends on audio cues (sound) to predict the next identity; this can lead not only to new identities
being introduced, but also confirm meanings.

3. THE CHARACTERISTICS OF ARABIC WRITING:

The Arabic alphabet has some characteristics which give it a different nature, and this is greatly affects the
forms of letters and method of its construction. The Arabic writing distinguish that most characters in one word
are intertwined, there is no separate single character. Also what distinguishes Arabic writing that the word, not
the character, is a building unit of the writing line, in contrast to the English language in which letters are
separate, and a letter is considered the construction unit. Really, the important matter is that letters in Arabic
writing have four forms depends on its position from the word: initial, medial, final, and isolated forms, for
example the letter “M” (‫)م‬:
At the beginning of word (Moses) : ‫هوسي هـ‬
At the middle of word (Ahmad) : ‫أحود ـوـ‬
At the end of word (Qassim) : ‫قاسن ـن‬
Separated (Adam) :‫م‬ ‫آدم‬
Another issue related to letterform design, that forms of Arabic characters involved in a lot of parts, meaning
that we can reproduce the letters from each other, this has also made old calligraphers divided it into original
letters and other extracted (Hssini, 2009).
We can limit the original characters in: {،‫ أ‬،‫ ب‬،‫ ج‬،‫ د‬،‫ى و‬،}, the rest of the characters are letters extracted from
them.
4
Motion Effects of Arabic Typography on Screen -Based Media

4. ARABIC IN MOTION

When we use Arabic typography in a motion graphic field, the typographic information requires special care,
which can not be derived from the traditional understanding of the static typography. This study has clarified the
important issues in the design of motion typography which requires to discuss a number of key issues through
the experiments made by the researcher, that can be summarized as follows:-
1) The first experiment: "‫ "انا هسلن‬I’am Muslim:
In this example, the structural design of letters (letterform) in the word "‫ "انا هسلن‬allows us to move each
character individually without feeling any defect in the word structure during the motion process.
We can see also that a designer can use alphabetic characters as a value and elements of design to make a
visual translating for audible words. This kind of motion classified as Karrataine typography. See Fig.6.

Fig.7

Fig.6
Motion Effects of Arabic Typography on Screen -Based Media

2) The second experiment: “‫ ”الحياة جاردنز‬Al Hayat Gardens:

This example shows us how we can make motion effects on Arabic calligraphic character through using
(stroke effect) in After Effects Program, this show the word in a developmental way, as if it is written with a pen.
We can classify this experiment as Temporal Typography, Fig.8.

Fig.8

3) The third experiment: “‫ ”الحولة القوهية لوحو االهية‬National Literacy Campaign:

In this video we can see the use of typography through motion infographic design. We can divide this video
in two parts, we see at the first one the use of typography with illustration and vector shapes and the role of
typography is limited to present the information text through the color and motion. This typography classified as
a motion typography.
In the second part in this video, the typography is used widely to transfer the audio performance and the
expression of the importance of the word through color, size and motion to distinguish the important word than
other, and express the meaning. This kind of typography can be classified under Kinetic typography.

Fig.9

4) The fourth experiment: “‫( ”بس انت ترضي‬Fig.10)

In this example the motion effect took place with a strong use of voice in order to carry and deliver
expressions that serve the topic to the viewer, along with the strong use of color to emphasize the meaning. This
experiment falls under the classification of the Kinetic typography.

6
Motion Effects of Arabic Typography on Screen -Based Media

Fig.10

5. Conclusion:
In recent decades, the technological innovation has a significant impact in improving the visual
communication possibilities. When we speak in a particular way, we find that digital technology supplied
limitless opportunities for designers and artists to represent their concepts through visual expressive forms. The
use of motion on the computer screen has a role in changing the way of designing typography and the way that
people read and interact with it.
We explain the differences between the types of typography through time. However, we must note here that
these classifications, in fact, are not in this accuracy, but it is a matter of scientific theorizing based on the
research and tracking, only one work may includes more than one type of them, and these classifications may
overlap in the same work, without being able to separate them. Whether we use any of those terms correctly or
incorrectly, these terms refer to a new kinetic and dynamic experience.

5.1 General Findings and Outcomes

Through the process of this research, a good and effective design for the Arabic letter motion is tried to be
accessed. Those results were:
- It is easy to move each character separately in Latin script, while in Arabic writing, the easiest way to get
an effective motion is to move words.
- Moving letters in a separated way is depending on the structure, design of the alphabet letterform used and
the choice of the motion effect which is compatible with this structure to get efficient and effective motion.
- In Kinetic typography, it is preferred to use Arabic typefaces that have short Ascender and descender range,
this enables the designer to display the words as text blocks which helps him to make a good text arrangement
that avoids the unaccounted inner spaces between text blocks. (fig. 6)
- The sound is one of the important factors in the Motion Typography in general, and in the kinetic
Typography and Karrataine Typography in particular, which has a significant impact on the viewer perception.
Motion Effects of Arabic Typography on Screen -Based Media

Sound and motion are used - with control of the time factor - to determine an appropriate rhythm and control the
dramatic effect or the expressive side to be connected. The use of sound is very useful especially in cases where
the words are moving quickly (to deliver emotional state) as the viewers can not read it, in this case the viewer
depends on the sound to complete the meaning.
- Kinetic typography can visualize and represent the information of a meaning that is not in sight. This is the
possibility that a computer can express visually a structure of the logic that is not visible, and a sensible
information.

5.2 Recommendations:
1- The power of Kinetic typography can be used through video or application to teach the hearing
impairment children. Since kinetic typography expressed the image visually, the sensuous word is
expressed by it. (Uekita, 1995 ) selected Some Japanese sensuous words as onomatopoeia and
mimetic words. He shows a sample of the onomatopoeia of “giggle.” For the experiment of kinetic
typography, fourteen samples of sensuous words were made as a language-study application for
hearing impairment children. The hearing impairment children can seldom be heard. Therefore, to
study of onomatopoeia mimetic word is difficult for them. Kinetic typography may help them
understanding of those words.

2- The power of Karrataine typography can be used through educational applications -whether they are
interactive and non-interactive- to enhance the children's memory and help them to make a link
between the word and its meaning.

Reference
1. Uekita, Y. H. (1995 ). The possibility of kinetic typography expression in the. Internet art museum.
IEEE SMC99 (pp. 230-235). Ullmer.
2. Brownie, B. (2007 ). One Form, Many Letters:Fluid and transient letterforms in screen-based
typographic artefacts . the MeCCSA Postgraduate Network Conference .
3. hassan, I. (2013). Motion Effects Of Arabic Typography In Digital Communication Media,Faculty Of Fine
Arts, Alexandria University, Department of Graphic design. Egypt: Un Puplished.
4. Hillner, M. (2009 ). Virtual typography, AVA Publishing, United Kingdom .
5. Hostetler, S. C. (2006). Integrating Typography and Motion in Visual Communication. iDMAa and IMS
conference. Miami.
6. Jun, S. (2000). The New Typography Today. Master Thesis, Carnegie Mellon University, Interaction Design.
7. Johnny C. Lee, J. F. (2002). The Kinetic Typography Engine: An Extensible System for Animating
Expressive Text. UIST '02 Symposium on User Interface Software and Technology. Paris, France.
8. Joonhwan Lee, S. J. (2006, June 26–28). Using Kinetic Typography to Convoy Emotion in Text-Based
interpersonal Communication.
9. Kac, E. (2007). Media Poetry:An International Anthology, Intellect Books, USA
10. Niksa Babic, J. P. (2008). Media Study: Motion Graphics. ELMAR-2008, the 50th International
Symposium, (pp. 499-503). Croatia.
11. Mohamed Hssini, A. L. (2009). Arabic digital typography design and connect characters issues. 5th
International Conference on Computer Science Practice in Arabic, (pp. 20-33). Morocco.