DESIGN PRINCIPLES Copyright © 2013 MyGraphicsLab / Pearson Education MyGraphicsLab: Adobe Photoshop CS6 ACA Certification Preparation for Visual Communication

OBJECTIVES Copyright © 2013 MyGraphicsLab/Pearson Education This presentation covers the following ACA Exam objectives: 2.2 Demonstrate knowledge of design principles, elements, and image composition. 2.3 Demonstrate knowledge of typography.

DESIGN PRINCIPLES: FIGURE/GROUND The Gestalt principle of figure/ground is fundamental to design, for this relationship shapes our visual perception. A figure (form, or foreground) is always seen in relation to its ground (what surrounds the figure, or background). We are used to seeing the figure/ground relationship a certain way, such as black type on a white background, or a person standing in front of a scenic landscape. You can create visual interest by changing the usual figure/ground relationship. Copyright © 2013 MyGraphicsLab/Pearson Education

DESIGN PRINCIPLES: BALANCE, SYMMETRY, AND HARMONY Balance and symmetry work hand in hand. The basic definition of balance in design is the even or proportional distribution of elements within the design landscape. One way balance is achieved is through symmetry. There can be horizontal and vertical symmetry, diagonal symmetry, radial symmetry, and asymmetric formations. Balance and symmetry can be used to achieve design harmony: the adaptation of elements in relation to one another to form a pleasing, coherent whole. Copyright © 2013 MyGraphicsLab / Pearson Education

DESIGN PRINCIPLES: ALIGNMENT AND PROXIMITY Alignment is the arrangement of elements in a line. Alignment draws the eye along the line formed by the elements. By using alignment, designers and photographers can focus the viewer’s attention. Proximity in design is grouping similar elements together. The viewer’s eye sees similar grouped objects as a single unit. Proximity organizes information and provides structure for the project. Copyright © 2013 MyGraphicsLab/Pearson Education

DESIGN PRINCIPLES: RULE OF THIRDS In design, the rule of thirds is a way of making something more compelling and interesting. The concept is to take a composition and break it into thirds across your design real estate, whether on paper or online. The critical areas for the design elements are in the intersections of each third. Photoshop’s Crop tool offers a Rule of Thirds view option, which guides your crop choices using this principle. Copyright © 2013 MyGraphicsLab/Pearson Education

DESIGN PRINCIPLES: POINT, LINE, AND PLANE Point, line, and plane are the fundamental elements of design. A point is a dot, and it marks a position in the design space. A line can be thought of as a string of connected dots. A plane is a two-dimensional flat surface. A line forms whenever two dots are connected, or wherever two planes meet. It can also be the space between planes or shapes. Copyright © 2013 MyGraphicsLab/Pearson Education

DESIGN PRINCIPLES: SHAPE, FORM, AND SCALE A closed line forms a shape, which is one type of plane. Shapes can be outlined or filled, defined or formless, contoured or linear, precise or organic. Shapes with mathematical definitions — circle, square, triangle, rectangle, etc. — are the building blocks of design. Shapes can be combined to form new shapes. Scale is the relative size of nearby design elements. Scale is a powerful tool for creating visual hierarchy and visual interest. Copyright © 2013 MyGraphicsLab/Pearson Education

DESIGN PRINCIPLES: COLOR AND TONE Color is the eye’s perception of the light spectrum (e.g., the spectrum of a rainbow). For design purposes, color often includes black and white. Tone is the brightness and shading of an image or a design element, independent of its color. Copyright © 2013 MyGraphicsLab/Pearson Education

DESIGN PRINCIPLES: TEXTURE Texture relates to the tactile qualities of a design. Texture can be physical or optical. The feel of paper is its texture. The appearance of roughness or smoothness is a design’s texture. Texture adds visual interest, establishes a mood, and draws the viewer into the design. Copyright © 2013 MyGraphicsLab/Pearson Education

DESIGN PRINCIPLES: CONTRAST Contrast is the difference between two nearby elements. The difference can be color, texture, scale, or shape. Contrast gives an image or a design visual interest. A good rule of thumb is to use high contrast if you use it at all. If the design elements look too similar, the visual interest is lost. Copyright © 2013 MyGraphicsLab/Pearson Education

DESIGN PRINCIPLES: WHITE SPACE White space is also sometimes referred to as negative space because of the lack of content. White space can be used as a design element to balance and give your eyes a place to rest. It can also be used as a space for other elements to be placed such as text, logos, and animations. White space doesn’t have to be white — a sky, ground, or any solid block of color can serve the same purpose. Copyright © 2013 MyGraphicsLab/Pearson Education

