I need to make what?

Graphic design for people with other stuff to do.

There is noRight or Wrongin Graphic Design

Only Effective & Non-Effective

Communication

contrast

ionrepetitionrepetitionrepetitionrep

proximity

a l i g n m e n t

CONTRAST

There are many ways to create contrast:

large wordssmall words

serious font fun font

thick line

thin line

dark light

horizontal

vert

ical

Examp les

PROXIMITY

don’t fill up empty space

INFORMATION

INFORMATION

INFORMATION

INFORMATION

INFORMATION

INFORMATIONIN

FORM

ATIO

NIN

FORMATION

space should be organized so information is easily seen

SPACE

SPACESPACESPACESPACE

Which one i s be t ter?

Which one i s be t ter?

Which one i s be t ter?

ALIGNMENT

ALIGNMENT

ALIGNMENT

ALIGNMENT

ALIGNMENT

use rulers and margins to create alignment

Types of Al ignment

Which one i s be t ter?

Which one i s better?

REPETITION

creating repetit ion

• Bullets• BOLD FONT•Color• Line• Spatial Relationships• Shapes

LAYOUT

Ask yourself… :• Purpose?• L im i ta t i ons?

• P a p e r s i z e , c o l o r v s . b / w , p a p e r t y p e ( c a r d s t o c k , g l o s s y )

• H i e ra rchy?• W h a t i s m o s t i m p o r t a n t ?

• How w i l l I show impor tance? • C o l o r• T e x t u r e• P l a c e m e n t• S i z e

• Does the f l ow make sense?

• I s i t c l ea r?

• Can i t be ed i t ed?

COLOR

Which Colors to Choose?• Color can transform your design. They create mood - calm or refined,

vibrant and energizing. • No more than three colors plus black and white

Here are some awesome free tools to help you with color.• Colorzil la — (browser add-on) Pick up colors on any webpage using an eyedropper

tool .

• DeGraeve — Enter the URL of an image, and DeGraeve wil l give you a color palette (in two versions: dul l and vibrant).

• Design Seeds — Image and a matching color palettes.

FONTSTypography is 90% of Design• Line height

• Be aware of space. Less space between l ines in a group.

• Use TWO (2) fonts • body • heading • MAKE THEM DIFFERENT!

• Use Narrow Columns • 58 characters per l ine

• Pick only TWO (2) colors

Tools: • 1001 Fonts — Free fonts, and al lows you to preview a font with your own words before

downloading it .• DaFont — Free fonts AND dingbats. Tiagdkja Dingbats! • Typewolf — Gives examples of fonts on current websites. Provides a guide on how to “mix and

match” fonts.

IMAGES

Free imagery• Flickr—Search for Creative Commons-licensed images.

• Google— Use the filter that allows you to search by license type to find images you can reuse.

• Morgue File – Free and pay images.

• Pixabay— Includes vector images, which can be resized without reducing quality. Look for transparent backgrounds, indicated with a checkerboard pattern.

• The Noun Project— Provides icons you can add to photos or designs.

Other Quick Tips

• STEAL!

• Use white space

• Use photography

• Sketch it first

• Use icons to cut down on text

• Find your voice

Creating Taglines

Poster

• Make a really rough sketch on paper of where the elements could go.

• National Library Week • Tagline• Time • Date• Activities Planned• Photo/Image• School or Library logo

• Remember!: Only 2 fonts, 3 colors, alignment, group similar info, make sure you have white space, have fun!

Other Cool Tools

• Typegenious typegenius.com/• Pairs fonts

• SkillShare skillshare.com/• Free classes

• Infogr.am infogr.am/• Charts and Infographics

• Easelly www.easel.ly/• Fun infographics

• Pixlr pixlr.com/• Free photo editor

• Rinse rinse.io/• Photography portfolio maker

• Canva canva.com/ • Poster making software

• SMORE smore.com/• Newsletter making software

• Dribbble dribbble.com/• Show and tell – A place to steal

ideas!

• Graphic Springs graphicsprings.com/• Easy Logo Maker

• Be Funky• Poster and online content maker

Websites

• “Graphic Design Principles” - https://jmcintyre.wikispaces.com/TGJ2O_graphic_design_principles

• “It’s all C.R.A.P.: Four Principles of Design” - http://www.thinkaroundcorners.com/2011/10/c-r-a-p-principles-design/

• “Understanding Graphic Design” - http://www.slideshare.net/elemICT/understanding-graphic-design?next_slideshow=1

• “20 Secret Design Tips and Hacks for Non-Designers” - http://www.designforfounders.com/tips-and-hacks-alt/?utm_expid=84209721-3.4ys5OwiLTRWOge5u-gI5Jg.1

• “The Principle of Proximity in Design” - http://www.webdesignerdepot.com/2010/01/the-principle-of-proximity-in-web-design/

• “The Basic Alignment Principles in Graphic Design” - http://www.printwand.com/blog/basic-alignment-principles-in-graphic-design-with-examples

• https://www.pinterest.com/pin/211035932512632696/

Mini-Exercise

• Express a concept with only a picture

In Real Life

• Make a really rough sketch on paper of where the elements could go.

• Then go to the computer and put them in.

• Print your draft and take a step back.

• Ask yourself the questions again.

• Make improvements, and repeat as necessary.