Design Principles

Megan Kerr
GDSBC-megan
Published in
4 min readOct 19, 2018

The Principles of Design

Colour Theory

Conveying the website’s purpose through colour choice is a simple and obvious way to create a mood for the reader. Seeing certain colours subconsciously makes us think of specific things which can be a very useful tool when designing almost anything, it can manipulate a reader to gather certain feeling just at a glance.

http://www.peachpit.com

A colour wheel is a selection of colours from cool to warm tones, the diagram (like the one above) shows us combinations of colours such as contrast which lie oposite to each other on the wheel. For example orange and blue — these colours together make the other stand out even more which is useful for guiding a user around a page without something as obvious as arrows, the eye automatically jumps to these contrasts which is why they are most useful for ‘call to action’ buttons and important information you want the reader to look at first. The diagram also shows com complementary colours which lie side by side around the wheel, these colours work best for things such as background and text colour when you are trying to be more relaxed and don’t necessarily want something to jump straight out.

Hierarchy

One way to control how a user looks at a page is through the use of hierarchy. Hierarchy organises the elements of a page based on how important they may be, this can be used to prioritise information such as a heading so it is the first thing we look at on a page. There is many ways this can be achieved — typeface choice, line or text weight, colour contrasts and placement are all simple ways to help differentiate how important something may be.

https://learn.co/lessons/hs-design-principles-hierarchy

Balance

Symmetry and asymmetry are both types of balance that are used in graphic design. We can choose one based on what we want it to achieve. Symmetry is when both sides of the page are equal, this is used when a designer would like their work to look balanced which can be better for more formal pieces. It is easier for a user to concentrate on specific elements such as text when a page is laid out this way. Asymmetry can be a unique way to design a page, it creates a more interesting aesthetic overall and gives a more creative and informal look. Choosing how you would like to balance a page would depend on the focus so it is a very effective way to change the feeling a page gives.

http://cnolan.umwblogs.org

White Space

One of the most common used element in graphic design is white space, it helps to slow a readers pace down so a page is less overwhelming by giving them breaks from images or text so their eyes can rest in between. It can also be used as a form of call to action, the google homepage is one of the best examples of this in use. As you can see the lack of things (or the sheer amount of white space) direct your attention directly to the all the important parts of the page, the search bar and logo.

google.com

Contrast

Contrast is when two elements that are strikingly different are put side by side to add emphasis to them. The most obvious way to achieve this is through colour like I said above but you can also add contrast to a page through different typefaces and textures.

https://commons.wikimedia.org/wiki/File:ART_SIMULTANEOUS_CONTRAST.png

Alignment

We can align a page in three different ways — Left-aligned, Centre-aligned and Right-aligned. You may choose which way to align by deciding how you would like to balance your layout, this choice can be effected by how formal the page must be or the elements you must include.

--

--

Megan Kerr
GDSBC-megan

Graphic Design student at Edinburgh Napier University.