Pathwise

Visual Design Fundamentals · Lesson 12 of 12 · 12 min

Ten mistakes and your checklist

The ten ways designs usually fail, each with the fix you already know, a one-minute check to run before you send anything, and one genuinely bad slide to diagnose and rebuild.

Mistakes 1 to 5

  • 1. Everything the same size. No level 1, so the eye has nowhere to land. Fix: pick one thing and make it 2–3× the body.
  • 2. Timid contrast. Differences too small to look intended, so they read as sloppy. Fix: make near-twins identical, or push them far apart.
  • 3. Nothing lines up. Four competing edges on one page. Fix: one shared starting edge for almost everything.
  • 4. The same gap everywhere. Equal spacing erases your groups. Fix: between groups, at least twice the gap inside them.
  • 5. No margins. Text pressed against the edge looks cheap and reads badly. Fix: a real margin, around 2 cm on A4, and keep slides well clear of the border.

Check yourself

Which family does each mistake belong to?

  • Six bullets, all bold and all red
  • Text pressed against the edge of the page
  • Pale grey body text on white
  • Title, list and footer each on a different edge
  • Nothing on the page is bigger than anything else
  • Four typefaces on one flyer
Show the answer

Hierarchy: Six bullets, all bold and all red, Nothing on the page is bigger than anything else

Layout: Text pressed against the edge of the page, Title, list and footer each on a different edge

Colour and type: Pale grey body text on white, Four typefaces on one flyer

Mistakes 6 to 10

  • 6. Two heroes. A logo and a headline both winning the first look, so neither does. Fix: one focal point, everything else steps back.
  • 7. Too many colours, or colour doing the talking alone. Fix: neutrals plus one brand colour plus one accent, and always add the word as well as the colour.
  • 8. Text nobody can read. Pale grey, too small, or sitting on a busy photo. Fix: 4.5:1 or better, and design for where it will actually be read.
  • 9. Too many typefaces, lines too long. Fix: two families at most, one is safer, and 45–75 characters a line.
  • 10. Centring everything and filling every space. Fix: align long text to the reading edge, and leave the empty area alone. It is working.

Check yourself

Match each mistake to its fix

Show the answer
  • Every gap on the page is the same size → Tighten inside groups, widen between them
  • Two things are almost, but not quite, the same → Make them identical or push them far apart
  • A logo and a headline both win the first look → Pick one hero and turn the other down
  • The only sign of an error is a red dot → Add a word next to the colour
THE 60-SECOND CHECK   run it before you send anything

   1  Squint. Is the loudest blob my message?
   2  Can I name level 1, level 2 and level 3?
   3  Does every element line up with something?
   4  Is the gap between groups at least twice the gap inside?
   5  Is there a real margin on all four sides?
   6  Are all my gaps taken from one short ladder?
   7  Count the colours. Count the typefaces. Under three each?
   8  Is every piece of text at 4.5:1 or better?
   9  Are the lines between 45 and 75 characters?
  10  Does it still work in greyscale, and from the distance
      it will really be read?

Output

Ten questions, about a minute.
Most designs fail two or three of them, and fixing those two
or three is the whole job.

Keep it next to you for a month. After that it stops being a list and becomes the way you look at a page.

Check yourself

A design that passes all ten checks is guaranteed to be a good design.

Show the answer

False

The checklist removes mistakes; it doesn't supply the idea. A poster can be perfectly ranked, aligned and readable and still say the wrong thing to the wrong people, which is why the second step of a critique is the goal. What the list does guarantee is that nothing about how you made it is getting in the way of what you meant.

THE CASE

Negar's quarterly slide

A widescreen slide. A photo of the office fills it corner to corner. Over the photo, centred in white: the title 'Q3 Results Summary And Key Takeaways For The Team' at 28pt. Under it, six bullets at 18pt in light grey, also centred, running the full width. The number that matters, 'sales up 18 per cent', is the fourth bullet, inside a sentence. The logo is 4 cm wide in one corner; the date and a page number sit in the other two. A red box is drawn round the fifth bullet. Margins about 5 mm. The title and the bullets are in two different typefaces.

