Categorías: Todo - proporción - legibilidad - equilibrio - armonía

por Ismael Espinar hace 7 años

1115

DIW Tema 1

El diseño de interfaces gráficas debe considerar varios elementos clave para asegurar una experiencia de usuario óptima. La legibilidad es esencial, y puede mejorarse utilizando recuadros y secciones claras que el usuario pueda identificar fácilmente.

DIW Tema 1

Planificación de Interfaces Gráficas

Teoría del color

Tono, Saturación y Luminosidad

Elementos del diseño

Elementos Prácticos
Elementos de Relación
Elementos Visuales
Elementos Conceptuales

El lenguaje Visual

El diseño es un proceso de creación visual con un propósito, la realización de las visiones personales y los sueños de un artista, el diseño cubre exigencias prácticas.

Un buen diseño es la mejor expresión visual de la esencia de "algo", y su creación no debe ser sólo estética sino también funcional, mientras refleja o guía el gusto de su época.

Hay numerosas formas de interpretar el lenguaje puesto que carece de leyes obvias. Cada uno tiene sus propias interpretaciones.

Introducción al diseño gráfico

Historia
Ordenadores y el Diseñador Web
Nacimiento de la Publicidad y los primero diseñadores gráficos
Gutenberg y la imprenta
Edad Media Ornamentaciones y decoraciones
Jeroglíficos
Funciones
Estetico
Publicitario
Comunicativo
Áreas
Grafico
Moda
Arquitectonico
Industrial
La profesión: construye mensajes con medios visuales

La composición, el equilibrio y el dinamismo

Proporción Relación equilibrada de un área con otra.
Efecto de tensión
Ritmo Visual
Equilibrio estático(eje central) y dinámico ( varios ejes)
Peso distribuido = Sensación de estabilidad
Los elementos a la derecha poseen mayor peso visual
El centro físico y el centro visual no coinciden (Tendemos a percibir una atracción hacia abajo)
Contraste y armonía
Tipos de equilibrio
Composición del texto

Tenemos que tener en cuenta la legibilidad (podemos usar recuadros), la claridad (el lector tiene que identificar las secciones), la familiaridad (porque al ser usado habitualmente, es una guía) y la simplicidad.

Composición equilibrada

El orden de los elementos es uno de los factores mas importantes. Se basan en el eje horizontal, aporta equilibrio, y el eje vertical, que marca las propiedades.

La tipografía

La tipografía consiste simplemente en elegir un tipo de letra para un diseño o un trabajo para que se pueda leer sin dificultad. Literalmente significa “diseño de las letras”.

Nuestro alfabeto tiene un antecedente fenicio
Imperio Romano - Mayúsculas
Unificación de las escrituras - Carolingia
Familias Tipograficas

Conjunto de signos usados para usar un lenguaje. Su

equivalente en tipografía e imprenta es el tipo. El tipo define a los signos que se emplean para la ejecución de los moldes tipográficos y carácter es el resultado de la impresión de los tipos.

Primera clasificación tipográfica:

1º La presencia o ausencia de serif.

2º Forma del serif.

3º Uniformidad o variabilidad del grosor del trazo.

Legibilidad:

Define la cualidad deseable de una familia tipográfica. Algo legible es la facilidad o complejidad de la lectura de una letra.

Clasificación de las familias tipográficas:

Clasificación de los tipos:






Partes que componen las letras

El diseño de la pagina web

Planteamiento de la realización de un sitio web
Área artística

Compete la definición estética del proyecto interactivo. Hay que tener en cuenta el estilo, en la que, en función tanto de la naturaleza de la aplicación como del perfil de los usuarios a los que va destinado, ha de plantearse la identidad visual del proyecto.


Área técnica

Los responsables estudian y resuelven los aspectos del proyecto, asociados a su implementación material en un medio digital, los de las primeras maquetas o prototipo, pasando por las versiones de prueba hasta su elaboración final.

Hay que tener en cuenta:


Área de producción

Consiste en adecuar el proyecto interactivo al mercado, estudiar su viabilidad y establecer, tanto en modo de desarrollarlo como las estrategias para su difusión.

El presupuesto es otro de los puntos del área de producción.

Encontramos también el plan de trabajo, en el que, una vez definido el concepto y el perfil del proyecto, ha de elaborarse una relación de las tareas objetivos a desarrollar para llevarlo a su fin.

Área de redacción

Se definen los conceptos básicos del proyecto. Se establece su identidad, hay que establecer el propósito o finalidad del proyecto, su utilidad o sentido.

  1. Género del proyecto:


2. Los contenidos:Tenemos que tener en cuenta qué queremos contar y formularlo de modo conciso.


