Layout Principles


No comments posted yet


Slide 1

Layout Principles

Slide 2

What is layout? Layout (noun) is the process of planning and arranging in detail something such as a page or book to be reproduced.

Slide 3

Principles of design Balance Symmetrical Asymmetrical Alignment Proximity Positive and Negative space Repetition Contrast

Slide 4

Balance   Fine Arts. composition or placement of elements of design, as figures, forms, or colors, in such a manner as to produce an aesthetically pleasing or harmoniously integrated whole. Source: Two main types: Symmetrical and Asymmetrical

Slide 5

Symmetrical Symmetrical Balance Symmetrical (or formal) balance has elements of equal weight on either side of an imaginary horizontal or vertical line. It is often considered a safe solution, but boring layout to use.

Slide 6

Asymmetrical Asymmetrical (or informal) balance may be unequal in position and intensity. To create asymmetrical balance, there must be an increase in intensity to compensate for the change in position. Intensity can be increased by changing size, shape, or tone.

Slide 7

Alignment Alignment of elements in the design is important, whether it be text or images. Text/type: left-justified, right justified or centered Images: applied to edges of images or by their centers.

Slide 8

Proximity (Positive and Negative space) the property of being close together  a Gestalt principle of organization holding that (other things being equal) objects or events that are near to one another (in space or time) are perceived as belonging together as a unit 

Slide 9

Repetition The act of repeating; repeated action, performance, production, or presentation. For web design, often a layout element or the navigation is repeated for each page, so the user know they are within the same site.

Slide 10

Contrast Contrast creates interest by providing variety in the design. Size Weight Position Shape Color

Slide 11

Contrast Size

Slide 12

Contrast Weight

Slide 13

Contrast Position

Slide 14

Contrast Shape

Slide 15

Contrast Color

Slide 16

Layout Procedure Thumbnails Roughs Comprehensive layout

Slide 17

Layout Procedure Thumbnails Several thumbnail sketches needed to help the designer develop their ideas about the layout piece. The sketches are quick, and should define the overall placement of items for the layout, such as text and images.

Slide 18

Layout Procedure Roughs At this stage, the thumbnails are refined to detail the layout elements. Items such as text style and more defined images.

Slide 19

Layout Procedure Comprehensive layout The comprehensive layout is the last step in the production of any layout piece.

Summary: Design Layout Principles

Tags: design layout principles