Visual Design
The visual design process is purposeful creative production using visual design elements and applying design principles within the constraints of project objectives. Much of what we know about visual design was developed and perfected by the masters painters hundreds of years ago. The main goal of visual design is to take command over the viewer's eye, to lead it around a canvas or page for the purpose of communicating some feeling or meaning.
A certain painter, not without some reputation at the present day, once wrote a little book on the art he practises, in which he gave a definition of that art so succinct that I take it as a point of departure for this essay. “The art of painting,” says that eminent authority, “is the art of imitating solid objects upon a flat surface by means of pigments.” It is delightfully simple, but prompts the question—Is that all? And, if so, what a deal of unnecessary fuss has been made about it. [2]
Aesthetics
Why would someone want to take up their desk space with a small potted plant? Why would a person hang a painting on the wall in their apartment? Why would they buy a red chair? The answer to these questions lies in the emotional consequence of aesthetics. An aesthetic is a set of principles and elements that are used to describe a creative work, locating the intended or emergent language and subjective beauty. Aesthetics can impact a person's mood, comprehension, productivity, behavior, and can result in various forms of bias. The aesthetic-usability effect is a bias where if a design looks easier to use, then it is regarded as such — irrelevant to actual usability characteristics. For these reasons, it is beneficial to always strive for strong aesthetic execution of a creative work. See this Medium.com article for an expanded discussion on aesthetics.
Language of aesthetics
In visual design, an aesthetic language is constructed from elements that are organized based upon how humans see with their eyes. Common elements of design include:
- Line
- Shape
- Form
- Space
- Color (hue)
- Value (tone)
- Texture
Common principles of design: [1]
- Balance
- Dominance, emphasis, and focal point
- Movement
- Repetition, rhythm, pattern
- Proportion and scale
- Variety and variation
- Unity/harmony
- Contrast
Gestalt principles of perception:
The following principles describe how the viewer knows that elements are related to each other.
- Similarity
- Continuation
- Closure
- Proximity
- Figure-ground
- Symmetry
- Common fate
- Past experience
If you have ever taken an art class in a primary or secondary education curriculum, you were most likely taught those principles and elements to make drawings or paintings. The elements may be specific to visual acuity, however, the principles of design aren't restricted image making. They can be used with sound, architecture, fashion, interactive media, experience design, and other types of design.
These lists form the basis of a language around talking about design, and help us conduct a process of formal analysis with which we can then break down a work of almost any kind. This language is flexible between media and modes of creative expression. For instance, we can use the term shape to refer to both a geometric or organic visual element. This is its most direct and literal use. We can also use shape to describe the narrative arc of a story, where the shape of the narrative arc tells us about the high and low moments. We can even use shape to describe aspects of how an online course can be taught, indicating moments of passive and active engagement in learning. In this way, shape works as both a visual (physical) and a conceptual (virtual) idea. This ability of this language to slip between physical and virtual references makes it highly useful and adaptable for communicating about design. Creative works can develop their own unique design language, including elements and principles that emerge from the design process or appropriated from other disciplines and fields. It is often the designer's job to define the language that articulates the creative vision.
If you'd like to see examples of some of the visual elements put to use, see the Design Aesthetics for the Web course on Lynda.com. They have a slightly different list than the one listed above. I have left type out of my list because I believe that it is more of a semiotic element and I would need to include other "higher order" elements into the list–a slippery slope to an unhelpful taxonomy.
Formal analysis
One common way to make a judgement about a creative work is through Formal Analysis. This type of analysis is based entirely on what the viewer sees, and forgoes cultural and historical contexts. Something that is formally ugly can be conceptually beautiful, and something formally beautiful can be vapid and tasteless. The main advantage of formal analysis is that it helps to make feedback understandable by others. There are three steps to conduct a formal analysis:
- Identify and name the formal element
- Describe how it is being used
- Discuss the effect it has with respect to the entire work.
Example of formal analysis
"The blue area above the figure seems to give me a sense that we are outdoors with a clear sky above. This gives the image a bright and positive feeling."
- Formal element: blue
- How it is being used: above the figure
- Effect: ...we are outdoors , ...bright and positive feeling
Representation technology
Typography
Typography is an ancient field that employed typographers who were specialists in the craft of arranging type for the purpose of communicating written language. These specialists invented and understood every facet of working with type and were the only ones capable of producing it–they were both designers and the gatekeepers for what was produced. In contrast, the advent and availability of digital word processing applications have made typography accessible to everyone, and the knowledge of type's design nuances are lost on all but those who work at digital type studios and well-trained graphic designers.
In 1439, a German goldsmith named Johannes Gutenberg had struck a business deal with investors to produce and sell small mirrors to Pilgrims at their fair in a nearby town. After discovering he was told the wrong year for the fair, he pitched the idea of the printing press to his business investors. In 1440, Johannes Gutenberg adapted existing screw press technology and metal type. Soon after, mechanized moveable-type became popular and the speed at which knowledge could be spread exploded and by the year 1500, over 20 million books had been printed.
The printing press fundamentally changed how knowledge was recorded and disseminated, a disruptive technology that shifted power from the monolithic structure imposed by the Catholic church to individual change-makers spread across the west. Ultimately, this contributed to the de-centralization of power to localized nations, where language, laws, taxes, and cultural identities could develop independently.
Image
Capturing accurate visual information as a representational image was a laborious process that required master drawing and painting skills developed over a lifetime of practice–most famously celebrated during the Renaissance period. However, that changed in the 1830s when a French artist and chemist, Louis-Jacques-Mandé Daguerre, patented the Daguerreotype. A Camera Obscura is an ancient structure or device that allows light in through a small hole, projecting light from the exterior scene onto an interior surface. The Daguerreotype combined the projection ability of the Camera Obscura by exposing chemicals to this light, recording the images onto metal plates.
George Eastman pioneered film photography technology and began selling it in the late 1800s. The first film camera, called the "Kodak," was offered for sale in 1888. The advent of microprocessors and digital sensors capable of quickly and cheaply recording light information led to the first digital camera in the late 1970s. Now, almost all handheld computing and communication devices like cellphones and tablet computers have hi-resolution cameras embedded.
It took John Singer Sargent more than a year to finish the Portrait of Madame X (1884). The computer has enabled the average person with little understanding of chemistry, physics, or painting skills to easily and cheaply capture, edit, duplicate, and disseminate beautiful images to hundreds of people within seconds of the initial impulse.