3. Las fuentes:Hay que producirlo originalmente, o, bien, ya

existe y hay que buscarlo, encontrarlo, seleccionarlo y adaptarlo al soporte digital.


4. El guión:la elaboración del guión del proyecto, que es

un conjunto de textos que constituye el contenido editorial de la aplicación.


Pueden establecerse seis grandes parámetros para el diseño de navegación: enlace, búsqueda, secuencializacion, jerarquía, similitud y mapas.




Diseño de la comunicación Digital

En diseño de Comunicación Digital se explora las posibilidades expresivas, estéticas y comunicativas del lenguaje audiovisual en soportes digitales, buscando nuevos modos narrativos para organizar información audiovisual.

Componentes de una interfaz web

Espacios en blanco

Todas esas zonas de la interfaz en las que no hay ningún otro elemento gráfico. Entre sus objetivos está el compensar el peso visual del resto de elementos, crean márgenes o separaciones entre ellos, encuadrándolos de forma adecuada, y marcan los límites que estructuran la composición, haciendo la interfaz más equilibrada, limpia y bella.

Pie de pagina

El pie de página es la parte de una interfaz web situada en la parte inferior de la misma, bajo el cuerpo de la página. En principio no parece tener una misión muy importante, sin embargo tiene mucha utilidad por la información que muestra y por ayudar a una percepción más estructurada del sitio. Un uso muy común del pie de página es para mostrar enlaces a servicios muy particulares del sitio web, como

contratación de publicidad, formulario de contacto, ofertas de empleo, condiciones de uso, políticas de seguridad, etc.

El cuerpo de la pagina

El cuerpo es la parte de la página web donde se presenta al usuario toda la información referente a los contenidos de la página. Lo que aparece en el cuerpo suele ser el objetivo del sitio, lo que el usuario quiere ver. Su ubicación es siempre central, bajo la cabecera si hay, y al lado del menú lateral de navegación si hay.

Los sistemas de navegación

Son los elementos de una interfaz que permiten la navegación por las diferentes

secciones y páginas que componen el sitio web. Los menús pueden tener textos,

gráficos o ambos, todo ello combinando también con efectos dinámicos para acentuar

el carácter interactivo de las mismas.

Cabecera

Zona de la interfaz web situada en la parte superior de la

misma de ancha generalmente igual a la de la página y altura variable, en la que se ubica generalmente el logotipo del sitio web o de la empresa propietaria, acompañado

generalmente de un texto identificador de la misma y de otros elementos de diseño, como fotografías, formularios de login, banners publicitarios, etc.

Maquetación web.Elementos de ordenación.

Por maquetación web se entiende la distribución, en el espacio considerado disponible, de los elementos que conforman una página web. En otras palabras, maquetar es colocar las diferentes partes de una página dentro de sus límites.

Gestores de contenido

Un gestor de contenidos se define como una interfaz que controla una o varias bases de datos donde se aloja el contenido del sitio. El sistema permite manejar de manera independiente el contenido y el diseño. De esa manera, es posible manejar el contenido y darle en cualquier momento un diseño distinto al sitio sin tener que darle formato al contenido de nuevo, además de permitir la fácil y controlada publicación en el sitio a varios editores.


El éxito de los gestores de contenido radica principalmente en que alejan los aspectos técnicos de desarrollo del diseño de la interfaz y, ambos, de la generación de la información y documentación que se quiere comunicar en el sitio.

Guías de estilo

La guía de estilo es un documento (o varios) que define las pautas y normas de calidad que debe seguir una interfaz web para un determinado sitio web. Gracias a la guía de estilo se garantiza la coherencia del sitio, integrando toda la interfaz con un aspecto y uso homogéneos. La guía de estilo abarca aspectos de calidad de uso, accesibilidad, diseño gráfico, marketing, etc., tocando temas

como los colores y otros elementos de diseño, como estándares (de usabilidad, accesibilidad, etc.).

Maqueta o prototipo

Un prototipo web es un borrador o modelo inicial a

partir del cual se empieza a concebir y desarrollar la idea original del diseño de un sitio web. Hacer un prototipo es más sencillo y económico que hacer una web real y luego modificarlo hasta alcanzar lo que se busca.

Mapas del sitio web o mapas de navegación

Antes de diseñar un sitio web se debe realizar un esquema que

permita anticipar cuáles son las secciones en las que estará dividida el sitio web y la relación entre los diferentes bloques de contenidos. Ese esquema recibe el nombre de mapa del sitio web o mapa de navegación y es algo parecido al índice de contenidos de un libro, es decir, una manera de que el diseñador del sitio estructure bien los

contenidos antes de crear el sitio y de que los usuarios encuentren más rápidamente lo que buscan una vez creado el sitio.