Before & After

Table of contents

1. Copyright
2. Acknowledgements
3. Introduction
4. Knowledge
   1. Design without rulers: Put away your ruler. Here’s how to design the way you see.
      1. 1. Take a visual inventory
         1. Focal point
         2. Objects and spaces
         3. Close enough...
         4. A natural grid
         5. Shape and texture
      2. 2. Choose colors
         1. Organize
         2. Try each one on
      3. 3. Select type
         1. Three viewing distances
         2. Turn it upside down
         3. Watch the surface
      4. 4. Layout
         1. Set the headline
         2. Add photos and text
         3. Align to the paper
   2. The empty page has a lot to say: Don’t fly past that setup dialog! It’s where your design begins!
      1. 1. Page size
      2. 2. Orientation
      3. 3. Margin width
   3. Our color wheel: The color wheel is our tool for understanding which colors go with what.
      1. What are the colors?
      2. Colors in common
      3. Color value
      4. Color relationships
         1. Now for a quiz
   4. How to find the perfect color: The color palette you need is already hidden in the photo. Here’s how to find it.
      1. 1. Look close, closer, closest
      2. 2. Pull out the colors
      3. 3. Try each one on
      4. 4. Add to the colors
      5. 5. Create color palettes
      6. 6. Edit and apply
   5. What typeface goes with that?: How to pick a typeface that complements a graphic.
      1. 1. Evaluate the image
      2. 2. First edit: Incompatible typestyles
      3. 3. Second edit: Line and proportion
      4. 4. What’s left?
      5. 5. Third edit
      6. 6. Put it to work
   6. How contrasts create type style: Using contrast properly can make or break your typographic design.
      1. 1. What pump are you on, Sir?
      2. 2. A change of color clarifies
      3. 3. Weight change adds a third level
      4. 4. Color contrasts are stylish
      5. 5. Without the bar, space is needed
      6. 6. Stacked in two columns
   7. Typography 101: Type is a tool: Learn how to use it properly, and your work improves.
      1. 1. What should you do?
      2. 2. Watch your spacing
      3. 3. Learn to use ligatures
      4. 4. Use proper fractions
      5. 5. Straighten that wiggly edge
      6. 6. Quotation marks, apostrophes, and primes: the differences
   8. Character parts
      1. 7. 48-point type in three sizes
5. Technique
   1. Many from one: Big photos have small photos inside. Here’s how to get several images out of one original.
      1. 1. Story
      2. 2. Scale
      3. 3. Same technique, different look
      4. 4. Look at the details
      5. 5. Layout
      6. 6. Similar colors harmonize
      7. 7. Opposite colors contrast
   2. More from less
   3. Cropping basics: How to crop photos for function and meaning.
      1. Zoom Crop to tell a story
      2. Unify Crop mugs the same size
      3. Position Crop closeups at eye level
      4. Simplify Crop out the dead stuff
      5. Angle Level those horizons
      6. Extreme Crop to fit a space
      7. Position Crop to change a meaning
   4. Background selection
   5. Focal points: Complex or ambiguous photo? Eight simple ways to put the reader’s eye where you want it.
      1. 1. Draw an outline
      2. 2. Blur the background
      3. 3. Add a spotlight
      4. 4. Bring her forward
      5. 5. Match a color
      6. 6. Fade a section
      7. 7. Crop and color
      8. 8. Guide with lines
   6. Cool covers: Ten simple ideas for great-looking covers
      1. 1. Build a cover of squares
      2. 2. Many photos? Display them in a grid!
      3. 3. Narrow page makes a “revealing” cover
      4. 4. Condense your design
      5. 5. Less makes for more impact
      6. 6. Create a natural backdrop from recycled parts
      7. 7. Design a bold, sleeve-style cover
      8. 8. Set a beautiful title in one line
      9. 9. Make a picture-frame cover
      10. 10. Do more with less
   7. How to design a second page: You’ve designed a beautiful outside. How do you follow it up inside? Simply.
      1. 1. Repeat the center of interest
      2. 2. Lift out one piece
      3. 3. Make your own object
      4. 4. Find something in the scene
   8. Bring the outside in
   9. Simply borderless: How to design pages for desktop printers that can’t print to the edge.
      1. 1. Make more white
      2. 2. Get moving
      3. 3. Coordinate the type
      4. 4. Make a landscape
      5. 5. Create a focal center
      6. 6. Energize the page
      7. 7. Align right
   10. Voice-over captions: A caption can be much more than a label. Here’s how to get it onto your picture and into your story.
       1. 1. Detached yet visually related
       2. 2. Just whisper
       3. 3. Punctuate
       4. 4. Immerse
       5. 5. Balance creates a serene statement
       6. 6. Step in: The caption takes center stage.
       7. 7. Take over
   11. Multi-caption photo tells many stories
       1. 8. Focus: Connect the photo to the story
   12. Multiple captions in high style
   13. Lessons from a beautiful site: The University of Miami College of Arts & Sciences shows that beauty really is in the details.
       1. 1. Structure
       2. 2. Header
       3. 3. Main links
       4. 4. Sub links
       5. 5. Main stage
       6. 6. Footer
       7. 7. Type
   14. A welcoming home page: Greet all of your online viewers.
       1. 1. The basic ingredients
       2. 2. Repeat the look inside—but smaller
   15. Simple, bold, bright: Minimalism works on any scale.
   16. Organize that card
   17. The power of the postcard: Big image and small type, or big type and small image: Either works well.
       1. 1. Big image, small type
       2. 2. Big type, small image
   18. Put a photo in your name: Words and pictures can be stronger than words alone.
       1. Another photo approach
   19. Functional beauty
