smad 201 midterm concept quiz

what is all design related through?

form follows function

form

usefulness of design

• design must be practical

aesthetic

branch of philosophy, deals with expression & perception of beauty

what is the specific function of graphic design?

communicates messages visually

graphic design

plan for organizing visual objects in space

• capturing audience’s attention from among everything else competing

• “plan” & “organize” for purpose of “communication”

what are the four things of good graphic design?

1. captures attention

2. controls eye movement across screen/page

3. conveys information

4. evokes emotion

what are the three building blocks of graphic design?

1. visuals

2. typography

3. space (balance)

what are standard questions when researching?

• what’s the objective?

• who’s the audience

• does design need to coordinate with other design work?

• who are the competitors & what does their visual communication say?

• how will final product be delivered/distributed?

• what’s the budget

• what about timing & turnaround

• who’s providing content?

• are there any other design/production considerations/constraints?

what’s the brainstorming process like?

1. dump

2. percolate (split focus)

3. morph (sketch/change)

what’s the best technique for sketches?

thumbnail sketch

• can draw & reject quickly

flat plans

single sheet showing all pages in project

• illustrate page order & arrangement of facing pages

storyboards

working sketches showing change over time

• several depicting key points

site maps

show which pages site will include, link structure, & overall flow. look like family trees

• focus on screen order, organization, & function

• lack ability to demonstrate website interactivity & responsiveness

wireframes

used to work out ideas for listing site content & planning how site visitors will access & use content

comps

fully detailed final draft suitable for showing boss/client

prototypes

comps for websites & other onscreen layouts

• shows layout’s overall color palette, font, & image choices

• proceed to building staging site when approved (working version of website)

tone

determined by what you/lead wants to project & what will resonate with audience

what are some photo characteristics?

• asymmetrical balance & rule of thirds

• tight cropping

• natural lines to create movement

• interesting light

what are the most common file formats?

• JPG

• PNG

• GIF

JPG

best for photos

• use photo-editing program to optimize & save at 72dpi

• lossy format (poorer print resolution)

PNG

choice for illustrations & logos

• renders gradients well & supports higher degree of transparency (drop shadows)

• 300 dpi for high end printing, 200dpi for lower end printing

GIF

best format for web icons & animations.

• supports transparency

TIF

best for printing

• supports layers

• larger in file size & don’t lose data

EPS

used for specific kinds of images like vector graphics

• can be resized without loss of solution

• for printing with vector graphics

• typically used for logos & supports transparency

what does lossy format mean for JPG?

each time you open/manipulate a JPG, it loses data

why is the relationship between image resolution (dpi/ppi) file size & physical image size complex?

may decrease file size (scale down) without losing image quality, but you CANNOT increase file size (scale up) without losing image quality.

what’s recommended for news picture photos?

limit editing to cropping, overall value adjustments & dodging & burning

• looser when photo sets tone/delivers a message in advertising, public relations, & marketing materials

what does journalism, advertising and public relations all define diversity?

part of craft excellence

• have ethical responsibility to deploy images free of stereotypes

symbolic annihilation

images that injure via symbolic messages about individuals/groups of people

where can you get photos

• digital stock

  • comp images

  • royalty-free & rights-managed images

• working with photographers

what are other alternatives to photos?

• illustrations

• video & multimedia components

• type as image

pull quotes

pulls quote from copy for purpose of higlighting it

SVG

vector graphics format for web

• excellent for basic shapes, charts & graphs

• works well in responsive websites

what are the elements of design?

• point, line, plane

• shape/form

• figure/ground

• color

• texture

• value

what are the principles of design?

• focal point

• contrast

• balance

• scale/proportion

• movement/rhythm

• pattern

• unity

line

series of points extending in two directions

• key element in creating perspective

plane

line in motion, flat surface extending in both height & width & can appear flat & two-dimensional/skewed

• creates volume (3d forms)

what are the two kinds of shapes?

1. inorganic (geometric)

2. organic (natural)

figue/ground

ability to distinguish subjects from background

• background is negative space

color

draws attention, organizes and evokes emotion.

value

tones of light & dark

• grayscale

focal point

most important thing visually on any layout, eye’s point of entry into the layout

rules of focal point

1. have one, without one viewer doesn’t know where to look

2. limit one per screen/etc, without one eye wanders around layout

• if you have two = you don’t really have one

contrast

important principle for designing interesting layouts

• offers flexibility

balance

visual weight

three kinds of balance

1. radial

2. symmetrical

3. asymmetrical

movement

in order to achieve eye flow through a layout, the design must create this with sightlines that guide the eye from one thing to the next.

pattern

derived from points, lines, & shapes repeating in lines/grids

• gives visual impression of texture

unity

refers to oneness that result is one cohesive design/visual message

primary colors

red, blue, yellow

secondary & complementary colors

mixing two primary colors, green, purple, orange

teritary colors

mixing primary colors with secondary color on wheel

value

adding white to any hue produces a tint of that hue, adding black produces shade of that hue

additive color

RGB

• ADDED TOGETHER = WHITE

• for screens

subtractive color

CMYK (cyan, magenta, yellow, key)

• ADDED TOGETHER = BLACK

• for printing

gamut

range of color, monitors v. printers

key to accessibility of color

employing sufficient color contrast (4.5:1 or higher) & using non-color cues (text labels/patterns) to convey information that would otherwise rely on color alone

triadic colors

uses power of three colors situated at 120 degrees form each other (equilateral triangle) on color wheel

split complementary colors

Y shape, goes across & to either side of the circle

tetradic colors

double complementary, uses long rectangle to put colors together