Logo Writing Assignment: History of the Google Logo

History of the Google Logo

   

     For my logo design research writing assignment I chose to research the history of the google logo. As I am sure everyone is aware, Google is one of the most famous and most popular companies in the history of the world. In fact, it is ranked #2 just behind Apple. Being that it is such a huge company, its brand and logo are both extremely important and influential. 

     Google's logo has gone through roughly seven to eight changes and variations since it was founded on September 4th, 1998. But out of these seven changes, three of them stood out to me as the most distinct. We'll start in 1998, this first logo was created by Larry Page using a graphics program by the name of "GIMP". As you can tell, this logo has an exclamation point, and the color pattern was supposed to follow a primary color palette pattern but instead of having the "l" be a yellow, they changed it to a green, which is a secondary color. This was said to follow Google's brand DNA in that "it doesn't follow the rules". The next change was made in May, 1999 and consisted of a new, thinner, typeface. Also, the exclamation face was removed from before. This version of the logo would remain the same for about 11 years till the drop shadow was removed from the letters. In September 2013, Google went to more of a modern approach to their logo with a flatter design, and no more shadows or highlights. And recently, on August 31st, 2015 (Almost 4 months ago) Google, changed their logo once again, but this time it fashioned a completely different sans-serif typeface with a more geometric look to it rather than their old serif font which had a more playful look to it.

Final Logo Development: 3 Sketches

Identity Package [Light]

Identity Package [Dark]

Logos

Package Design: Goblin O's

Logo & Branding Notes

Logo and Branding

Brand?

-the "perceived" emotional corporate image as a while, it is the reputation both claimed and perceived

****Perceived emotional corporate image as a whole****

Branding?

-Their public image

-A designer can create the framework for a brand, colors, fonts, artwork style, etc.

    audience completes brand through an emotional reaction.

Ex. Apple

-humanist image

Identity

-corporate identity is comprised of the visual aspects that form the brand

-close attention is paid to executing a consistent experience for the viewer

-Corporate identity includes strict usage of: colors, fonts, graphic elements etc.

-Include logo, logo variations, business cards etc.

* * * *Visual aspects that form part of the overall brand Identity Design****

Logo

-logo is for identification

-is the simplest way a company or organization can represent itself, through the use of a mark or icon

****Identifies a business in its simplest form via the use of a mark or icon****

Logo design

Vector Art

-Create logo's as vector art because its flexible powerful and easily editable, this is important when clients want the make changes

-Vector art can be scaled up infinitely without losing quality

-Looks good in multiple forms ex. black & white

Pencil to Vector

-Creating a logo design require many phases

-Many meetings and review sessions are required to arrive at a design that works

-Converting to a simple pencil sketch to vector art requires establishing graphic style, color, line, shape and typography

Final Art: Graphic Style

-Decide what your "graphic style" will be

Sleek, Bold, Simple, Cartoony, Playful etc.

Line Quality

-Line Quality refers to the smoothness and precise nature of your lines

-Use the Pen Tool to create perfect smooth lines

-Take your time with this part, keep trying

-Stroke Palette

    Line Shape

    Art Brushes

Color

-Extremely important

-Color makes a huge difference, use colors that are appropriate for you design

Logo desing rules

memoriable

scalable

black and white

Design Styles

1) Typeface Focused

-Relies of a typeface to create the logo design, creativity is utilized in the proximity, contrast, color,       customization or the letter forms

2) Mixing Typeface

-Uses 2 different type faces to create the logo design. Strive to create a balanced design, typefaces that are too similar will lack contrast in style

3) Typeface plus Graphic Element

-Uses simple graphic elements in addition to the typeface to create an emphasized and balanced design Graphic elements remain abstract

4) Typeface plus shapes/symbols

-an even balance between art and typography is achieved in this style

5) Graphic Focused Design

-Elements are the focus or dominant aspect of the design, the typeface plays a supporting role

Kellogg's Frosted Drakes

Porfolio Cover (2)

EARL

Portfolio Cover Design

Typeface

ROP Career Skills

ROP Career Skills
How to write a great resume
...........................................................................................

ROP Portfolio
A portfolio containing three of more of your best work samples and a written explanation of each piece 
-Letter of Introduction
-Resume
-List of References
-Letter of Recommendation
-Use the ROP Portfolio Handbook as a Guide

Job Seekers Trifecta
-A solid well written and well designed resume
-An equally well crafted list of positive references
-A flawless handwritten job application

Resume should Have
-who you are and how you can be contacted (larger font)
-Your job objective (seeking...) tailor it to what you're applying to 
-Your level of education (high school, 10th grade) (ROP Graphic Design)
-Your work history or experience (working for parents is ok)
-your special skills and abilities

Edit and Refine your Resume
-Take time to write your resume 
-No typos use, spellcheck
-No mistakes, look for double words, grammar errors
-No misleading information
-Format your text for easy reading and searching

