Based on The Non-Designer's Design Book

4 rules that make anything look good

You don't need to be an artist. Master these four principles and you'll design better than most people.

CRAP

Contrast · Repetition · Alignment · Proximity

How to use this site

👀

Read the principle

Each page explains one principle with a clear definition and the rule to remember.

↕️

Study the examples

Scroll through 5–6 real-life before & after examples, each showing the principle in action.

🎯

Try the challenge

Each page ends with a real-world challenge to practise spotting or applying the principle.

C

Contrast

If two things are not the same, make them very different.

School Trip Notice
Date: 20 June
Sign up by Friday
School Trip
20 JUNE
Sign up →
Make the most important thing look the most important. Size, weight, colour, and space are all tools for contrast.
R

Repetition

Repeat visual elements to create unity and consistency.

Repeated colours, fonts, and shapes signal to the viewer that these elements belong to the same system.
A

Alignment

Nothing should be placed on the page arbitrarily.

Title
Subtitle here
Some text
Title
Subtitle
Some text
Every element should have a visual connection to something else. An invisible grid gives the eye a path to follow.
P

Proximity

Group related items together. Move unrelated items apart.

Name: Sarah
Subject: Maths
Phone: 9123
Date: Monday
Room: 301
Student
Sarah · 9123
Class
Maths · Mon · Rm 301
Physical closeness = logical relationship. White space between groups is just as important as the content itself.