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 tutorials:

  1. An Introduction to Composition

    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...

  2. Using Alignment to Improve Your Designs

    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...

  3. How Human Centric Web Design Improves Your Workflow

    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...

  4. Choosing a Grid System

    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...

  5. All About Grid Systems

    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...

  6. Improving Layout With Vertical Rhythm

    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...

  7. Typography Basics for Developers

    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...

  8. Working With Brand and Design Guidelines

    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...

  9. Selecting Your Own Color Scheme

    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...

  10. Defining and Recognizing Colors

    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...

  11. Introducing Wireframes to Your Design Process

    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...

  12. Sketching and Your Design Workflow

    Sketching and Your Design Workflow

    Tutorial Beginner

    Once you've finished working with your content - great news! You get to start thinking about the actual design. But not so fast - don't jump onto a computer...