December 9, 2015

What’s DUE:

• Steps 1-3 of Project #5 : Phase 3 Guidelines
  • 10+ thumbnails and documented research to show idea development and critical thinking.
  • Fully developed preparatory drawings showing your and your partner’s silhouette icon.
  • Color mockup to clearly communicate color personalities and interactions.
• (5) Project #4 pages for HUMUMENT (this was due LAST class)
  1. Range of Saturation (Prismatic Color, Muted Color, Chromatic Gray)
  2. Luminosity
  3. Primary Colors & Secondary Colors
  4. Complementary Colors
  5. Color Temperature (Warm, Cool)

Critique

Present your Paired Color Identities Free-Study (in-progress) with your partner.

• 10+ thumbnails and documented research to show idea development and critical thinking.
• Fully developed preparatory drawings showing your and your partner’s silhouette icon.
• Color mockup to clearly communicate color personalities and interactions.

Present your Humument.

LAB

Free-Study work

• Scan your drawings – {dropbox link to scans}
• Guidance using illustrator to create your icon from drawings
• Continue work on Free-Study in class
• Practice good time management. You will present your final work next class. Make this one count!

Homework

ALL PARTS OF Project #5 ARE DUE!

• Review the guidelines to be sure you have completed everything including posts and comments to the class blog.

December 7th, 2015

Critique (15 min)

Present your:

• Color Interaction Studies
• Project #4 Humument pages

LAB (1 hour 45 min)

Free-Study – Paired Color Identities with Simultaneous Contrast

Color Interaction Freestudy

OVERVIEW:

Create Paired Color Identities that demonstrate Simultaneous Contrast and an exploration of Color Meaning. Use color and image to represent yours and your partner’s personality. The final work should demonstrate how one hue can have two different identities depending on what hue it is surrounded by. Do this by exploring shifts in value, hue, saturation, and temperature. 

Follow the Project #5 : Phase 3 Guidelines

BY THE END OF CLASS:

• You and your partner should have completed Steps 1-3 of the Project #5 : Phase 3 Guidelines and should be prepared to start working independently at home.
• Create a work schedule. You will have approximately one week to complete this Freestudy. Do not rush. Do not procrastinate. Use this project to demonstrate what you have learned in this course thus far.
• Come to an agreement about your respective color choices and shared contrasting color.
• Experiment with color palettes to demonstrate your color interactions and relationships.
• Decide on the layout of your compositions. ie: How will the figure and ground relate? How will the layouts of the paired compositions relate?

Student Examples:

Homework

Free-study Work DUE:

• Complete Steps 1-3
• Begin Step 4. Create “mockups” of your final work in Illustrator. These should communicate your intentions for the color, form, and content of your free-study to the class.
• YOU WILL BE CONTINUING FREESTUDY WORK NEXT CLASS. Come prepared to work.
• Here are some Field Trip possibilities:
  • Cooper Hewitt
  • Museum of the Moving Image
  • Brooklyn Museum
  • Moma

December 2, 2015

Materials

