This page is a summary of visual design concepts from the module CUFDIG304A Create Visual Design Components, which looks at the Adobe Illustrator software. The same concepts apply to web design, especially colour and white space.
Creating beautiful design is about more than inspiration or a great idea, it’s about understanding the fundamentals of the subject.
The 10 Basic Elements of Design from that module are:
| Line |
Colour |
Shapes |
Space |
Texture |
Typography |
Scale/Size |
Dominance |
Balance |
Harmony |
The 10 Basic Elements of Design in summary format are:
Line -
Think about the whitespace on a webpage. It makes reading (and absorbing) the content easier. The first and most basic element of design is that of the line. In drawing, a line is the stroke of the pen or pencil but in graphic design, it’s any two connected points. Lines are useful for dividing space and drawing the eye to a specific location. For example, think about how a magazine uses lines (or columns) to separate content, headlines and side panels.
Balance -
Why is important?
People like balance; we are creatures of symmetry and appreciate it in everything. A design is like a real world building: it needs to be balanced or it doesn’t work.
Color -
Is one of the most obvious elements of design, for both the user and the designer. It can stand alone, as a background, or be applied to other elements, like lines, shapes, textures or typography. Color creates a mood within the piece and tells a story about the brand. Every color says something different, and combinations can alter that impression further.
Space -
Negative space is one of the most commonly underutilised and misunderstood aspects of designing for the page. The parts of the site that are left blank, whether that’s white or some other color, help to create an overall image. Use negative space to create shapes as you would any other element.
Shapes -
A shape is defined as an area that stands out from the space next to or around it due to a defined or implied boundary, or because of differences of value, color, or texture.
Texture -
Texture refers to surface, means surface. Everything that has a surface has texture. Textures range from the smoothest polished mirror to the roughest mountain range as seen from an airplane. The term is often misused to refer only to rough surfaces but this is not correct. All surfaces have texture.
Scale/Size -
Size is the physical dimensions of an object. Scale is the relative size of different objects in relation to each other or a common standard. Proportion is harmony of scale. All three are naturally interrelated concepts and all three enter your design thinking often.
Scale is size, however scale is simply a relative comparison of some measurable quality. Size is often compared and contrasted objects with terms from opposite ends of the scale. Bigger and smaller for example. Contrast only exists within a scale. Objects contrast through scale and the greater the difference along the scale the greater and better the contrast.
When scale is in harmony, it’s in proportion. The relative size of elements works.
Dominance -
While you can talk about emphasizing one thing or another, the element of emphasis has more to do with an object, color or style dominating another for a heightened sense of contrast. Contrast is intriguing, and it creates a focal point.
Emphasis is also known as dominance in graphic design.
what is it?
- The first thing the eye sees on a design.
- Traditionally this was the central part of the design, from which all other parts radiated.
Why is important?
- Design is to manipulate the viewer; dominance is where the viewer is to start looking
- There is an order in a design. You want the viewer to follow the correct direction, getting information in the correct order. To do this you need to force them to a specific start point on the design.
- It gets the viewer's attention.
Balance -
There are two schools of balance: symmetry and asymmetry. While most designers, artists and creative folks much prefer asymmetry for its eye-catching nature, symmetry does have its place. Sometimes.
Balance refers to the distribution of visual weight in a work of art.
Typography -
Perhaps the single most important part of graphic and web design is typography. Like color, texture, and shapes, the fonts you use tell readers you’re a serious online news magazine, a playful food blog or a vintage tea tins shop. Words are important, but the style of the words is equally essential.
Harmony -
Harmony is “The main goal of graphic design,” according to Alex White, author of “The Elements of Graphic Design.” So, you know it must be important. Harmony is what you get when all the pieces work together. Nothing should be superfluous. Great design is just enough and never too much. Make sure all the details accord with one another before you consider the project complete.
Visual unity is one of the most important aspects of well-developed art and is planned by the artist.
Unity provides the cohesive quality that makes an artwork feel complete and finished.
When all the elements in a work look as though they belong together, the artist has achieved unity.