6. Projects
   1. Make a theme: A simple graphic can provide a focal point, color, and continuity.
      1. 1. Problem: It all looks alike
      2. 2. Problem: It’s all rectangles
      3. 3. There’s the story!
      4. 4. Cover image is key while panels handle separate jobs
      5. 5. A multi-faceted presentation
      6. 6. Bi-level typography
      7. 7. Butterfly makes a theme
      8. 8. On a page of rectangles, a curvy counterpoint
   2. Design a story-style brochure: Fold—and unfold—a single sheet into an appealing, narrative-like presentation.
      1. 1. Start with the cover
      2. 2. Open once...
      3. 3. Open twice
      4. 4. Beautifully, simply designed
      5. 5. Wrap it up
   3. Template: Story-style brochure
   4. Design a pocket-size brochure: Eight small pages tell a big story.
      1. 1. Cover and first spread
      2. 2. Second spread
      3. 3. Main spread
   5. Template: Pocket-size brochure
   6. A small newsletter that reads big: Half-size page is easy to design and creates a strong impression.
      1. 1. Divide the spread into two fields
      2. 2. A field within a field
      3. 3. Similarities connect the fields
      4. 4. Crossovers connect the fields
      5. 5. Design simply
   7. Design a “photo” graph
   8. Design a card the easy way: A photo and one block of type is all it takes to make a beautiful card.
      1. 1. Start with the words
      2. 2. Add the photo
      3. 3. Use both sides
      4. 4. Add some background
      5. 5. Fade to black
      6. 6. Get vertical
      7. 7. Find color
      8. 8. Use an object
      9. 9. Create a gallery
   9. Design a dual-purpose letterhead: Legal-size sheet can serve as your letterhead and provide a bonus, too.
      1. 1. Create a visual image of your world
      2. 2. Select and set type that conveys history and stature
      3. 3. Maintain the look down the page
   10. How to set a text-only logotype: The key is to work with the natural pattern of your letters.
       1. 1. A logotype starts with the alphabet
       2. 2. For example...
       3. 3. Find your pattern
       4. 4. Pattern breakers
       5. 5. Pattern makers
       6. 6. Shape makers
       7. 7. Design a card
          1. Avant Garde
          2. Sloop
          3. Adobe Garamond
          4. Copperplate Gothic 32BC
          5. Bureau Grotesque Extra Compressed Black
          6. Lettrés Eclatées
          7. Planet Kosmos
          8. HTF Didot
          9. Helvetica Neue
   11. Design a flier that comes back to you: On a budget? Design a flier that doubles as its own return envelope!
       1. 1. Catch the eye of the passerby
       2. 2. Select a monumental typeface
       3. 3. Change typestyles when the message changes
       4. 4. Work around the envelope
       5. 5. Voice modulation is key
   12. Template: Flier that comes back
   13. Small site, great format: This simple beauty is ideal for professionals and small enterprises.
       1. 1. Make the foundation
       2. 2. Place text and graphics
       3. 3. Make a gallery
       4. 4. The details
   14. Template: Small format website
   15. Design a beautiful Web header: Create an effective header the easy way. Just think in sections.
       1. 1. Start by divvying up the space
       2. 2. Find an expressive photo
       3. 3. Color the sections
       4. 4. Set the name and navigation
       5. 5. Use the opposite color
       6. 6. Design to the logo or other graphic
   16. Design simple presentations: Visual brevity will help a great talk.
       1. 1. Use a plain background
       2. 2. Use a clear typeface
       3. 3. Make one point per slide
       4. 4. Add points one... at... a... time
       5. 5. Unify with layout
   17. Picture your presentation: Photographs give your audience an emotional connection to your words.
       1. 1. You are the show
       2. 2. One thought at a time
       3. 3. Use surprise
       4. 4. Be funny
       5. 5. Find beauty
       6. 6. Dramatize
       7. 7. Show faces
   18. Design a panoramic booklet: A cross between book and magazine, this landscape format is unusually easy to lay out.
       1. 1. Format basics
       2. 2. Layout configurations
       3. 3. Types of type
       4. 4. Single-story spreads
       5. 5. Two-story spreads
       6. 6. Space fillers
   19. Template: Panoramic booklet
   20. Design below the line: Simple technique creates a report that looks open and inviting.
       1. 1. Make the lines
       2. 2. Design below the line
       3. 3. Hang the pictures
       4. 4. Where to hang the next story
       5. 5. Hangline connects cover to inside