• USB drive
• Humument (and any materials needed to complete Project #4 Humument work in class)

What’s Due?

• Printed Group 1 & 2 Interaction Studies
• Next Field Trip post and comments
  (Klever? I believe you volunteered to start this discussion.)

Lab: NEXT INTERACTION STUDIES

Group 3 : Shifting Hue, Not Value

• Create (2) color interaction pairs by shifting hue, but not value.
• Use this example photoshop file.
• Choose one hue as your small, center square color and attempt to make this one color appear as two by varying the surrounding color in the larger square.
  • Try to keep the perceived value of both the background square and the center square the same. The shift should only be visible as a shift in color/hue in the center square.
  • For the large background squares choose hues that share similar value, but are a different in hue (ie: complements work well to achieve this type of shift).
  • The background hues will cause the center square to appear as if it’s a different hue. This may be a subtle shift in temperature (warm or cool), but observable.

Example: The center square on the right appears reddish-violet when surrounded by green (complement of red) and the one on the left appears more bluish-violet when surrounded by orange (complement of blue). Notice the value doesn’t change.

adjustments in hue, not value

adjustments in hue, not value (seen in grayscale)

Group 4 : Shifting Hue and Value

• Create (2) color interaction pairs by shifting hue and value.
• Choose one hue as your small, center square color and attempt to make this one color appear as two by varying the surrounding color in the larger square.
  • Make large squares 2×2″ and small squares 1/2 x 1/2″.
  • The small squares will sit in the middle of the large squares and should be the same for each pair.
  • For the large background squares choose hues that are different in value and also quite different in hue. The background hues will cause the center square to appear as if it’s a different hue and also a different value. This may be subtle, but observable.

Example: The center square on the left appears both bluer and darker when surrounded by yellow-orange. The center square on the right appears both lighter and more reddish when surrounded by blue-green.

Hue & Value Interactions

Hue & Value Interactions

Presentation:

• Your final Color Interaction Studies should be ACCURATELY PRINTED on laser copy paper.
• You will need to take your files to a copy shop, like Kinkos on Court St, SaveMor, Remsen Graphics. Do NOT “scale to fit” when printing.
• Even if your digital files are accurate, if your printouts do not demonstrate the color interactions intended, you will not receive credit for this phase.

HOMEWORK

• Complete color interactions Group #3 & #4
• Complete 5 Humument pages for Project #4 by demonstrating the following concepts:
  1. Range of Saturation (Prismatic Color, Muted Color, Chromatic Gray)
  2. Luminosity
  3. Primary Colors & Secondary Colors
  4. Complementary Colors
  5. Color Temperature (Warm, Cool)

November 25, 2015

Materials Needed

• Download and bring to class on your flash/thumb drive:
  • your group’s sample poster from Swissted.com
  • these sample files
• Your group’s cross-sensory phrase and color scheme.
• Your group’s mockup poster using colored pencils, illustrator/photoshop or other materials.
• If you have a laptop with Illustrator on it, please bring it.

Due today:

• Bring completed saturation studies and color wheel to turn in.

Discussion :

• Refine didactic panel for FYLC poster (Ayano, Jingyi, Brandy, Brian, Jay, Ruky, Ying Yang, Shadin, Romie).
• Project #4 Milestones, Freestudy check-in and Class 20 Review:
  • Chromatic gray
  • Muted color
  • Prismatic color
  • Narrow Value (High-Key or Low-Key) or Broad Value
  • Temperature (warm and cool)
  • Visual Hierarchy
  • Cross-Sensory Metaphors
• Project #3 grades are posted. Check your grade and see me with questions or for additional feedback.

New Vocabulary:

The Principles: basic assumptions that guide the design practice.

• Balance is the concept of visual equilibrium or equalized tension, used to create harmony, order, and cohesion. While visual elements don’t have a physical weight, they do have visual weight.
  Some things that affect visual weight:
  • Size
  • Color
  • Density
  • Value
  • Whitespace

  Most compositions accomplish the balance of these visual weights in one of two ways: symmetrically or asymmetrically.
  

• Symmetrical balance can occur in any orientation as long as the image is the same (weight, form) on either side of the central axis. The result is formal, organized and orderly, but it is easy to over emphasize the center axis. Symmetrical images have a strong sense of unity, but at the same time symmetrical balance can lack variety. Used primarily for stability: backgrounds, patterns or any layout that requires a strong organizational structure or a trusting, safe feel to the design. Symmetry = PASSIVE, FORMAL SPACE
•  Asymmetrical balance means balance without symmetry. It is possible to achieve balance without symmetry so that the placement of elements of varying “visual weight” will balance one another around a fulcrum point. Imagine a scale with several small objects balanced by a large object. Use asymmetry to draw attention and create visual interest. Asymmetry can make designs more interesting overall and also serves to create visual hierarchy in order to direct the viewer’s eyes to a certain area. Asymmetry = ACTIVE, DYNAMIC SPACE
• Other types of Symmetry:
  • Radial / Rotational Symmetry is when an object is rotated in a certain direction around a point. It is often used to communicate direction or motion.
    
  • Bilateral / Reflection Symmetry is the “mirror” effect, or when one object is reflected across a plane to create another instance of itself.
    
  • Translational Symmetry: when an object is relocated to another position while maintaining its general or exact orientation. Used for repeated patterns, to create movement, or to reinforce stability.
    
• References:
  • Vanseo Design
  • Web Design Depot
  • Six Revisions
• QUESTIONS:
  • When do we use SYMMETRICAL BALANCE?
  • When do we use ASYMMETRICAL BALANCE?

Lab: Swiss Style Band Poster Freestudy (part 2)

Objective:

Based on your collaborative FREESTUDY exercise (part 1), recreate your team’s band poster concept using Illustrator. NOTE: if your team didn’t adequately complete the exercise last class, you will need to rethink it.

Demonstrate the ways in which Cross-Sensory Metaphor and visual hierarchy can be conveyed using Saturation, Value, Color Temperature, Symmetry, and the Grid provided.

The colors, composition, and style will be based on the (3) cards your team worked with last class.

We will do this together in class using these sample files.

If you missed this class, contact me ASAP.

Homework

• All parts of Project #4 are DUE, including all posts/comments, the collaborative Free-Study collage and the independent digital Free-Study. (See Project #4 for details.) by Monday. 
• Have a relaxing holiday break!