Orden y Jerarquía

visual.

Por
 Es el estado de distribución
Equilibrio de las partes por el cual el
Visual. todo ha llegado a una
situación de reposo.

El campo visual
presenta ejes de
referencia (dos
horizontales y dos
verticales) los
cuales plantean
leyes de equilibrio.
 El equilibrio puede ser:

Armónico Tensionado
(simétrico) (asimétrico)
 El peso visual es la capacidad
Peso Visual. que tiene un elemento de
una composición de atraer la
mirada de aquel que mira la
• Tamaño imagen.
• La posición
• La distribución
• La textura
• La forma
• El color
• El contraste
tamaño.
posición.
distribución.
textura.
forma.
contraste.
color.
PESADO LIGERO

saturación

Valor/Luminosidad

Tono
COLOR PESADO Y
MAYOR TAMAÑO

BALANCE CON MAYOR

VARIEDAD Y MAYOR
COMPLEJIDAD DE
DENSIDAD
 ● Se crea una sensación de
Regla de equilibrio.
● La imagen adquiere más interés y
Los tercios. complejidad que si se coloca
simplemente al sujeto u objeto
en el centro del encuadre.
● La imagen tiene más fuerza y
energía.
● La imagen gana sensación de
profundidad y deja de ser plana.
La regla de los tercios
Regla de los tercios
 La proporción áurea es la
Proporción fórmula que egipcios, griegos,

áurea. romanos y demás civilizaciones

avanzadas han venido utilizando
como inspiración para las artes
o la arquitectura, por ser la que
rige ciertos patrones de la
naturaleza.
Proporción áurea
Proporción áurea y la regla de los tercios.
Simetría dinámica
Buenas Prácticas de diseño
1.Superponer
Colocar los objetos ligeramente sobrepuestos entre ellos puede ayudar
al ojo a moverse de un elemento a otro.Los objetos no deben tocarse
por los bordes. Evitar el aislamiento, construir una relación entre
objetos.

Buen traslape Evitar “besos” Evitar aislar

2. CORTAR
Consideren tener elementos que salen del cuadro. Esto logra que el
observador entre y salga del cuadro. Evitar objetos flotando cerca de
los bordes de la página.

Sacar un elemento de la página Evitar elementos flotantes

3. girar
Consideren colocar los elementos en ángulo, usando las diagonales.
Los objetos inclinados crean composiciones más dinámicas. Los
elementos perfectamente alineados pueden resultar aburridos.

Evitar que todos los

Girar los elementos elementos vean para arriba
4. Punto focal
Crear un área de importancia. Darle al observador algo para enfocarse.
Una manera de lograrlo es a través de la varración de tamaños. Traten
de no tener todos los elementos del mismo tamaño. Otra forma de
lograr foco es a través de la dominancia de color.

Usar variación de tamaño Evitar que todos los elementos

y color sean del mismo tamaño
5. descentrar.
Eviten colocar los elementos directamente en el centro de la página.
Consideren colocar los elementos ligeramente cargados hacia alguno
de los lados. Esto va a crear composiciones más interesantes. Traten de
mantener los elementos balanceados al hacerlo.

Descentrar elementos para Todo centrado

generar interés puede aburrir
Orden y Jerarquía
Del mensaje.

Por
El patrón z.
Página no centrada
En el texto.
El patrón Fast
Jerarquía tipográfica
Encabezado

subtítulo

cuerpo
 La primera sección que el
encabezado
. observador debe visualizar
La información más
importante del mensaje debe
colocarse aquí y usarse para
llamar la atención del
observador.
 Se usa para dividir el layout en
subtítulo. diferentes secciones para darle al
lector más información acerca de
lo que se trata el cuerpo del texto
y expandir la información del
encabezado.
Debe ser visible y separarse
visualmente del cuerpo del texto,
al mismo tiempo que se diferencía
visualmente del encabezado
principal.
 Esta sección incluye el
cuerpo. contenido, lo que significa
que es muy pesada de texto.
Su función es comunicar la
información deseada, por lo
que su legibilidad es muy
importante. En tamaño, debe
ser menor que encabezado y
subtítulo.
tamaño.
Mayúsculas y minúsculas.
grosor.
Mayúsculas y minúsculas.
posición.
color.
espaciado.
tipografías.
Jerarquía del mensaje.

¿por qué?
Quiero que me entiendan, y rápido.
1. Claridad de ideas. ¿Qué se quiere transmitir?
2. Ordenar por prioridad los elementos más
importantes
3. Definir las palabras clave necesarias para el
mensaje
4. Organizar de forma visual todas las partes
5. Diseñar
 A. Atención: atraer la atención del
mkt-aida. consumidor
I. Conseguir el Interés
D. Deseo: convencer a los
consumidores de que quieren y
desean el producto o servicio y
que va a satisfacer sus
necesidades.
A. Acción: llevar a los
consumidores hacia tomar acción
o compra.
Referencias
https://zevendesign.com/designers-guide-to-visual-hierarchy/

https://www.zekagraphic.com/typographic-hierarchy-in-graphic-design/

https://www.webfx.com/blog/web-design/visual-weight-designs/

https://www.zekagraphic.com/typographic-hierarchy-in-graphic-design/

https://www.uifrommars.com/jerarquia-tipografica-que-es-ejemplos/

Elam, Kimberly. Geometry of Design. Princeton Architectural press.