“Principios y directrices de diseño” -...
Transcript of “Principios y directrices de diseño” -...
“Principios y directrices de diseño”
Rogelio Ferreira Escutia
“El diseño es el alma detodo lo creado por el hombre"
(Steve Jobs)
Conceptos de Diseño
4
¿Qué es el Diseño?
”Diseño”, http://es.wikipedia.org/wiki/Dise%C3%B1o, septiembre 2013
El diseño se define como el proceso previo de configuración mental, "pre-figuración", en la búsqueda de una solución en cualquier campo.
El verbo "diseñar" se refiere al proceso de creación y desarrollo para producir un nuevo objeto o medio de comunicación (objeto, proceso, servicio, conocimiento o entorno) para uso humano.
5
¿Qué es el Diseño?
Diseño es verbo y es sustantivo.
Como “verbo” nos indica una actividad, para crear, inventar o solucionar un problema.
Como “sustantivo” es una composición gráfica o industrial.
“Diseño” es un proceso y una herramienta.
“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
6
¿Qué es el Diseño?
“Conjunto de conceptos y herramientas, con el objetivo de transmitir sentimientos” (RFE)
7
Un ladrillo
”Concepto de ladrillo”, http://sobreconceptos.com/ladrillo, septiembre 2013
Materia prima
Objeto
8
Unir
”Construcción”, http://espanol.torange.biz/Architecture/building/construcci%C3%B3n-de-la-esquina-de-la-casa-de-ladrillo-2916.html, septiembre 2013
Materiales Herramientas Conocimiento Creatividad
UniendoObjetos
9
Creación de unnuevo objeto
”Edificio Chrysler”, http://www.allposters.es/-sp/Edificio-Chrysler-Posters_i7898927_.htm, septiembre 2013
“Hasta un ladrilloquiere ser algo”
10
Las “herramientas de diseño” se pueden aprender de manera documental y práctica.
¿Cómo aprender diseño? (1)
¿Cómo aprender diseño? (2) El “proceso de diseño” implica una “inspiración mental”
que se puede tener o desarrollar con la práctica (no hay reglas escritas).
Cuando se desvanece la inspiración”, http://blog.jhonsw.com/cuando-se-desvanece-la-inspiracion/, septiembtre 2013
Directrices de Diseño
13
Líneas Formas Texturas. Color. Tipografía. Composición
Directrices de Diseño
14
Es una serie de puntos conectados.
Líneas
“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
15
Son asociadas con industria, empresas ó maquinaria.
Líneas Rectas
“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
16
Son asociadas con la naturaleza (las plantas y animales no tienen curvas rectas).
Líneas Curvas (curvilíneas)
“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
17
Las líneas pueden ser usadas para crear contornos de objetos, crear divisiones o sugerir movimiento.
Líneas (alrededor de objetos)
“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
18
Es un área dentro de un espacio cerrado.
Formas
“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
19
Vienen de figuras que imitan la naturaleza.
Formas (orgánicas)
“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
20
Vienen de fórmulas matemáticas (como los fractales).
Formas (geométricas)
“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
21
Se pueden construir escenarios a partir de formas básicas.
Formas (unión de varias formas)
“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
22
La calidad de una forma o línea es una textura.
Texturas
“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
23
Repitiendo patrones uniformes podemos crear texturas.
Texturas (patrones)
“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
24“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Repitiendo patrones 2D se pueden simular texturas 3D.
Texturas (simulando 3D)
25“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Es un método aditivo de colores para representar cualquier color, usado para proyectar en pantallas.
Color (RGB)
26“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Es un método sustractivo de colores para representar cualquier color, usado para crear documentos impresos.
Color (CMYK)
27“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
?
Color (temperatura)
28“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Sirve para que el lector lea y se meta al mensaje.
Las letras liberan un mensaje e invitan a la acción.
La mayoría de los diseños usan letras ya que ayudan a comunicar el significado del diseño.
Tipografía
29“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Serif. Sans Serif. Slab Serif. Script y Cursiva Gótica. Decorativa. Símbolos.
Tipos de Letras
30“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Tipos de Letras
31“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Tipos de Letras
32“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Tipos de Letras
33“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Tipos de Letras
34“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Tipos de Letras
35“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Tipos de Letras
36“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Tipos de Letras
37“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Letras (Atributos)
38“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Letras (Saturación)
39“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Letras (Distribución)
40“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Letras (Balance)
41“Digital Design for Print and Web”, John DiMarco, John Wiley & Sons 2010
Letras (Balance)
Rogelio Ferreira Escutia
Instituto Tecnológico de MoreliaDepartamento de Sistemas y Computación
Correo: [email protected] [email protected]
Página Web: http://antares.itmorelia.edu.mx/~kaos/http://www.xumarhu.net/
Twitter: http://twitter.com/rogeplusFacebook: http://www.facebook.com/groups/xumarhu.net/