Color Swatches

Color Swatches

thing.

Color Notes

2.25.2015

Design

Color Theory

“I found I could say things with color and shapes that I couldn’t say any other way… things I had no words for.”

-Georgia O’Keeffe

3 types of Colors

• Primary
• Secondary
• Tertiary

ROYGBIV

• Red, Orange, Yellow, Green, Blue, Indigo, Violet.

Primary Colors

• Primary (RYB): Pigment generated colors are derived from these primary colors: red, yellow and blue.
• Primary (RGB): Light generated colors are derived from these primary colors: red, green and blue.
• Subtractive Color: Pigment Generated Model
• Additive Color: Light Generated Model

Secondary and Tertiary

• Secondary: Mixing primary colors creates other colors. For example: blue + yellow = green.  Blue + red = violet.
• Tertiary & Beyond: A secondary color wheel can expand to tertiary and beyond.

Color Mixing

• RGB: Red, Green, Blue. Light Generated Model
• RGY: Red, Green, Yellow. Pigment Generated Model
• CMYK: Cyan, Magenta, Yellow, Black. Print Process Model

Color Modes

• Monochrome: Tints, Shades and Tones of a single hue.
• Grey Scale: Black and White only.
• Web Safe RGB: Hexadecimal compatible.

Color Modification

• Tints: Add white to a pure hue.
• Shades: Add black to a pure hue.
• Tones: Add grey to a pure hue.

Color Harmony

• Complementary: colors at the opposite ends are complements to each other, making each other pop out.
• Split Complementary: Get compliments, and move one to another direction from one complement.
• Analogous: 3 neighboring colors.
• Triad: Making a triangle in the wheel.
• Tetradic: Making a rectangle, 2 pairs of neighbors, opposite of eachother.
• Quadrilateral: Making a square in the color wheel.

Color Palettes

• Different color palettes can invoke mood, location, emotion.

Color Properties

• Cool, Warm, Bright, Dark, Saturated, Desaturated.

Color Intensity

• Color intensity changes in relation to its surrounding color.

Color Associations

• These types of color associations are universal to all people.

Cultural and Psychological Color Associations

• These color associations are generated from cultural and contemporary sources and may not be universally recognizable.

Why Color Matters

• 73% of purchasing decisions are now made in-store.
• Catching the shopper’s eye and conveying information effectively are critical to successful sales.
• Color increases brand recognition by up to 80%

Color Affects: Appetite

• Blue is a rare occurrence in nature.
• We have no appetite response to blue food.

Color Effects: The Mind

• Pink is a tranquilizing color that drains your energy.
• Used in prisons, holding cells, opposing team locker rooms.

Color Wheel

Color Wheels!

Cinemagraph

Cinemagraph

(woo!)

>be me

.GIF

The Pixilizer Returns, to Space!

.GIF

The Pixilizer Returns Again!

GIF Exercise

Pixelated Fireworks

Comparison Project

Picture Comparison of Photoshop Presets.

JPEG Low format is the most compressed, but quality is sacrificed by both pictures dramatically.

One of the best, if not the best image is the PNG-24, both pictures seem really solid, but the file takes up significantly more data, where the average was about 50KB, this takes 170KB

The smallest file size was the JPEG Low, at 13KB, and for the file size, it was actually a descent looking picture, but relative to what the picture actually looked like in photoshop, it was really bad, for both photos.

The best picture to use on the web in terms of size and quality I would have to say is the JPEG Medium, since it's right in the middle, but I personally like the higher quality at the cost of more data.

JPEG High

PNG-8 128 Dithered

PNG-24

JPEG Medium

GIF 64 No Dither

GIF 128 Dithered

GIF 128 No Dither

GIF 32 Dithered

GIF 32 No Dither

GIF 64 Dithered

GIF Restrictive

JPEG Low

Graphic Design Notes

My Notes in Graphic Design 2.17.2015

Notes   2.17.2015

Understanding File Formats

Understanding Format Choice and Image Compression

File Formats

   * All computer documents, or files, are packaged in different formats.

   * The format is determined often by the files origin, such as a software program like Photoshop, or device such as a digital camera.

   *  Graphic files such as a photo, video or artwork can be reduced in file size by using image compression formats.

Lossy vs Lossless

   * graphic image formats fall under 2 categories of compression, Lossy and Lossless.

   * With Lossy, image data is “lost” or reduced for smaller file sizes but can cause poor image quality. Can result in showing “compression artifacts.”

   * Lossless retains image data for higher quality, but larger file sizes.

[Don’t use JPEGs for flat graphics unless you like artifacts.]

Graphic Formats

   * TIF, JPG and GIF are the 3 most common formats for common activities such as printing, scanning and displaying images over the internet.

   * PNG is a common web format, is high quality and can contain an alpha (transparency) channel.

   * Each format has its own advantages, disadvantages.

[TIF is best for high resolution printing.]

File Format: 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.

   * Can result in larger file sizes, not fit for display over internet, is not browser compatible.

File Format: JPG

   * Stands for joint Photographers Expert Group

   * Created for digital photography and works best for photo content

   * Is a LOSSY Format

   * Can reduce an image file size by 10:1 without showing significant compression artifacts.

   * The level of compression is adjustable.

File Format: GIF

   * Stands for Graphics Interchange Format.

   * Is 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 proper format for print.

Know Your Pixels

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

   * GIF is best for images with flat even tone, or “non-contiguous pixels.”

Banner Time

New Banners for my Blog

THIS

THIS

FIXED IT

  

Photoshop Fun

Today and Yesterday's Progress:

Making Fun of Dictators

Inside the Mind of a Dictator

Nuclear Bam Bams

Both projects made in Photoshop using basic tools. The .gif includes 60 frames.

IRON MAN

Non-transparent Iron Man

 

Iron Man Line Art

IRON MAN LINE ART

Took such a long time to finish.

sweg  

whatever

Was supposed to post this as the first thing, but I didn't, so I'm doing that now.

Alright this took a little while but I got it, oh pen tool in Illustrator, you work wonders.

Pen Tests in Illustrator

PEN TESTS

The Pixilizer

The Pixilizer

From the hit movie, the Boxilizer, comes a new art piece. (sequel confirmed?)

Doge Charger

Fixed Car Graphic

Okay so I fixed my last picture with a car yesterday, just finished it a few minutes ago yo.

  

Test

Test

Testing out the new blog

A few pictures I've made in the past week, my first week, of Graphic Design:

Fabulous Walter White

Adobe Photoshop

Dodge Charger

Adobe Illustrator