INTRODUCTION TO PRINCIPLE OF DESIGN, ORDER AND ORDERING ELEMENTS

Design Principles are a set of considerations that form the basis of any good product. It’s

is possible to come up with a brilliant design without understanding principles of design.

However, it’s typically done by “designer’s intuition” and may take a lot of trial and error in

order to create something that actually looks good and creates an optimal user experience.

Design Principles help teams with decision making. A few simple principles or

constructive questions will guide your team towards making appropriate decisions. To further

your knowledge about design principles, this research will be providing you knowledge about

the Different principles of design and the principle of ordering elements.

18 DESIGN PRINCIPLES

1. Contrast

One of the most common complaints designers have about client feedback often

revolves around clients who say a design needs to “pop” more. While that sounds like a

completely arbitrary term, what the client generally means is that the design needs more

contrast.

Contrast refers to how different elements are in a design, particularly adjacent

elements. These differences make various elements stand out. Contrast is also a very important

aspect of creating accessible designs. Insufficient contrast can make text content in particular
very difficult to read, especially for people with visual impairments.

2. Balance

Every element of a design—typography, colors, images, shapes, patterns, etc.—carries a

visual weight. Some elements are heavy and draw the eye, while other elements are lighter. The

way these elements are laid out on a page should create a feeling of balance.

There are two basic types of balance: symmetrical and asymmetrical. Symmetrical

designs layout elements of equal weight on either side of an imaginary center line.

Asymmetrical balance uses elements of differing weights, often laid out in relation to a line that

is not centered within the overall design.

3. Emphasis

Emphasis deals with the parts of a design that are meant to stand out. In most cases,

this means the most important information the design is meant to convey.

Emphasis can also be used to reduce the impact of certain information. This is most

apparent in instances where “fine print” is used for ancillary information in a design. Tiny

typography tucked away at the bottom of a page carries much less weight than almost anything

else in a design, and is therefore deemphasized.

4. Proportion

Proportion is one of the easier design principles to understand. Simply put, it’s the size

of elements in relation to one another. Proportion signals what’s important in a design and what

isn’t. Larger elements are more important, smaller elements less.

Hierarchy is another principle of design that directly relates to how well content can be

processed by people using a website. It refers to the importance of elements within a design.

The most important elements (or content) should appear to be the most Important.

Hierarchy is most easily illustrated through the use of titles and headings in a design.

The title of a page should be given the most importance, and therefore should be immediately

recognizable as the most important element on a page. Headings and subheadings should be

formatted in a way that shows their importance in relation to each other as well as in relation to

the title and body copy.

6. Repetition

Repetition is a great way to reinforce an idea. It’s also a great way to unify a design that

brings together a lot of different elements. Repetition can be done in a number of ways: via

repeating the same colors, typefaces, shapes, or other elements of a design.

7. Rhythm

The spaces between repeating elements can cause a sense of rhythm to form, similar to

the way the space between notes in a musical composition create a rhythm. There are five basic

types of visual rhythm that designers can create: random, regular, alternating, flowing, and

progressive.

Random rhythms have no discernable pattern. Regular rhythms follow the same spacing

between each element with no variation. Alternating rhythms follow a set pattern that repeats,

but there is variation between the actual elements (such as a 1-2-3-1-2-3 pattern). Flowing
rhythms follow bends and curves, similar to the way sand dunes undulate or waves flow.

Progressive rhythms change as they go along, with each change adding to the previous

iterations.

Rhythms can be used to create a number of feelings. They can create excitement

(particularly flowing and progressive rhythms) or create reassurance and consistency. It all

depends on the way they are implemented.

8. Pattern

Patterns are nothing more than a repetition of multiple design elements working

together. Wallpaper patterns are the most ubiquitous example of patterns that virtually

everyone is familiar with.

In design, however, patterns can also refer to set standards for how certain elements

are designed. For example, top navigation is a design pattern that the majority of internet users

have interacted with.

9. White Space

White space—also referred to as “negative space”— is the areas of a design that do not

include any design elements. The space is, effectively, empty.

Many beginning designers feel the need to pack every pixel with some type of “design”

and overlook the value of white space. But white space serves many important purposes in a

design, foremost being giving elements of the design room to breathe. Negative space can also

help highlight specific content or specific parts of a design.

It can also make elements of a design easier to discern. This is why typography is more
legible when upper and lowercase letters are used since negative space is more varied around

lowercase letters, which allows people to interpret them more quickly.

In some cases, negative space is used to create secondary images that may not be

immediately apparent to the viewer. This can be a valuable part of branding that can delight

customers. Take the hidden arrow in the FedEx logo, for just one example.

10. Movement

Movement refers to the way the eye travels over a design. The most important element

should lead to the next most important and so on. This is done through positioning (the eye

naturally falls on certain areas of a design first), emphasis, and other design elements already

mentioned.

11. Variety

Variety in design is used to create visual interest. Without variety, a design can very

quickly become monotonous, causing the user to lose interest. Variety can be created in a

