Embed Size (px)
DESCRIPTION
Organización visual, del contenido, elementos y mapas de navegación.
Citation preview
Multimedia Production
Características de Diseño y Composición • Organización Visual • Organización del Contenido • Mapas y Elementos de Navegación • Migas de Pan
Pro
du
cció
n M
ult
imed
ia
Características de Diseño y Composición – Org. Visual
Las percepciones se alimentan a través de los sentidos. El desarrollo multimedia requiere saber sobre las capacidades de percepción humanas. La psicología cognitiva se sirve de la corriente constructivista. “cuando vemos algo no recordamos toda la información, sino aquello que consideramos lo más importante”
Pro
du
cció
n M
ult
imed
ia
Características de Diseño y Composición – Org. Visual
Algunos principios involucrados en la forma de cómo organizamos lo que vemos son: • Proximidad • Similaridad • Simetría • Continuidad • Cierre
Pro
du
cció
n M
ult
imed
ia
Características de Diseño y Composición – Org. Visual
Proximidad Similaridad Simetría
Describe el proceso que seguimos para la
distancia o localización para crear grupos.
Cuando al observar, agrupamos por clase o
tipo.
Cuando el todo de la figura se percibe en
lugar de las partes que la integran.
Pro
du
cció
n M
ult
imed
ia
Características de Diseño y Composición – Org. Visual
Continuidad Cierre
Estos principios se pueden usar racionalmente en el diseño multimedia para lograr una adecuada organización visual.
Permite agrupar e identificar de acuerdo
al flujo en la dirección o alineamiento en que se
presentan los elementos.
Se perciben las formas completas que en
realidad no existen o están incompletas pero
que nuestro inconsciente termina
por llenar
Pro
du
cció
n M
ult
imed
ia
Características de Diseño y Composición – Org. del Contenido
No puede haber una organización visual efectiva sino hay una adecuada organización del contenido. Si la información no se estructura de manera adecuada, el usuario puede no encontrar la información, no comprenderla o perderse en el contenido.
Pro
du
cció
n M
ult
imed
ia
Características de Diseño y Composición – Org. del Contenido
La información del contenido requiere: • Definir un esquema de organización que clasifique la información en categorías.
(p. ej. Alfabética, cronológica, geográfica, temática, por funciones, …)
• Una estructura organizacional (p. ej. Jerárquica o de niveles, con relaciones libres – hipertexto – o recuperada a través de una consulta a una base de datos.)
Pro
du
cció
n M
ult
imed
ia
Características de Diseño y Composición – Org. del Contenido
Los principios de proximidad, similaridad, simetría, continudad y cierre, permiten reconocer el tipo de organización visual predominante en un proyecto multimedia. Estos principios que explican cómo percibimos y se dividen en cuatro factores que ayudan a desarrollar una adecuada organización visual del contenido y que deben cuidarse durante el diseño de una interfaz gráfica de usuario (GUI): la proximidad, la alineación, la consistencia y el contraste.
Pro
du
cció
n M
ult
imed
ia
Proximidad
Este otro caso muestra como un espacio demasiado amplio entre un botón y su contenido contextual hace que una persona que lo lea no distinga que el 40 hace alusión a la cantidad de veces que se ha presionado el botón
Los elementos muy próximos pueden percibirse como relacionados, mientras los que están separados pueden parecer independientes o no relacionados.
Alienación
Tipos de alineación Izquierda Derecha Centrada Justificada
Tipos de alineación Izquierda Derecha Centrada Justificada
La alineación permite situar los elementos relacionados para asignar igual importancia a los mismos o establecer una misma categoría. La alineación puede indicar dependencia o clasificación.
No dependientes Dependientes
Consistencia
La consistencia permite que los elementos relacionados se distingan por su similitud en tamaño, color o ubicación dentro del diseño de una interfaz. La consistencia de este menú horizontal da uniformidad al diseño de la interfaz. Se considera que una interfaz es más fácil de navegar si todas sus secciones tienen un enlace al inicio en la misma ubicación, utiliza de forma adecuada la alineación y sus elementos individuales están organizados en forma similar.
Contraste
Para distinguir elementos diferentes o con funciones independientes se utiliza el factor contraste. Este factor puede utilizarse al modificar las propiedades de las fuentes: tamaño, efectos, colores y estilos.
Características de Diseño y Composición – Mapas P
ro
du
cció
n M
ult
imed
ia
Entrada A B C Salida Lineal
Entrada A B C Salida Ramificado
A1 A2
B1 B2
C1 C2
Características de Diseño y Composición – Mapas P
ro
du
cció
n M
ult
imed
ia
Entrada B B1 B2 Salida Paralelo
A A1 A2
C C1 C2
Características de Diseño y Composición – Mapas P
ro
du
cció
n M
ult
imed
ia
Entrada
B
Salida
Concéntrico A
C
A1 A2
A3
B1
B2 B3
B4
C1
C2 C3 C4
C5
Características de Diseño y Composición – Mapas P
ro
du
cció
n M
ult
imed
ia
Jerárquico
Entrada
A B
A1 A2 B1 B2
A1.1 A1.2 B1.1 B1.2
Características de Diseño y Composición – Elementos P
ro
du
cció
n M
ult
imed
ia
Barra de navegación: botones gráficos o textos con enlaces que son agrupados. Debe informar al usuario cuáles son sus funciones. Menú: puede ser una lista de enlaces (emergentes o scroll). Debe ocupar el menor número de clics para llegar a la información. Marcos: paneles que ocupan una misma posición en la interfaz. Se usa para delimitar áreas de contenido.
Características de Diseño y Composición – Migas de pan P
ro
du
cció
n M
ult
imed
ia
Es importante que el usuario siempre esté informado de en dónde está y cómo llegó hasta allí. Para eso se usan las «migas de pan» La interfaz debe proporcionar elementos de navegación consistentes que creen un contexto comprensible para el usuario y que le informen su posición actual.
