LP_Surkan_Page_Layout_and_Design_Princip

Views:
 
Category: Education
     
 

Presentation Description

No description available.

Comments

Presentation Transcript

Page Layout & Targeted Documents : 

Page Layout & Targeted Documents Brian Surkan 8th Grade Project The Walker School

Joshua Tree Principle : 

Joshua Tree Principle Knowing the vocabulary Creates awareness of detail Broadens thoughts Gives you power over the objects you can describe 12/1/2009 2 CRAP: Page Layout and Design Principles

Four Design Principles : 

Four Design Principles Contrast Differences set things apart, draw attention Repetition Consistency creates unity & predictability Alignment Alignment facilitates reading / parsing Proximity The closer things are, the more related they must be 12/1/2009 3 CRAP: Page Layout and Design Principles

Contrast : 

Contrast 12/1/2009 4 CRAP: Page Layout and Design Principles

Contrast Example: B&W : 

Contrast Example: B&W Ignore this 12/1/2009 5 CRAP: Page Layout and Design Principles

Contrast : 

Contrast Differences draw our attention Too many differences numb our attention What can be contrasted? Color (B&W strongest) Font Alignment Proximity Taste Smell Style Attitudes Ideas Age Texture Language 12/1/2009 6 CRAP: Page Layout and Design Principles

Repetition : 

Repetition Color (Coke’s color? Pepsi’s color? Republican Color?) Location (alignment) Shape (the Coke bottle, human silhouette) Font (consistent headlines, body text, Coca-Cola) Order (page numbers, sequences) Sound (in music or advertisements) Taste (KFC, Big Mac, Wendy’s Frosty) Graphic (logos, leitmotivs, the Geico Gecko) 12/1/2009 7 CRAP: Page Layout and Design Principles

Repetition : 

Repetition Color (Coke’s color? Pepsi’s color? Republican Color?) Location (alignment) Shape (the Coke bottle, Font (consistent headlines, body text, Coca-Cola) Order (page numbers, sequences) Sound (in music or advertisements) Taste (KFC, Big Mac, Wendy’s Frosty) Graphic (logos, leitmotivs, the Geico Gecko) 12/1/2009 8 CRAP: Page Layout and Design Principles

Alignment : 

Alignment 12/1/2009 9 CRAP: Page Layout and Design Principles

Alignment : 

Alignment Organizes / Groups information visually Smooth (often straight) lines Are attractive to the eye Suggest a relationship between aligned objects Alignment exceptions draw our attention Centered headers Exceptions to otherwise traditional alignment Horizontal AND vertical alignment are important Right AND left alignment are STRONG 12/1/2009 10 CRAP: Page Layout and Design Principles

Alignment : 

Alignment Organizes / Groups information visually Smooth (often straight) lines Are attractive to the eye Suggest a relationship between aligned objects Horizontal AND vertical alignment are important Right AND left alignment are STRONG Center VERY selectively Contrast to left / right alignment draws attention Centered headings / video transition screen text 12/1/2009 11 CRAP: Page Layout and Design Principles

Alignment : 

Alignment Organizes / Groups information visually Smooth (often straight) lines Are attractive to the eye Suggest a relationship between aligned objects Horizontal AND vertical alignment are important Right AND left alignment are STRONG Center VERY selectively Contrast to left / right alignment draws attention Centered headings / video transition screen text 12/1/2009 12 CRAP: Page Layout and Design Principles

Can you say “dorky transition slide”? : 

Can you say “dorky transition slide”?

More Suave? : 

More Suave?

Proximity : 

Proximity 12/1/2009 15 CRAP: Page Layout and Design Principles

Proximity : 

Proximity Relationships clarified by closeness of members Extremes Too close: claustrophobic Too dispersed: disconnected White Space is your friend 12/1/2009 16 CRAP: Page Layout and Design Principles

Test Cases : 

Test Cases Walker Web Site: http://thewalkerschool.org/ Microsoft http://www.microsoft.com/ Last Year’s 8th Grade Projects http://mediaandselfconfidence.webs.com/ http://stoppingamazonrainforestdeforestation.blogspot.com/ http://escapingtheholocaust.weebly.com/index.html http://optimizingmseducation.weebly.com/index.html http://8gppersonalities.weebly.com/ http://www.hashimotos.pbwiki.com 12/1/2009 17 CRAP: Page Layout and Design Principles

Page Layout & Targeted Documents : 

Page Layout & Targeted Documents Brian Surkan 8th Grade Project The Walker School

Sources : 

Sources 12/1/2009 CRAP: Page Layout and Design Principles 19