The definition of a shape is “the outline of a thing; a contour; that can be made by value, line, texture or color, and may be suggested or implied.” So what does that mean? Basically, just as a line is a point for a walk, a shape is a line for a walk. Whereas line defines direction and length, shape defines actual space (in 2 dimensions).

In order to properly discuss how shape works, we need to have a common vocabulary to describe what we’re seeing. Shape has quite a few descriptors, so bear with me.

The Basics

Geometric shapes are made from principles of mathematics, and can be described as such. The family of geometric shapes can be divided into two subcategories which are:
Rectilinear shapes, which are made up of straight lines and simple configurations (think back to geometry, things like squares, octagons, triangles, etc.) Rectilinear shapes by definition do not have any curved lines.
Curvilinear shapes are created by combining geometric forms to make curves (like circles and ovals). Curvilinear forms have curves, but are not necessarily completely curved. Most curvilinear forms are a combination of straight and curved lines.

Organic shapes are freeform shapes, not necessarily governed by mathematical rule. Organic shapes tend to mimic forms found in nature, combining both curved and straight elements (so nearly all organic shapes are also curvilinear shapes).

Invented shapes are made up tangles. The invented shape tends to have even more irregularity than organic, and is really defined by its distance from subject. Basically, invented shapes don’t mimic anything, they’re just blobs with no discernible pattern, rhyme, or reason.

Stylized shapes are simplified shapes, distilled from a known form. Most drawings are stylized shapes as you are simplifying the shape by only drawing the contours. If I were to draw the contour of a pen, though it lacked detail, the gestalt form (more on this later) of the pen would be recognizable.

Implied shapes are formed in the same way that an implied line is formed. There is an indication of direction, but the contour is broken. An example would be if there was a series of dots arranged in a circle, the circle is still recognizable, despite the fact that it is not, in fact, complete.

Simple shapes are shapes with little structural complexity, and are easily understood. Almost all geometric shapes are very simple, as they occur all the time in everyday life.

Complex shapes are, of course, the opposite of simple shapes. Complex forms are made from lots of structural elements that are hard to understand. Complex shapes usually have a large number of details when compared to the rest of the piece.

Spaces

What exactly are we describing with the terms above? We are describing partitions of space, or lack thereof. Artists commonly use the terms positive and negative space when talking about form and shape, the positive space being the subject, or something resting on a background, while the negative space is the background when nothing is covering it. More formally, the positive space is the object or figure of a design. The negative space is the surface upon which the figure resides, and is often called the ground (as a little side note: when it is hard to differentiate between the positive and negative space in a piece, it is referred to as figure/ground reversal). Both positive and negative space is made up by dividing their ground in the piece into shapes.

The Tricky Part

Now we get into the real meat of composition, the format and visual tension. Visual tension is the key to composition. It can be defined as “the connective relationship between shapes themselves, between shapes and the format, and conceptually between forms and the viewer.” The idea of visual tension is pretty ethereal, but the principles are imperative to understand. In a nutshell, as soon as you move from just a white page, visual tension is created. How much visual tension is created is widely dependent on the types of forms used, symmetry vs asymmetry, linear movement, and a number of other factors, many of which I’ll be discussing later, in the meantime, the most fundamental visual tension is movement and direction.

The first step to any solid design is the format. Though often neglected, format is a very important part of the design process, as it defines the space on which a design is created and the edges of the picture plane. An artist has a huge number of choices when selecting format, horizontal, vertical, shaped, abstract, etc. The two big ones worth covering for right now are the horizontal and vertical. One of the main factors in deciding format (as should be obvious to those who read the elements of line) is directional emphasis. In a horizontal format, the emphasis will be on the horizontal line, giving a more calm, and relaxed feel. Conversely, a vertical format will put more emphasis on the vertical axis, making a more active, but harder to unify composition.

The activity parallel to the direction of the format is considered a facet of a greater area called directional forces. The directional force refers to a sense of motion within the piece. In more complex shapes, the most dominant, rough form of the shape gives the major directional movement, while the more subtle forms within the shape give minor directional movement. Directional forces in reference to the format come in five main flavors: perpendicular, edges, bottom, right, and center.

Perpendicular motion occurs in any rectangular format where any line that runs parallel to an edge is activated by the edge, and is terminated by a perpendicular intersection (hitting the perpendicular edge). In more lay terms, any line that runs with an edge will be running perpendicular to another edge. The edge that it is running with will activate that line, giving it movement that stops when it hits an edge running perpendicular.

