Color Theory

Design

• You see ROYGBIV because its the visual color spectrum
• Pigment generated model is: Red, Yellow, Blue
• Light generated colors: Red, Green, Blue
• Pigment generated is lighter and light generated is brighter

Color Mixing

• RGB: light generated model
• RGY: pigment generated model
• CMYK: print process model

Color modes

• Monochrome: tints, shades and tones of single hue
• Gray scale: black and white only
• Web safe RGB

Color Modification

• Tints: Add white to pure hue
• Shades: add black to pure hue
• Tones: Add gray to pure hue

Color Harmony

• Complementary colors opposite of each other on color wheel
• Split complementary
• Analogous colors are next to each other
• Triad: triangle in a color wheel
• Tetradic: rectangle in color wheel
• Quadrilateral: square in color wheel

Color Properties

• Cool,Warm, Bright, Dark, Saturated, Desaturated
• Color intensity changes in relation to its surrounding color
• Color associations are generated from different cultures
• Color increases brand recognition by 80%
• Pink is a tranquilizing color

Principals and Elements of Design

Design: The Principals and Elements

What's Graphic Design?

• Design elements are the basic units of a visual image.
• Govern the relationship of the elements used and organize the composition as a whole.
• All imagery is comprised of elements that can be broken down and analyzed.

Design Elements

• Space- Gives design dimension and depth, can exist in two or three dimensions. Can refer to a positive or negative space, can refer to foreground mid or background elements.
• Line- Basic element, it can vary in thickness, texture, direction. 
• Color- Can invoke mood or sense of time.
• Shape- Inorganic, Organic or Geometric shapes.
• Texture- You can imply texture or actually have texture.
• Value- Light and dark values of an image and all gradients in between, adds depth, contrast. 
• Balance- Paying attention to visual weight of elements in design. Must pay attention to the visual weight. 

Design Principals 

• Unity- Creates sense of order, a consistency in size and shape. Proximity can create a sense of unity, it can also show a lack of unity.
• Variety- Elements in design work that are repeating but not similar, differences in repetition. 
• Repetition- Can have repetition without variety, used to enhance meaning.
• Harmony- Similar elements throughout a work so everything supports each other.
• Proximity- Gives design work a informational hierarchy. 
• Proportion- Things that are set equal to each other.
• Functionality- Something that has a purpose and delights the viewer. 
• Emphasis- Helps make something stand out from rest.

Randomized Album Cover

bus.png Format Changes: High to Low

tree.jpg Format Changes: High to Low

File Format Exercise

          After I changed the format of the bus.png and the trees.jpg I found out what looked the best and had best size. For the bus.png I found that the GIF-128-No-Dither had the best clarity and size value. The PNG-24 did have the best image quality but the size was 3.2 times larger than the next largest size. The best file size is GIF-Restrictive at 16KB, it also looks the worst out of all the images.           For the tree.jpg I found that the PNG-24 had the best image quality but also had the worst image size. JPEG-low had the best size but one of the lowest qualities. JPEG-High had the best quality and size value and, it is a crystal clear image and size is small.

Lecture: Understanding Format Choice and Image Compression

Lecture: Understanding Format Choice and Image Compression

File Formats

• All files have different formats, determined from their origin.
• Files such as photo and video can be reduced in size by using image compression formats.

Lossy vs. Lossless

• Graphic image formats fall under two categories of compression, Lossy or Lossless.
• Lossy image data is “lost” or reduced for smaller file size, this can cause poor image quality. Can result in showing “compression artifacts.”
• Lossless retains image data for higher quality, but larger file sizes.

Graphic Formats

• TIF, JPG and GIF are three most common formats for activities such as printing, scanning and displaying images over the internet.
• PNG is common web format, is high quality and can contain an alpha (transparency) channel.
• Each format has its own advantages and disadvantages.

TIF

• Stands for Tagged Image Format
• Common format for desktop publishing, print, photo and graphic design.
• Is a Lossless file format. It retains image data for maximum image quality.

JPG

• Stands for Joint Photographers Expert Group.
• Created for digital photography and works best for photo content.
• Is a Lossy format.
• Can reduce image file size by 10:1 without showing significant compression.  

GIF

• Stands for Graphics Interchange Format
• Best for graphics or images that have flat color or even tone, such as a cartoon.
• Reduces image size by “indexing” color from 3 channels to 1
• Is adjustable by changing color bit levels from 1 to 8
• Contains no DPI (Dots Per Inch) data for printing. Not good format for printing.

Know Your Pixels

• TIF and JPG are best for images with pixels that blend in color, these are called  “contiguous pixels.”

Photoshop Collage

Iron Giant

Pen Tool Skillz Exercise

Datsun 510

What Even is Animation?

Mario Bitmap ART