I’m starting a new series called the Principles Of Design, which sounds pretty lofty and as if it should take several years of study. However, for each of the principles we’re going to look at, I’m willing to bet that even if you’re new to design you already know a little bit about them, but maybe haven’t used the terminology or really thought about them too much before. The principles are basic and they appear in any piece of well-designed work, whether it’s for the web, for a brochure, for a business card or for an advertisement. No one principle works alone, they generally work together.
In the past we’ve looked at elements of design, namely Type, Line, Shape, Texture. Consider these as the building blocks for your design. The principles that we’ll look at over the next few weeks are what makes the structure strong and holds it together. The five principles that can help to build a strong design and make it stand out are:
To create a clean, balanced look, every element should have a visual connection with another element on the page. Don’t just fill your page with stuff willy nilly (official design term). Nothing should be placed on the page arbitrarily.
When elements that are related to each other are placed close together, they become one visual unit, reducing clutter and giving a clear structure. Organizing information into appropriate groups is one of the quickest and easiest ways to improve your designs.
If everything on the page looks the same, you’re going to have a pretty boring design. By bringing contrast into the design, your page will instantly become more attractive. Contrast can be applied to shapes, colors, type and lines. For good contrast, make the elements very different.
Value can be described simply as the relative lightness or darkness of an object. Like contrast, value can add depth and dimension to your designs.
Color and value are closely related. Color has incredible power to create a mood and change the intent of a design. Color choices should be made carefully to ensure the success of any design.
Next week we’ll start by taking a look at balance, how it can improve your designs and some examples of designs that make great use of it.
SitePoint WordPress Restaurant Theme
SitePoint WordPress Ecommerce Theme
SitePoint WordPress Portfolio Theme
Animating with CSS
Getting Started with CSS
Bootstrap: A SitePoint Anthology #1
Jump Start Sass
The Guide To Mockups
- 1 Using White Space: How Emptiness Can Give So Much to Design
- 2 Cleaning up Code: Is Refactoring for Aesthetics worth It?
- 3 Achieving Modular Architecture with Forwarding Decorators
- 4 Unconventional UX Wisdom for Stressed Out Entrepreneurs
- 5 Type Nugget: Good Typography is About Finding the Right Playground