variety of ways, through color, typography, images, shapes, and virtually any other design

element.

However, variety for the sake of variety is pointless. Variety should reinforce the other

elements of a design and be used alongside them to create a more interesting and aesthetically

pleasing outcome that improves the user’s experience.

12. Unity

Everyone has seen a website or other design out there that seemed to just throw

elements on a page with no regard for how they worked together. Newspaper ads that
use ten different fonts come to mind almost immediately.

Unity refers to how well the elements of a design work together. Visual elements should

have clear relationships with each other in a design. Unity also helps ensure concepts are being

communicated in a clear, cohesive fashion. Designs with good unity also appear to be more

organized and of higher quality and authority than designs with poor unity.

13. Typography

Typography refers to the way text is arranged in a design. That includes the fonts used,

their spacing, size, and weight, and the way different text elements relate to each other. Good

typographic design is heavily influenced by all of the other design principles mentioned earlier in

this research.

14. Gestalt

Gestalt Principles include similarity, continuation, closure, proximity, figure/ground, and

symmetry & order (also called prägnanz). Some of those principles are closely related to the

principles mentioned above.

15. Framing

Framing refers to how the primary subject of a design is placed in relation to other

elements on the page. It’s most often heard referred to in cinematography or photography, with

how the main focus of an image is placed within the overall image. But the principle carries over

into design.

16. Grid
 Grid and alignment are closely related to balance and refer to the way elements are

arranged in relation to an invisible grid on the page.

17. Shape

Shape is also a major part of any design, both in terms of specific shapes used as

elements within the design, and the overall shape of the design itself. Different shapes can

evoke different feelings, i.e circles are organic and fluid, while squares are more rigid and

formal, and triangles give a sense of energy or movement.

18. Color

The use of color in design is one of the most psychologically important parts of a design

and has a huge influence on user experience. Color psychology and theory heavily influences

some of the other principles mentioned earlier.

In architecture ‘order’ refers to a system of rules that structure the shape, structure,

layout and proportions of a design. Order is indispensable functioning of any organized system.

Here are the 8 ordering elements;

8 PRINCIPLES OF ORDERING ELEMENTS

1. Axis

An axis is a line connecting two points in space, about which forms can be arranged in

an asymmetrical or symmetrical, balanced manner. It is an imaginary line that can denote

structure, procession, direction, views, line of rotation and so on. An axis is used to align
elements in the design, and to arrange and plan spaces.

2. Symmetry

A symmetrical object is the one that is equally proportioned, harmonious and balanced

around a specific line. In geometry a symmetrical figure is the one that when bisected by an axis

is divided into two areas which are mirror images of one another. Symmetrical composition i.e.

axial composition this is a composition balanced around an axis.

3. Hierarchy

Hierarchy in architecture is the articulation of spaces and forms in order of importance.

The articulation is achieved by differentiating size, shape, color, placement of forms and spaces

relatively to each other. Hierarchy is used to emphasize a particular item, to influence the order

in which a range of items are experienced.

4. Transformation

Transformation is the principle by which an architectural concept, structure or

organization can be altered through a series of discrete manipulations and permutations in

response to a specific context or set conditions without loss of identity of the concept.

Transformation of form is achieved by changing size, shape, rotating, stretching, morphing and

so on.

5. Datum

A datum is a line, plane or volume which, by its continuity and regularity, serves to

gather, measure and organize a pattern of forms and spaces. Datum binds together the design

elements. It can a line, level, road, flat plane and so on.

Rhythm is a unifying movement characterized by a patterned repetition or alteration of

formal elements or motifs in the same or modified manner. Rhythm differs from repetition in

that in the former the shapes change but it is still recognizable, whereas in the later the shape

remains constant.

7. Pattern

Pattern refers to groups of elements or motifs that repeat in a predictable manner. It is

a structure that organizes parts of a composition.

8. Repetition

Repetition refers to the repeated use of shape, color or other elements of a design. It

creates a visual echo and reinforces certain aspects of the work. Repetition can create structure,

movement, harmony and unity.

SUMMARY

The elements, or principles, of visual design include Contrast, Balance, Emphasis,

Movement, White Space, Proportion, Hierarchy, Repetition, Rhythm, Pattern, Unity, Variety,

typography, gestalt, framing, grid, shape and color. These principles of design work together to

create something that is aesthetically pleasing and optimizes the user experience.

Ordering elements refers to a system of rules that structure the shape, structure, layout

and proportions of a design. Order is indispensable functioning of any organized system. The
types of Ordering elements includes; Axis, Symmetry, hierarchy, transformation, datum, rhythm,

pattern and repetition.

SOURCES: Online website

•The World’s Top Talent, On Demand. (TOPTAL Article)

•Designing Buildings Ltd. Wiki

•Design Principles web

AND ORDERING ELEMENTS

YRREVERRE, ERIC P.
SUBMITTED BY:

AR. EDWARDO ARELLANO OCHOCO