The edges give an object weight and importance in a piece. The closer to the edge something is, the more tension that object has, and the more it influences the piece. The edge can be broken (by cropping a shape off at the edge) to give a better sense of space and connectedness with the viewer, but the cropped shape has quite a bit of weight to balance.

The bottom carries a lot of weight because of our tendency to apply gravity to a piece. Things at the bottom of a piece seem to have more weight, but less motion than the rest of the piece. Additionally, if there is a grounded structure (one that activates the bottom and gives a sense of space) things placed in the middle will appear to be falling, giving them movement, but not always the desired effect.

The right side is pretty much only in western culture (in eastern cultures it’s more often the left side). The right side gains a lot of visual tension from the fact that most western society scans paintings left to right, spending more time on the right edge.

The center of a piece again will always have movement toward it, as it is where the eye will generally begin on a painting. The center has the most visual impact and power of the entire piece, but has a tenancy to make the rest of the piece stagnant. Pretty much if you make the center too contrasted with the rest of the piece, the rest of the space outside the center will not activate and the eye doesn’t move around.

Focal Points

Phew, that was something. Now why did we cover both shape and format with directional motion in one go? Well, for one shape didn’t really constitute having a whole article written about it, but more importantly it all leads to the big finale: focus.

A focal point is a place in an image that you want the viewer’s eye to rest, it has something cool, or it is important to interpretation, whatever. A focal point is created through contrast and techniques to lead the eye to the focal point using the techniques discussed.

Though I won’t go into detail just yet on what all of these are, the main contrasts are:

• Simple vs. ornate
• Stark change in direction
• Motion vs. static (in focus vs out of focus)
• Type of form (identical vs. change)
• Contrast of texture
• Contrast of values
• Color emphasis

The focal point can also be formed by positioning the piece in isolation, in the major foreground (make it bigger), and/or by placing the form in the center of the composition.

So by using complex shapes in amongst simple shapes (or vice-versa), a focal point can be created. When more than one focus is created, the eye will move between them following the rules of the lines. If you have two focal points that are arranged diagonally, there is a visual tension and active movement between them. If the foci are arranged on the same horizontal plane, it will give a sense of calm and still space (useful in still lives sometimes).

Anyways, thanks for reading another edition of elements of design, stay tuned for Lessons from the masters: shape, as well as Elements of design part 3: texture. Thank’s again, and have fun!

As was explored in my previous post (sorry for the delay, by the way), line is an extremely important part of any modern graphic designer’s repertoire. The line, however, is not a new invention. Ever since the renaissance, the utilization of line to determine subject, proportion, and space has been imperative.

The primary function of line in any art, and any line, is to lead the eye. Whether it be around the contour of the subject, or more discreetly, to point the eye toward a company’s logo, the line moves the eye. The easiest way to show how to use this marvelous tool is to actually demonstrate with some of the great works in history.

First up is Leonardo’s Last Supper, painted between 1495 and 1498 as a fresco. The painting depicts the Christian Last supper as depicted in the bible, as Jesus sits at the table alongside his disciples. The Christ figure sits serenely in the center of the piece while his followers look taken aback at the news that one of them will betray him. One of the things that makes this piece interesting is the utilization of linear perspective to make a broken psychic line to the head of Christ (as shown in blue). Almost every architectural line converges within a very, very small area around the head. Additionally, when a line is drawn through the hands of the disciples (in yellow), they form an irregular, but distinct line, again to the head of Jesus. One thing of note, nearly all detailing that is not directly pointed at the head of the Christ figure, are horizontal, as not to distract from the center of attention. For those who haven’t read my last post, the horizontal line is less energetic than the diagonal, creating less desire for the eye to follow that line. In this case, the horizontal is outweighed by a myriad of convergent diagonals that draw the eye further back. There are many more elements to this piece, but mostly they fall out of the scope of this particular post.

