Terminologis
- 1. TERMINOLOGIA WEB Antes de empezar a mencionar términos y significados es importante destacar que el diseño web es una disciplina que permite desarrollar nuevas y diferentes experiencias informativas y de navegabilidad, además, es un proceso en el que influyen varios profesionales, como diseñadores visuales, diseñadores de UX, diseñadores de interfaces y desarrolladores Front End. Como podrás darte cuenta el diseño web es un proceso extenso y multidisciplinario, sin embargo, en este post nos centraremos únicamente en la etapa visual del diseño web; conoce los términos más usados en esta área, actualízate e incorpóralos a tu vocabulario profesional, de paso no quedarás en ¿? cuando estés en medio de diseñadores. Gestalt : Es una palabra alemana que traduce forma, en diseño podría entenderse como un elemento que sin estar finalizado tiende a ser percibido en su totalidad. Ejemplo: Los guantes, zapatos y pantalón de Mickey Mouse, aun sin estar presente el personaje estos elementos son asociados instantáneamente con el famoso ratón. Espacio negativo: Espacios vacíos dentro de piezas de diseño, algunos diseñadores utilizan este espacio para incorporar mensajes o elementos ocultos. Ejemplo: el logo de Carrefour con una C en el centro; el icono del Tour de Francia en su R simula un ciclista; Amazon en su logo marca una línea que parece una sonrisa, además indica que se encuentra cualquier producto de la A a la Z. RGB (Red, green, blue): Modelo cromático digital que representa a partir de la mezcla del rojo, verde y azul otros colores. GIF (Graphics Format Interchange, formato de intercambio de gráficos): Formato gráfico usado principalmente para diseños en la web. SVG (Scalable Vector Graphics): Es un formato gráfico que se basa en el manejo de vectores. Anti-aliasing: Técnica usada para suavizar elementos creados en formato rasterizado. Translúcido: Efecto que permite ver parte de la imagen de fondo (sin ser visualmente claro las formas y colores) sobre la capa superior del diseño. Motif: Patrones decorativos que integran un diseño (espirales, flores, líneas, figuras geométricas, etc.). Skeuomorphic: Tendencia que hace que los elementos de un diseño se vean tan reales como en el plano físico. Interfaz de usuario (User Interface): Superficie de contacto físico y cognitivo por el cual el usuario se comunica con la máquina. Usabilidad (Usability): Es la facilidad con que las personas pueden utilizar una interfaz web, la cual tiene como finalidad alcanzar un objetivo concreto.
- 2. Diseño de interacción : Diseño encargado de definir cómo se utilizan los sitios web y aplicaciones, tiene como finalidad mejorar la experiencia de los usuarios así como facilitar el cumplimiento de los objetivos trazados. Favicon: Imagen que acompaña la url de un sitio web en la barra de direcciones, su tamaño es de 16 por 16 píxeles y se usa para generar recordación de marca, además, si se tienen varias pestañas abiertas permite identificar cada una fácilmente. Wireframes: Estructuras que jerarquizan el contenido que hará parte de un sitio web, en ellas se muestran la ubicación de cada uno de los componentes y el funcionamiento de los elementos en general. Style Tiles : Proceso visual de diseño web creado por Samantha Warren, el cual se divide en cuatro etapas: escuchar lo que el cliente quiere, interpretar lo que el cliente dice, definir un lenguaje visual e interactuar con diferentes estilos de diseño para hacer cambios. Sprites: Conjunto de imágenes agrupadas en una sola imagen. Header: Cabezote de las páginas web donde se ubica el menú, el logo, el buscador y algunos datos sobre información de la empresa. Footer: Parte final del sitio web donde se encuentran generalmente elementos como botones de redes sociales, links de navegación, información de contacto, entre otros. Responsive Design: Técnica de diseño web que se implementa en sitios web y aplicaciones con el propósito de que se adapten a la pantalla de cualquier dispositivo desde donde el usuario navegue. Parallax: Técnica de Scrolling que altera las velocidades de algunos de los elementos del primer plano para crear un efecto de profundidad en el sitio web.