Resume Writing Tips
-List most recent job experience first
-List most important skills first
-leave out the obvious
-avoid negativity (wasn't a good fit, -for schedule/looking for something better)

-Go with what you got: summer jobs, volunteer experience, clubs, relevant hobbies
-Don't have a degree or diploma? State your estimated date for completion, class of 201(x)
-Proofread! Ask at least 3 people to read your resume in detail to spot mistakes. Catch them before your interviewer does!

Style Can Vary
Just keep it professional, well organized and easy to read

ROP Portfolio Handbook =
Contains tips and guides for all aspects of your portfolio
Has 2 sample resumes and resume  template to fill out so you can get started
Link is  on class blog download the pdf file to your computer and read it thoroughly

How to get started.. 
-Find a program to write your resume with such as word google docs or pages
-think of what your ideal job might be this summer or in the future, align you resume info and objectives to that job
-Use the Resume Template in the ROP Portfolio Handbook and list all you important details

Design Elements. I forgot to post this

Hand Lettering

Typography poster

Color Wheel

Color Palette

Design/ Typography Notes

Typography

Legibility
Small text is easier to read as Serif
Sans Serif is used more in titles

Serif vs Sans Serif 
Serif -reads best at small sizes complimentary

Font Variance
Too many confuse the reader
"Too many fonts spoil the design'
***2 fonts***
        Fonts that are too similar cause ambiguity
Use upper and lower case letters for optimum clarity
NOT ALL CAPITAL LETTERS -unless titles, headlines etc.

Alignment
Left alignment reads easiest -eye flow as moves down page
center alignment is more dramatic
Want to have even rags

Emphasis
1 Italics
2 Bold
3 Size
4 Color
5 Typestyle Change

Integrity
Avoid Stretching of distorting type

Weight
Strive for a sense of balance

Kerning
Space between letters
Tracking
Applied to entire word

Large Text Blocks: Rags
Want closer to flat line at end of text

Color Theory

Color Theory

Primary -Red Yellow Blue OR... Red Green Blue
                 Pigment                           Light

Secondary -Green Orange Purple
Tertiary -Secondary colors mixed

Paint, or light to generate color
"ROYGBIV"

Primary

Pigment -Subtractive

Light -Additive
Red, Green, Blue -Make white

Secondary/Tertiary

Warm- Red, Orange, Yellow
Cold- Green, Blue, Purples

Darker color -farther away, receding
Lighter color -closer

Color Mixing

Ex:
CMYK for printing
RGB for light
RGY pigment generated

Color Modes

Ex:
Monochrome/monochromatic:   Tints, shades of single hue

Grey Scale:    Black and white only

Web Safe RGB:    Hexadecimal compatible

Color Modification

Tints: White to a pure hue
Shades:  Black to a pure hue
Tones: Grey to a hue



Color Harmony
Colors that work well together
Opposite of each other on color wheel

Split Complementary
Opposite, + few to left/right

Analogous
Next to each other
Almost monochromatic -has more depth

Triad
color wheel -triangle

Tetradic
4 point rectangle shape inside color wheel

Quadtriateral
Square in color wheel

Color Palettes

Cultural and Psychological Color Association

Why Color Matters
      -73% of purchasing decisions are now made in-store
      -catching the shoppers eye
      -can increase 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 Affects the Mind

Rocket Arms GIF

Design Elements notes

Elements and principles

Design/art elements, basic hits of visual image

Prnciples of design and art govern the relationships of the elements used and organize the composition as a whole

Imagery, art, design, photography, are composed of elements that can be broken down and analyzed by its visual

Design Elements:

-Space

-Line

-Color

-Shape

-Texture

-Value

-Balance

Space

can exist in 2 or 3 dimensions

can refer to positive space or negative space

foreground mid or background elements

Line

-can vary in thickness, texture, direction

-has to be longer than it is thick to be a line

Color

Geometric/Organic/Abstract

Texture

value

gives illusion that object has depth, or occupies space

Balance

Design Principals

-Unity

-Variety

-Repetition

-Harmony

-Proximity

-Proportion

-Functionality

-Emphasis

Unity

-creates sense of order, consistency in size and shape

-Proximity can create a sense of unity, and can also show lack of unity

Variety

-Similar yet different elements

Repetition

-self explanatory

Harmony

-similar elements being used and repeated

Proximity

-organization of information (business letter demo)

Proportions

-able to create visual illusion-depth

-can also change perception

Emphasis (focal point)

-focus of picture

Functionality

-playfulness in a picture, idea

File Formats

To me, the best image quality has to be png-24, the colors look accurate and the overall image looks          crisp. The best file size would have to go to the jpg low, at only 13KB. Overall, I think that the best balance in file size and image quality would be the jpg high. It is only 34 KB which isn't that big at all, and it looks decent considering its size.

Picture Collage

Understanding File Formats

Graphic File Formats

Understanding Format Choice and image compression

Original (raw) files need to be compressed to be able to share-- 

ai psd     ----->>>          jpg png gif 

File Formats

All computer document/files are packaged in different formats

Format is determined by file origin. Ex photoshop, digital camera

Graphic files- (photo/video) artwork can be reduced in size using image compression formats

Lossy vs Lossless 

Graphic image formats fall under 2 categories of compression: Lossy & Lossless

Lossy---

Image data is "lost" or reduced for smaller file sizes, but can cause poor image quality

Lossless---

Retains image data for higher quality, but larger file sizes

 Compression Artifact (pixelisation)

Generational loss---loss of quality over time (copy of copy of copy etc.)

Graphic Formats

TIF  GIF and JPG  -- are (were) the 3 most common formats for common activities --- printing, scanning, displaying images over internet

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

Each format has its own advantages/disadvantages

File format: TIF

"Tagged Image Format"

common for desktop publishing, print, photo, and graphic design

Lossless file format, retains image data for max image quality'

Can result in larger file sizes- not for display over internet

File Format: JPG

"Joint Photographers Expert Group"

Specifically made for digital photography, best for photo content

Lossy format

Can reduce image size by 10:1 without showing significant compression artifacts

level of compression can be adjustable

File GIF

"Graphic Interchange Format"

Is best for graphic/images that have flat color or even tone- like 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 a proper format for print

Know Your Pixels

TIF/GIF are best for images with pixels that blend in color --- called "contiguous pixels"

GIF is best for images with flat/ even tone "non-contiguous pixels"

Aliase vs Anti-Aliase

Aliased-- jagged edges

Anti-Aliased-- tries to smooth edges

Pixel Art

Pen Tool Practice

Box To Car

Helicopter Place and Trace