PCC Art 198, Spring Semester 2009

Design for the Internet

Week 3

 

Topic

Assignments/Reading:

In Class

Tuesday

Review of concepts for CSS styled resume

Design

Assignment:

Reminder: Completed Xtreme Resume due Tuesday 3/17.

More Resources for Xtreme Resume:

Typography slides, video - Jon Hicks

http://typetester.maratz.com/
Great web tool for checking for web safe fonts and comparing to your preferred font for size, weight, density, etc.

Next Project: Site for All Seasons: Newsletter Project

  • Mood Board: Due 1 week, Thursday, Week 4, (3/19).
  • Masthead image: Due in 2 weeks, Tuesday, Week 5, (3/24)
  • Completed Newsletter site: Due in 4 weeks, Tuesday, Week 7, (4/7)

On your own or in lab: Background tiles tutorial
projectseven_pixel_tiles

Review Xtreme Resume Tutorial and In-class work on Xtreme Resume
See Projects for material and files.

Cover topics:

  • Background images vs inline images
  • CSS for Background Images
  • Image text - fonts, anti-aliasing, small fonts, alt text
  • CSS Borders

projectseven.com_fw_optimize

Background tiles tutorial
projectseven_pixel_tiles
projectseven_gradient_tiles
projectseven_gradient_tiles2
efuse.com_background-basics
pegaweb.com_seemless-backgrounds

Thursday

Images for use on the web

 

Reading:

**Read this to be prepared to participate in class critiques this Tuesday, 3/17.
jasonsantamaria.com_critiquing

 

Masthead Image (Site for all Seasons) - Fireworks: Due 3/24

Masthead image is part of Site for All Seasons: Newsletter Project
See Projects for details, tutorials, resources and files

 

In -class work on Resume project

Typography on the web

wrapper div and ID

Intro to background images

 

 

 

Glossary of Terms (From wikipedia.com and http://www.digital-web.com/types/design_in_theory_and_practice/ by Joshua David McClurg-Genevese):

Hue:
the color's direction from white, for example in the CIE chromaticity diagram.
Saturation:
how "intense" or "concentrated" a color is; also known as chroma or purity.
Value:
how light or dark a color is.
An additive color system
The RGB color model is an additive model in which red, green, and blue (often used in additive light models) are combined in various ways to reproduce other colors. The name of the model and the abbreviation ‘RGB’ come from the three primary colors, red, green, and blue. These three colors should not be confused with the primary pigments of red, blue, and yellow, known in the art world as ‘primary colors’. http://en.wikipedia.org/wiki/RGB_color_model
CMYK (short for cyan, magenta, yellow, and key)
is a subtractive color model used in color printing. This color model is based on mixing pigments of the following colors in order to make other colors:
* C = Cyan
* M = Magenta
* Y = Yellow
* K = Key (Black).
http://en.wikipedia.org/wiki/CMYK_color_model
Color harmonies
Color harmonies serve to describe the relationships certain colors have to one another, and how they can be combined to create a palette of color.
* Complementary: A complementary relationship is a harmony of two colors on the opposite side of the color wheel. When complementary colors are placed side-by-side they tend to enhance the intensity (chroma) of each other, and when they are blended together they tend to decrease the intensity of each other.
* Analogous: An analogous relationship is a harmony of colors whose hues are adjacent to one another on the color wheel. Analogous colors tend to be families of colors such as blues (blue, blue-violet, blue-green) and yellows (yellow, yellow-orange, yellow-green).
* Triadic: A triadic relationship is a harmony of three colors equidistant from one another on the color wheel. Primary colors and secondary colors are examples of color triads.
Balance
is the arrangement of the objects in a given design as it relates to their visual weight within a composition. Balance usually comes in two forms: symmetrical and asymmetrical.
Rhythm
is the repetition or alternation of elements, often with defined intervals between them. Rhythm can create a sense of movement, and can establish pattern and texture. Regular: A regular rhythm occurs when the intervals between the elements, and often the elements themselves, are similar in size or length. Flowing: A flowing rhythm gives a sense of movement, and is often more organic in nature. Progressive: A progressive rhythm shows a sequence of forms through a progression of steps.
Proportion
is the comparison of dimensions or distribution of forms. It is the relationship in scale between one element and another, or between a whole object and one of its parts.
Dominance
relates to varying degrees of emphasis in design. It determines the visual weight of a composition, establishes space and perspective, and often resolves where the eye goes first when looking at a design.
Unity

The concept of unity describes the relationship between the individual parts and the whole of a composition. It investigates the aspects of a given design that are necessary to tie the composition together, to give it a sense of wholeness, or to break it apart and give it a sense of variety.

From wikipedia.com and http://www.digital-web.com/types/design_in_theory_and_practice/ by Joshua David McClurg-Genevese

 

 
 
About Us | Site Map | Privacy Policy | Contact Us