Learn Design Theory

Learn the fundamental principles of design, including color theory, visual hierarchy, and more. Then use them to create effective and beautiful web designs.

All Design Theory content:

Filters

Design Theory

Adding Space to Your Designs

Tutorial • Beginner

Let’s get the basic stuff out of the way first. Whitespace isn’t simply a block of space in your design that has to be white. Instead, think of it more like...

Rachel Shillcock • 10 Sep 2013
Design Theory

An Introduction to Composition

Tutorial • Beginner

Composition is about laying out all your ideas and design elements into a whole; composing your design. We're going to combine all of the previous lessons...

Rachel Shillcock • 9 Sep 2013
Design Theory

Using Alignment to Improve Your Designs

Tutorial • Beginner

Alignment is one of those things that comes hand-in-hand when working with grid systems. The subject of alignment isn’t simply a matter of choosing whether...

Rachel Shillcock • 3 Sep 2013
Design Theory

How Human Centric Web Design Improves Your Workflow

Tutorial • Beginner

Human-centric and user-centric design are two terms we often hear in the industry, though sometimes both designers and developers consider them to mean the...

Sven Lenaerts • 29 Aug 2013
Design Theory

Choosing a Grid System

Tutorial • Beginner

In the previous article, I introduced you to grid systems. With any luck, by now, you should have a good understanding of what they are and why they’re a...

Rachel Shillcock • 23 Aug 2013
Design Theory

All About Grid Systems

Tutorial • Beginner

Now you know all about colour, typography and various things you should undertake before you start a design project, it’s time to start getting down and...

Rachel Shillcock • 22 Aug 2013
Design Theory

Improving Layout With Vertical Rhythm

Tutorial • Beginner

Learning all about the ins and outs of the technical side of typography is good. It will give you a solid grounding when looking for typefaces or fonts and...

Rachel Shillcock • 13 Aug 2013
Design Theory

Typography Basics for Developers

Tutorial • Beginner

Typography is a fundamental element in any design that you work on. The main reason we have websites in the first place is to display information, and for...

Rachel Shillcock • 13 Aug 2013
Design Theory

Working With Brand and Design Guidelines

Tutorial • Beginner

Sometimes, particularly when you work with established brands and companies, you may encounter a set of brand or design guidelines. As a developer who might...

Rachel Shillcock • 9 Aug 2013
Design Theory

Selecting Your Own Color Scheme

Tutorial • Beginner

By now you should have a good idea of what color is, what each of the colors mean and have a good understanding of the different types of color scheme...

Rachel Shillcock • 5 Aug 2013
Design Theory

Defining and Recognizing Colors

Tutorial • Beginner

When you are designing for any medium - not just the web - the way you use color in your designs will impact how that design is perceived, understood and...

Rachel Shillcock • 24 Jul 2013
Design Theory

Introducing Wireframes to Your Design Process

Tutorial • Beginner

After sketching, there is one final thing you should work on before starting to design (although, admittedly, this is all part of designing). Wireframing is...

Rachel Shillcock • 22 Jul 2013