The vocabulary of the layout

Proximity

It’s the arrangement of objects close to each other in a way that creates reciprocal relations. If we place a caption close to an image, for example, it’s clear that the one refers to the other.

Proximity

Unity

It’s the intent to bring togheter the different elements in a page in order to create a coherent and complete whol, superior to the sum of the single objects. Than more the single elemtns are coherent, than more the result is unitary. The proximity and the repetition contribute to create unity establishing relations among the different objects.

Unity

Alignment

The alignment corresponds to the necessity to have a comprehensive structure in a project. With the alignment we have a structure that makes easier the access to the informations contained in a project and their interpretation. For example, the reading of a sentence will be much more difficult if the letters were arranged in a disorderly manner. Aligning the elements the designer can guide the user in the reading of the project.

Alignment

Contrast

The contrast can be obtained by placing the different elements of the projects in a way to make a clear reciprocal contrast. In that way we give a form and dynamism to a project and sometimes even dramatic tension.

Contrast

Hierarchy

It’s the order of importance visible of the different graphic elements and it can be obtained thanks to the dimension, spacing or the color.

Hierarchy

Balance and tension

Balance among different in a project allows to obtain different levels of harmony or discordance. In general who the designer tries to create balance in a way that images and text integrate in a subtle way, but sometimes it’s preferable to make more vivid decisions.

Balance and tension

Juxtaposition

Consists in placing one next to the other the elements that communicates different ideas or points of view, to create strong reciprocal connections that, in another case, will be hard to express.

Juxtaposition

Coherence and repetition

The repetition reinforces the message communicate and his importance. The coherent use of visual elements, as it happens for the signage, it’s another way to reinforces the message, because it doesn't have to be reinterpreted again. Once the reader has become familiar with the image or the message, he will tend to make an immediate connection if he will see it again.

Coherence and repetition

White space

The use of white space gives air and breath to the project. Creating a space around an object brings the attention to this one, highlighting his importance.

White space

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Silvia Natale

Silvia Natale

Hello :) I’m a young product and interaction designer. I love to improve the experience of the connection between people and technology