The next example is from the great painter Caravaggio painted over a hundred years after Leonardo, in 1599-1600 (this is technically a baroque piece) known as The Calling of St. Matthew. The first thing you’ll notice is the number of lines in this piece that I’ve added, the second thing you’ll notice is the sharp glares and points that are so striking in this image. This painting depicts Jesus (yes, I know, they painted him a lot) as he beckons St. Matthew, who was previously a tax collector. The light of the divine fills the room, despite there being only clouded, dark windows, contrasting the divine with the mundane. One of the most striking elements is the extremely dark background illuminated by the bright light behind Jesus (a technique known as tenebrism, widely credited as developed by Caravaggio). The light falls in strong diagonals (shown in blue), penetrating the scene, and highlighting the surprised face of St. Matthew. The background is also bisected by the grungy window, further dividing the scene into the sinners and the divine. Multiple lines point to St. Matthew (shown in red), including the points of Jesus, and St. Paul. Jesus’ gaze is hard and fast on Matthew’s figure, strong and fierce, but also with a subtle hint of compassion. Three men in the room return the gaze of Jesus (in green), showing surprise and intrigue. The looks from the tax collectors are the primary vehicle through which Christ is seen. Though he is obscured in shadow, and clearly not the main subject of the piece, Jesus gets a fair amount of attention by the strength of the psychic lines from the tax collectors, as well as being on the right side of the image (more on this in a later post). At last, to complete the sense of  divine symmetry, the two men on the left side of the painting look down, counting their earnings (orange), possibly referencing the teaching ‘…it is easier for a camel to go through the eye of a needle than for a rich man to enter the kingdom of God.’

