Color y fondo.

Distribucin de contenido y configuraciones de pantalla

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Color y fondo Las cabeceras de los sitios web, el nombre y el logo, tpicamente tienen color de fondo en casi todos los sitios. Es informacin de contexto poco relevante para el usuario y por ello es el rea ms ignorada. En ningn caso se debe colocar un vnculo a contenidos importantes del sitio en la cabecera o cercano a ella. Los colores de fondo tambin se utilizan para intentar resaltar la publicidad, promociones y los contenidos del sitio que se quieren potenciar, es decir, contenidos que el usuario no busca, pero se quiere que vea. En realidad el efecto es el contrario, el contenido con fondo de color es anulado y cuanto mayor sea la intensidad del color utilizado, menor ser la visibilidad de ese contenido. Los usuarios ignoran los textos con fondo de color. Ignorar los fondos de color no es un comportamiento deliberado, es la reaccin defensiva del sistema cognitivo del usuario para evitar procesar informacin no relacionada con sus objetivos.

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Color y fondo Esto es debido a un fenmeno con el mismo mecanismo que la ceguera a los banners que provoca que cualquier contenido excesivamente resaltado (sea un banner o no), sea ignorado. Los usuarios aprenden que cualquier fondo con texto de color no es una informacin realmente til. Normalmente es publicidad, promociones o simple decoracin. Como respuesta los usuarios desarrollan un patrn perceptivo, que les hace ignorar las reas fuertemente coloreadas del sitio. Aprenden que los contenidos reales del sitio tienen siempre fondo blanco y por ello es ms til y rpido focalizarse nicamente en ellos.

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Color y fondo Los estudios de "eyetracking" (seguimiento de movimientos oculares) confirman que los usuarios no miran las reas con colores de fondo y se centran preferentemente los contenidos el fondo blanco. Como respuesta los usuarios desarrollan un patrn perceptivo, que les hace ignorar las reas fuertemente coloreadas del sitio. Aprenden que los contenidos reales del sitio tienen siempre fondo blanco y por ello es ms til y rpido focalizarse nicamente en ellos. Los usuarios aprenden que cualquier fondo con texto de color no es una informacin realmente til. Normalmente es publicidad, promociones o simple decoracin. Ejemplos: La publicidad en Google (Adsense y Adwords) tena fondo de color muy suave inicialmente. Ahora este fondo de color se ha eliminado y es blanco.

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Color y fondo Ceguera a los banners Cuando un estimulo aparece de forma repetida y frecuente nos insensibilizamos a l. Ello es causado un mecanismo neuronal muy primitivo. El reflejo de orientacin nos hace mirar en direccin a cualquier ruido, cosa que se mueva o sea de vivos colores. Es un mecanismo producido por la evolucin humana para defenderse. Hoy en da este mecanismo se muestra, por ejemplo, cuando se abre una puerta y se gira la cabeza en esa direccin. Sin embargo si constantemente entra gente por una puerta al poco tiempo se dejar de girar la cabeza. La desensibilizacin ocurre de forma ms acelerada si la informacin es irrelevante. La ceguera es posible debido a este formato llamativo de la publicidad (que proporciona unas claves visuales identificativas como la forma, caractersticas, imgenes, fondo llamativo, posicin en la pgina, etc.) y permite descartarlos como informacin a analizar. Esta ceguera visual sirve a los usuarios para discriminar entre contenido util (contenidos reales del sitio) y contenido de no util (generalmente publicidad).

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Color y fondo Utilizacin adecuada de colores de fondo - El color de fondo se puede utilizar para separar unas reas de otras y crear rupturas que ayuden a jerarquizar y separar los contenidos. - Utilizar pequeos elementos de color sobre un fondo mayoritariamente blanco es una manera de separar contenidos y que no se confundan. - Cuando se coloque un texto sobre un color de fondo, hay que tener en cuenta que ser ignorado y por tanto este texto no debe ser importante para la comprensin de la pgina web.

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Distribucin de contenido y configuracin de pantalla Conceptos bsicos de Diseo de Pantalla El diseo es mucho ms que el embellecimiento de la parte exterior de las cosas. El diseo, se puede decir, es solo una parte de un proceso para hacer que los objetos o cosas sean atractivas, usables, asequibles. El Diseo es un proceso de creacin visual con un propsito comunicativo. Un buen diseo es la mejor expresin visual de la escencia de "algo", bien sea un mensaje o un producto. Para hacerlo fiel y eficaz, el diseador debe buscar la mejor forma de que ese "ALGO" sea conformado, usado, distribuido y relacionado a su ambiente. Esta creacin deber esttica y funcionalmente reflejar el gusto de su poca.

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Distribucin de contenido y configuracin de pantalla Lenguaje Visual Es la base de creacin en diseo. Es el seguimiento de unas reglas o conceptos en cuanto a la conformacin visual. Sus leyes no son obvias. En el diseo de interfaces, el lenguaje visual es la utilizacin de un conjunto de imgenes y objetos grficos (iconos, ventanas, tipografa, imgenes, fotografas, ilustraciones, textos, videos, animaciones, menus, etc) para representar la informacin y acciones disponibles en la interfaz. Los objetos que se integran en la Interfaz Grfica de Usuario (GUI), se disponen en el plano llamado pantalla de manera ordenada siguiendo conceptos de diseo bsico como pueden ser: Elementos conceptuales Elementos Visuales Elementos Relacionales Elementos Prcticos

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Distribucin de contenido y configuracin de pantalla Conceptuales: Son los que realmente no estn en el plano, pero se pueden deducir: Punto: Por ejemplo, una flor roja en un jardn de donde predomine el amarillo. Linea: Una fotografa arquitectnica las refleja. Plano: Una rea de cualquier forma geomtrica coloreada. Volumen: Objetos que tengan profundidad volumtrica. Visuales: Forma: Todo lo que pueda ser visto, tiene forma Medida: Todo lo que se ve tiene una medida (pixeles en el caso de la pantalla) Color: Existe toda una teora aplicable. Primarios, secundarios, terciarios, neutros, tonos, luminosidad, etc. Tambin existe una teora de esquemas de color: Fros, clidos, anlogos, opuestos, adyacentes, Textura: Atrae el sentido del tacto o la vista. Una fotografa de varias ventanas puede ser una textura.

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Distribucin de contenido y configuracin de pantalla Relacionales: Nos ubican dentro del espacio y pueden ser sentidos aunque no literalmente como la gravedad y el espacio. Otros ms obvios, pueden ser percibidos claramente como la direccin y la posicin. Direccin: Varios rectngulos ordenados en fila denotaran una direccin a seguir Posicin: Arriba, abajo, derecha, izquierda, etc Espacio: Los espacios vacos son muy apreciados por los diseadores de interfaces Gravedad: Es una sensacin sicolgica. Transfiere sensaciones de pesadez, liviandad, estabilidad, etc. Prcticos: Subyacen en el contenido y los alcances de un determinado diseo. Representacin: Realista o abstracta, una representacin pretende mostrar la naturaleza de las cosas en un plano. Significado: El diseo transporta un mensaje. Funcin: Se hace presente cuando el diseo tiene un determinado propsito. Todos los elementos visuales estn enmarcados dentro de una Pantalla. La Pantalla no es solamente el dispositivo electrnico del computador o aparato electrnico, puede sonsiderarse tambin como pantalla a una tela donde se proyecte una imagen, un marco de un lienzo, una hoja de papel.

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Distribucin de contenido y configuracin de pantalla La navegacin del sitio multimedia proporciona la interfaz principal para que los usuarios del sitio puedan trasladarse entre sitios y pginas dentro del sitio. Por ellos cuando planifiquemos la navegacin deberemos tener en cuenta: - Planear la experiencia del usuario que desea crear ayudndole a navegar por los diferentes niveles de importancia, a la hora de distribuir el contenido sobre stos. Configurar elementos de navegacin global (barra de vnculos superior) y en el nivel del sitio (inicio rpido) en las pginas maestras. - Se pueden agregar elementos de navegacin que proporcionen tablas de contenido o acceso dinmico al contenido basado en una consulta. - Se pueden permitir tablas de contenido, el acceso dinmico al contenido basado en una consulta o vnculos creados en el contenido de la pgina. - Resulta muy til usar rutas de navegacin para mostrar un conjunto de vnculos que muestran la jerarqua del sitio desde la pgina actual hasta el sitio de nivel superior.

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Distribucin de contenido y configuracin de pantalla La resolucin de pantalla se refiere a las dimensiones de los pxeles mostrados en la pantalla. Ejemplo: el ordenador viene preconfigurado con una resolucin de 640 X 480 pxeles. Esto quiere decir que el monitor mostrar una pantalla de 640 pxeles de ancho y de 480 pxeles de alto, independientemente de que tenga un monitor de 15, 17 o 19 pulgadas. El tamao del monitor no determina la resolucin de pantalla. Pero a mayor monitor, mayor resolucin de pantalla utilizable. A medida que la resolucin aumenta, todo aparece ms pequeo. Esto se debe a que el monitor muestra un mayor nmero de pxeles en el mismo espacio de pantalla. En un monitor de 14 pulgadas y a 1024 X 768, los iconos resultan excesivamente pequeos, pero en un monitor de 17 pulgadas hay ms espacio de pantalla.

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]

>Elementos narrativos, expresivos y descriptivos del lenguaje audiovisual en proyectos multimedia >>Distribucin de contenido y configuracin de pantalla Pgina para testear nuestra web en diferentes resoluciones de pantalla http://viewlike.us/

[MDULO 2]

[Unidad 1. Recursos Narrativos y tcnicos para el desarrollo de productos multimedia]