1 Learn the concept
The fundamentals of design are the foundation of every visual medium, from fine art to modern web design. They include balance, contrast, hierarchy, repetition, alignment and proximity. Once you understand them, you can see why some designs work and others do not, and fix your own work. This lesson introduces each principle.
2 See it in action
- Contrast: differences in size, color or weight draw attention.
- Hierarchy: guide the eye from the most important to the least.
- Repetition: repeat styles to create unity.
- Proximity: group related items closely.
Worked example
Reviewing a design with the four principles
Contrast: the headline is the same weight as the body. Fix: make it larger and bolder.
Repetition: three button styles. Fix: use one.
Alignment: the logo is off by 10 pixels. Fix: align to the grid.
Proximity: the price is far from the product. Fix: move it next to the product.
Result to look for: a tidier layout with a clear focal point.
3 Study an example
Example scenario
A designer looks at a cluttered flyer and sees weak hierarchy and no alignment. By enlarging the headline, aligning the text and grouping related details, she makes it easy to read.
4 Apply it and download
- Pick a design you admire.
- Identify each principle in it.
- Note one you could apply to your own work.
Worksheet Brand style guide templateOpen, print or save as PDF