SCREEN DESIGN
Screen Design Link Multimedia Usability Navigation Accessibility
[Home] [Contact] [Site map]
Design Principles 1
(Graphic Design)
Design Principles 2
Grid Design
(PDF Document)
Interface Design (PDF Document)
Color Theory
Typography
Monitor & Graphic Resolutions
MISC LINKS

Flash Interactive Tutorial (Source: Andrew Mundi Design)

Site References

SCREEN DESIGN PRINCIPLES 1 (con't - p2 of 2) )

The formal elements of graphic design are line, shape, color, value, texture, and format. These are the building blocks of two-dimensional design. It is important to remember that all of the elements below interact and are interdependent on each other.

  • Line -- A mark made by a tool as it is drawn across a surface. It can also be defined as a moving dot or point. A line is also called an open path. In Illustrator and Freehand we talk often about open and closed paths. The open path being a line and a closed path being a shape where the two end-points of the line are joined.
    There are different types of lines and all lines have direction and quality. A line's type or attributes are defined by the way the line moves from beginning to end and whether or not the line is straight, curving, or angular. The direction of a line depends on its relationship to the page. Line quality is defined as how the line is drawn -- smooth, broken, wavy, thick, or thin.
  • Shape -- is the general outline of an object. Shape is also defined as a closed form or closed path. Shapes can be open or filled with color and/or texture. Lines can be used to create outlines of forms. If lines are used to define the limits of a particular form the shape is described as linear. Color and collage can be used to create shapes in two-dimensional design.
  • Color -- We all know what color is. . .right? Color can be divided into three categories: hue, value, and saturation. Hue is the name of the color. Value is the range of lightness or darkness. Saturation is the brightness or dullness of a color. Synonyms for saturation are chroma and intensity. You should allow your design to guide the color choices you make.
    Download PDF documentation on Color for your personal reference (1.83meg)
    Colors will be covered in detail in our next lecture/assignment.
  • Value is used to describe the range of lightness or darkness of a design element. Value contrast is the relationship of elements in their lightness and darkness values. Value relationships can produce different effects and thus get different responses from the viewer.
  • Texture is the tactile quality of a surface or its represenation. Tactile textures are real; we can feel them. Visual textures are an illusion.
  • Format -- The format, what you are designing, is an important element in two-dimensional design. One of the first things you need to consider when you are designing is -- how a format will be seen or used. For each format you need to consider its shape, size, and its use.

The principles of design include balance. emphasis, rhythm, and unity.

  • Balance is the equal distribution of weight. Balance includes considering weight, position, and arrangement of elements, which affects how a design is visually perceived. Visual weight is the creation of an illusion of physical weight on a two-dimensional surface. Different areas of a page seem to carry more or less weight. For example, the center of a page is powerful and can carry a great deal of weight.
    Symmetry and asymmetry play an important role is developing the balance of a page. Symmetry means that things are balanced. Design elements are arranged so that they are evenly distributed on either side of a median line or plane. Asymmetry means that design elements are arranged so that unequal elements of weight are distributed unevenly on either side of a median line or plane. Synonyms for asymmetrical are: uneven, crooked, disproportional, unbalanced, and unequal to name a few.
  • Emphasis -- What is important? Is one element more important than another? The focal point of a design is that part which is most emphasized. The focal point is usually determined by the importance of an element to the message and what the designer believes will attract the viewer. Supporting focal points are called accents. Accents are not as strongly emphasized as the main focal point. If you make everything a focal point, the viewer sees none of the points as key, so you have defeated yourself. How can you make something a focal point? Make it -- brightest, a different color, a different value, go a different direction, have texture, a different shape, etc.
    When you arrange your elements on the page, you should think about the order in which you want the viewer to look at the elements, in other words, you decide the visual hierarchy of design. Where do viewers look first? second? third? It is your job as designer to create a flow of information from the most important element to the least by using things like placement on the page, size, value, color, and visual weight.
  • Rhythm is the pattern you create in your design by repeating or varying elements and the manner in which you do it. You are creating a movement from one element to another.
  • Unity -- Do all the elements on your page look like they belong together? As a designer, you must organize elements so that a common bond is established between them. You want the viewer to see an integrated whole, not a bunch of unrelated items. What is very important here is that if the viewer cannot find unity they will lose interest -- not look. Unity is about how well a design holds together. The following concepts/ideas can be used to help attain unity in your document -- continuity, grids, alignment, and flow.


The use of graphic space involves using all the space in your document -- the pictures or shapes and the background you place the pictures or shapes on.

  • Positive/negative spacial relationships impact your design. The shape is the positive space and the balance of the space is the negative space, or ground. Dead space refers to the blank areas on your page that are not part of your working design. Not all space must be filled. Both positive and negative space should be considered active and able to influence your design and thus affect the viewer.
  • Illusion -- In two-dimensional space we create the illusion of three-dimensional space. Perspective, scale, and volume allow us to create the illusion of spatial depth.

As a designer, you have lots of choices. The concepts above are key in guiding your decisions. You may want to make yourself a list of these that you can refer to from time to time when you get "stuck" and can't figure out exactly what to do.

Next Page (Part 2)