Moving away from Jesus, The Birth of Venus painted by Sandro Botticelli around 1486. The painting lacks many of the more modern elements like linear perspective that were apparent in the last two images, but does include some atmospheric perspective as the shoreline fades away. The method of movement in this piece is through the use of sectioning and linear movement. All of the figures besides Venus appear to be flowing on the wind, with an almost weightless quality, with all lines from the figures converging somewhere on the nude goddess. Few straight hard lines can be found in this image (besides the horizon and the trees), giving a sense of flowing sensuality and beauty in all of the figures. The midline of Venus is soft and composed (in purple) with her hips tilted in a classic contrapposto (you can see the ‘s’ shape from her foot through her hips and to her shoulders). The maidservant on the right frames the image with her arms (in blue, complimented by the heads of the wind-spirits to the left. The eye is immediately drawn directly into the center, specifically to the face of Venus, and then studies the simple beauty of the figure.

Titian’s Venus of Urbino was quite the risque work at the time of its painting in 1538, the nude Venus reclining in front of a pair of maids. One of the most important elements in this piece is the stark field of black behind the goddess, nearly bisecting the image. The Architectural linear perspective (purple) converges just left of center, within the large black field. From there the eye moves into the sensuous body and face of the Venus. A contour is made between the white of the nude’s flesh and the dark of the background, accentuating the elegant curves of the body. The centerline (red) of the nude figure is twisted just slightly out of reclining toward the viewer to make a more intimate feel, and give better depth to the curves. The fabrics covering the bed are made up of soft, textured curves and angles, giving it a comfortable feel. The maids in the background’s heads form a line (not shown) back into the center of the piece, drawing the eye once again along the body. Titian uses the curved form, and convergent linearity to give a distinct sense of eroticism and beauty, giving the form life, setting, and feel.

Ok, I know I covered a lot of ground, but I hope you’re still with me. The elements of line that these great masters have used to create the paintings looked at aren’t that hard to use on your own, especially when reduced down into their most simple form. The next work (and final work) that I’m going to cover is extremely different than all the previous ones, but I think gets my point across very effectively.

This work by Paul Rand for a lecture at the MIT Media Lab made in 1996 is simplicity itself. The work has little ornamental content, and every element is added out of necessity. The primary subject is just a row of multicolored lines thrown diagonally across the mid-section of the piece. The major diagonal (with a black line in it) is divided into smaller sections running perpendicular (the red lines), pointing to two blocks of white text on a black background. The piece is unified, and complete in composition, yet shows a tremendous mastery of the craft of design. The elements in this piece both allow our eye to freely roam the picture plane, but also guides us to where the relevant information is.

Well I hope that I’ve given some clarity to my previous post, helped some, and inspired others. Stay tuned in the near future (I promise) for ‘Elements of Design Part 2: Shape’.

*All images taken from MediaWiki with the exception of the Paul Rand poster, taken from the MIT Media Lab web page.

Types of Lines

Lines come in 3 major flavors:

Actual Lines are continuous and exist visually. An example would be a guitar string
Implied Lines are lines that are non-continuous and must be formed by the eye connecting the pieces of the line together. A queue of people waiting for tickets is an implied line as the line is not physically there, but you are able to figure out where that line begins and ends.
Psychic Lines do not exist at all, but they are formed when the mind discerns a line between objects. In the case of an arrow pointing to a door, there is no direct line between the arrow and the door, but a viewer would be able to understand that there is, in fact, a line. Psychic lines are often used in art and design to guide the eye around the piece using things like pointing fingers or eye contact (more on this later).

When approaching the transition of a 3 dimensional form like a tree onto a design or painting, the idea of line becomes extremely important. The line in a composition is rarely used on its own, but rather indicates a meeting of two values, or two surfaces.

A meeting of value would indicate shading. Think of tracks made in snow, the line is created by a difference in the value of the snow caused by different shadows. The snow is still the same color, the light is just reflecting differently.
Meetings of surface are the most common lines, as we see them all the time. When expressing an object that is one material which is surrounded by any other material (think about the outline of a person against the sky) the difference in material forms a line.
Intersects of surface define the line made when two surfaces intersect, such as a corner of a room.

So why does it all mater?

A line is a very powerful tool in any artist or designer’s arsenal. The goal of any piece is ultimately unity of the piece. What I mean is that the positive space (the space which has something in it) is equally “active” as the negative (or unworked) space. The line is able in many ways to achieve unity in a piece through a number of means, which are all incredibly important.

Defining form or space is achieved by showing the outline or contour of the form. If I were to draw a cube on a piece of paper, I would not need to create that cube by shading each side, but rather I can indicate the form by just showing the outline.
Creating direction using line is often overlooked, but is really the most fundamental function of line. To move a viewer through the piece the artist may use many lines to show where the eye should go (often through the use of psychic or implied lines).
Rhythm and sequence are both often indicated by line or line segments. Rhythm is created by the use of lines to indicate areas of emphasized activity alternating with areas of lower activity, often in a repetitious manner to form pattern. Sequence refers in this case to forms occurring at regular (or slightly irregular) intervals.

Qualities of Line

To talk about line, you need to understand the language used to describe the line. A measurable component of a line (or any element of design) is a quality.

Direction refers to where the line is going and how it is getting there. Commonly direction is talked about as vertical, horizontal, diagonal, curved, or freeform.
Weight is the thickness of the line, but more importantly it is literally weight. A thick line will appear in a piece as heavier than a thin line
Value is the lightness or darkness of a line.
Texture can be tricky to express in line (the diagram is a little extreme). The texture of a line more accurately refers to a very tactile quality of a line, does the line have extreme angles, or is it smooth?

Line in Composition

Horizontal lines have a calming effect on the piece indicating calm, stasis, and quiet. Most often the horizontal line is found in nature in places that are static or serene (like the horizon or calm water). The horizontal is also associated with the human sleep posture.
Vertical lines have a much more active effect within a piece. The vertical line most often is used to express rigidity or strength (like an architectural column, or a flagpole). The human analogy would, of course, be standing up.
Diagonal lines are the the most active and are used to indicate movement or activity. A human assumes a diagonal position when running.
Curved lines are expressive of sensuality or flowing movement. Curved lines are the most common in nature and can be seen in everything from the flow of water to the arms of galaxies. The curved line is predominantly what the human form is made of.

Each of these line types contributes to the creation of an effective composition. Using horizontal lines within the compositional space will help ground the piece, allowing the eye to break from that area. The focus of a piece is most often on the diagonal to have the highest activity directly on the main subject. The power of the diagonal line, even when psychic should not be underestimated when considering activity in the piece. Vertical lines assist in framing pieces and creating areas of solid strength. This is (of course) just a very small primer on the use of the line in the compositional space. Do not worry if you don’t get it right now, it will become clearer with time and practice. Also stay tuned for line analysis where I’ll be going through some paintings to demonstrate the concepts shown here.

I hope that you’ve learned something from all this, so good luck, and go create!

Why are you adding those swooshy-light-things in photoshop? Why do all the buttons on your webpage look ‘glassy’? Why, oh why are you still using Comic Sans MS? Excepting the last one, the answer is most likely trendiness, or just because you could and you’ve seen it look cool elsewhere (and perhaps made it look cool yourself). My point isn’t to say that using any of these techniques is inherently bad, what I am saying is that it is not inherently good design.

So now I throw my hat into the ring. I hope that this site will prove to be a great place to learn, and a great place to have fun. Welcome to The New Aesthetic, I hope that you enjoy your stay.

PS: please let me know via comment or via contact or email (whatever) if you notice anything that doesn’t work or is buggy, thanks!