DESIGN PRINCIPLES: REPETITION AND RHYTHM Copyright © 2013 MyGraphicsLab/Pearson Education Repetition is the reuse of identical or similar design elements throughout a design. Repetition can be created with color, type, shapes, and/or texture. Repetition conveys unity and organization. ■ Rhythm is a strong, regular, repeated pattern, usually of movement or sound. Think of a drumbeat or skipping rope. ■ In design, rhythm is achieved with design elements: color, tone, texture, scale, and so on. ■ Rhythm can be punctuated by sporadic variation in the pattern.

DESIGN PRINCIPLES: MOVEMENT In visual design, the illusion of movement is shown by shapes, lines, and curves within the image, which lead the eye in different directions. Another way to create movement is by combining rhythm and repetition. Copyright © 2013 MyGraphicsLab/Pearson Education

DESIGN PRINCIPLES: PHOTOGRAPHY AND VIDEO ■ Framing is arranging the elements in a photo so they “frame” the primary subject. ■ Field of view is the slice of the world that is recorded by the camera when taking a photo. ■ Aspect ratio is the proportion, in width to height, of a screen image, a photographic print, or a television or film screen. ■ The standard aspect ratio for 35mm images and prints is 3:2. ■ You can change or maintain an image’s aspect ratio when you crop or resample an image. Copyright © 2013 MyGraphicsLab/Pearson Education

DESIGN PRINCIPLES: EMPHASIS AND HIERARCHY When one calls attention to a design element, this is called emphasis. It might be done by bold or large type, color or size, or contrast. The element that is emphasized is called the focal point. Emphasis is used to create hierarchy, which is a way of organizing design elements in terms of their relative importance. Copyright © 2013 MyGraphicsLab/Pearson Education

TYPOGRAPHY: TERMS Character: a single element of type (letter, number, symbol, glyph) Font: a set of characters and symbols in one type design Leading: the space between two lines of type Point: the standard unit for measuring type size (72 points = 1 inch) Type: characters used to display text for communication Type size: the height, in points, of characters of type Type style: a standard design feature such as bold or italic Type weight: the thickness/thinness of a type style Copyright © 2013 MyGraphicsLab/Pearson Education

TYPOGRAPHY PRINCIPLES: RULES OF THUMB (1 OF 4) Every decision you make when using type affects your project’s design hierarchy and readability. Here are some rules of thumb. Rules for mixing fonts  Use no more than two fonts in any web or print document.  Choose one serif and one sans serif font. OR  Choose one display font for headlines and one text font (serif or sans serif) for body text.  If you need more variation for complex content, choose a font with many weights; mix weights instead of fonts. Copyright © 2013 MyGraphicsLab/Pearson Education

TYPOGRAPHY PRINCIPLES: RULES OF THUMB (2 OF 4) Rules for type sizes  Body text: 10-point type (12- point for onscreen documents)  Subheads: 12- to 14-point type  Headlines: 36+ point type Rules for type style  Use the font’s bold and italic options, not the style buttons.  Use bold sparingly, for heads, subheads, and list items.  Use italics, not underline, for emphasis in text.  Use curly quote marks.  Don’t use outlined type.  Don’t use the options for stretching type; instead, use a font with multiple weights. Copyright © 2013 MyGraphicsLab/Pearson Education

TYPOGRAPHY PRINCIPLES: RULES OF THUMB (3 OF 4) Rules for line length  Body text: 9–12 words  Headlines: 1–6 words  Decks: one short sentence  Subheads: limit to one line Rules for indentation in print  Indent the first line of every paragraph; do not skip a line.  Indent 0.25 inch, or 1 em space Rules for line spacing (leading)  No line space between paragraphs; use indents  Body text: type size + 2 points  General: 120% of type size  White space between lines should be larger than white space between words. Copyright © 2013 MyGraphicsLab/Pearson Education

TYPOGRAPHY PRINCIPLES: RULES OF THUMB (4 OF 4) Rules for type color  Use contrasting colors; black on white is always safe.  Use a color tool such as Adobe Kuler to find contrasting and harmonious color sets. Rules for type on a background image  Find a block of solid color to place type (sky, blank wall).  Use a contrasting color drawn from the background image.  Align two or more blocks of type with each other.  Use drop shadows or screened type when type crosses into a different tonal or detail area of the image (“interruptions”). Copyright © 2013 MyGraphicsLab/Pearson Education

SUMMARY Good design isn’t random; every element should be intentional, based on solid principles. Design and typography principles are powerful tools for creating visual hierarchy and visual interest. Following typographical rules of thumb will give you a good start and keep you out of trouble. Special rules apply to type placed on background images. Copyright © 2013 MyGraphicsLab/Pearson Education