Before reading on, try it yourself: run lesson 10's four steps, and write down the one change you would make first.

DIAGNOSE   using lesson 10's four steps

  goal      one number should leave the room with them:
            sales up 18 per cent

  describe  photo everywhere, a centred nine-word title,
            six grey bullets at full width, a logo bigger
            than the number, three corner items, a red box,
            no margins, two typefaces

  works     the bullets are in a sensible order, and the
            wording is plain

  change 1  pull 18% out at 150 pt. It is the message.
  change 2  remove the photo from behind the text.
            Text on a busy photo is unreadable.
  change 3  cut six bullets to one line of context and say
            the rest out loud.

REBUILT

  [48]
  18%                    150 pt bold, brand colour
  [16]
  more sales than Q2      36 pt regular, near-black
  [48]
  Q3 results              20 pt grey, bottom corner
  logo 15 mm              other bottom corner

Output

One hero, two quiet levels under it, nothing in the corners fighting.
The other five bullets became things Negar says out loud.

Almost nothing survived except the facts. That is normal. The six bullets were a script, and a script does not belong on a slide.

Check yourself

Looking at Negar's original slide, which change should come first?

  1. Set the title and the bullets in the same typeface
  2. Remove the red box from around the fifth bullet
  3. Move the logo down into a bottom corner so it stops competing with the title
  4. Pull '18%' out of the sentence and make it the biggest thing
Show the answer

Pull '18%' out of the sentence and make it the biggest thing

Right. A critique orders changes by effect. The slide's whole job is one number, and right now that number is the fourth bullet inside a sentence. Everything else on the list is tidying.

The same slide, before and after

Before

You read: logo, photo, a nine-word title, six grey lines, and somewhere in there a number. About twenty seconds of work for the audience, and they stop listening to Negar while they do it.

After

You read: 18%. Then 'more sales than Q2'. One second, and the room is looking back at Negar, who now has five things left to say out loud instead of five things to read aloud.

Check yourself

Negar likes the office photo and doesn't want to lose it. What is the best compromise?

  1. Keep it behind everything and draw a red box around the text so it stands out
  2. Keep it behind everything and give the white text a drop shadow
  3. Give the photo half the slide and set the text on a plain background
  4. Enlarge the photo so its most interesting part sits behind the number
Show the answer

Give the photo half the slide and set the text on a plain background

Right. A photo isn't the problem; a photo underneath text is. Give each one its own area and both work. If she really must overlay, she needs a genuinely quiet part of the image or a solid panel behind the words, checked at 4.5:1.

Course recap

  • Rank first: one level 1, a few level 2, the rest level 3. Then make the differences big enough to look intended.
  • Line things up on one edge, group with space, keep real margins and take every gap from one short ladder.
  • One focal point per page, placed off-centre, with the action at the end of the reading path.
  • Neutrals plus one brand colour plus one accent, every piece of text at 4.5:1 or better, and never colour alone.
  • One family in two weights, 45–75 characters a line, and in Persian: more line height, real Persian digits, no letter-spacing.
  • When something feels wrong: describe, name the goal, say what works, then make the one change that matters most.

Keep it, don't just read it

Pathwise brings each idea back just before you'd forget it, with a quick question. Free on Android and on the web, in English and Persian.

Cafe Bazaar Myket Open the web app

All lessons in this course

  1. Visual hierarchy: what do I look at first?
  2. Contrast: make different things really different
  3. Alignment and proximity
  4. Whitespace and a spacing system
  5. Grids and balance
  6. Composition and the focal point
  7. How colour works
  8. Building a palette
  9. Typography that reads well
  10. How to critique a design
  11. Design a poster, step by step
  12. Ten mistakes and your checklist