of 17
8/4/2019 TP N 4 Color y Diseo Digital
1/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
Nociones bsicas deColor y Diseo digital
Trabajo prctico N 4
8/4/2019 TP N 4 Color y Diseo Digital
2/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
Es luz: las superficies y cuerpos tienen
color porque son capaces de absorber oreflejar la luz que les llega. Es un lenguaje Requiere conocimientos tcnicos para su
reproduccin.
8/4/2019 TP N 4 Color y Diseo Digital
3/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
Sntesis Aditiva
Es la mezcla de luces, se suman las radiacionesde longitudes de onda. Con la adicin (suma) de todas las luces enpartes iguales obtenemos la luz blanca, es decir
la luz blanca contiene a todos los colores luz. Luces primarias:
Sntesis Sustractiva
Denominada de colores pigmento, paraimpresin.
El color aparece por sustraccin (resta) deradiaciones. Sustrae color, de tal manera que la suma de lostres primarios nos da el negro (la ausencia decolor).
GENERACIN DEL COLOR
8/4/2019 TP N 4 Color y Diseo Digital
4/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
EJERCICIO:
En Quarkxpress vamos a generar unanueva paleta de colores
Enviar el ejercicio x mail([email protected]):ASISTENCIA DE HOY
8/4/2019 TP N 4 Color y Diseo Digital
5/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
COLOR: MARIA CLAUDIA CORTESSitio web sobre la personalidad de los colores.www.mariaclaudiacortes.com
8/4/2019 TP N 4 Color y Diseo Digital
6/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
Diseo Digital
8/4/2019 TP N 4 Color y Diseo Digital
7/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
CONSIGNA DEL TP N 4: COLOR Y DISEO DIGITAL
OBJETIVOS Comprender los pasos que implica el desarrollo y estructura de una pgina web. Implementar herramientas y software de diseo digital y criterios de uso del color. Comenzar a delinear y definir el trabajo final de la asignatura.
CONSIGNA
Realizar una pgina web o blog (Ej. www.blogspot.com) por grupo, que presente el proyecto e ideade trabajo final que realizarn para la asignatura. Se pretenden que comiencen a concretar la idea detrabajo final pero con posibilidades de cambio y adecuacin de la propuesta.Se deber generar en archivo Word la estructura de la pgina o blog con sus posibles interacciones.
Dicha sitio, deber contener al menos cuatro pginas que desarrollen los siguientes contenidos:
El tema del trabajo final: descripcin del mismo y explicitacin del origen -demanda o posibilidad(pueden emplear el material terico de la ctedra para la justificacin) El pblico: aproximaciones a su definicin Posibles imgenes, colores y tipografas que emplearn para el trabajo final Descripcin de la posible forma de trabajo: descripcin de las etapas para llegar a la concrecin deltrabajo final.
8/4/2019 TP N 4 Color y Diseo Digital
8/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
CONSIGNA DEL TP N 4: COLOR Y DISEO DIGITAL
CARACTERSTICAS QUE DEBE CUMPLIR EL SITIO WEB:
La primera pgina o pgina de acceso deber llamarse index.htm y contar con hiperenlaces alresto.La pgina o blog debe contener una botonera, como as tambin enlaces internos a sitios webexternos relacionados con la temtica del sitio.
Al menos una de las pginas debe contener un enlace a un correo electrnico del administrador dela web.Todas las pginas llevarn imgenes.Opcional: utilizar animacin flash para destacar una informacin en especial.
PLAZO Y FORMA DE ENTREGA: 6 de octubre
En caso de la pgina web, traer el archivo editable a clase. Enviar la estructura delsitio en Word por e-mail.
En el caso del blog: enviar el vnculo del blog por e-mail. Hacer una copia depantalla (control + Impr pant) y pegar en Word para poder observar la estructura ydiseo generado para el trabajo prctico. El archivo de diseo y la estructura deberser enviado en Word por e-mail.
8/4/2019 TP N 4 Color y Diseo Digital
9/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
Ejercicio prctico en Flash: interpolacin de movimiento y de formaAlgunos ejemplos
PROGRAMA FLASH: EL ENTORNO DE TRABAJO
8/4/2019 TP N 4 Color y Diseo Digital
10/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
El diseo digital: posibilidades
LA INTERACTIVIDADPosibilidad de navegacin e inmersin en mltiples espacios
LA MUTABILIDADPosibilidad de modificar a travs de entradas (input)
y salidas (output), redefiniendo el papel del creador o diseadory el pblico o espectador
LA HIPERMEDIALIDADPosibilidad de integrar en el medio lo fijo y lo mvil, lo esttico y
lo dinmico
8/4/2019 TP N 4 Color y Diseo Digital
11/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
Algunos criterios para diseo digital:
El buen diseo proviene de una buena planificacin
Debemos definir:
Cul ser el mensaje, filosofa del sitioCules sern los contenidosQu esttica ser la ms apropiadaQu tecnologa utilizaremos para desarrollar la interface
MAPA DEL SITIO:
Es el rbol de contenido en el que se muestra de manera prcticacuntas secciones tendr el sitio en desarrollo y cuntos niveleshabr dentro de cada uno.
8/4/2019 TP N 4 Color y Diseo Digital
12/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
ESTRUCTURA, NAVEGACIN E INTERACTIVIDAD:
Una pgina web se inicia en una Pgina Principal, tambin denominada HomePage. El tipo de estructura que utilicemos determinar como los usuarios van anavegar por nuestro sitio
Jerrquica (la ms utilizada)
8/4/2019 TP N 4 Color y Diseo Digital
13/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
Interconectada Lineal
8/4/2019 TP N 4 Color y Diseo Digital
14/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
Dreamweaver Programa de Macromedia. Es un editor grfico de HTML
(hipertexto) que permite al usuario ver y editar pginas de Web.
8/4/2019 TP N 4 Color y Diseo Digital
15/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
Consejos para diseo web:
La navegacin a travs de la web ha de ser fcil, intuitiva, yconsistente. El navegante debe saber dnde se encuentra en cadamomento.
La interfaz ha de ser lo ms uniforme posible a travs de la web: unmismo sistema de colores, uso de tipografa, colocacin de loselementos de navegacin...
Actualizar la informacin y eliminar partes caducas. La informacinms actual o las secciones nuevas se han de poder localizarrpidamente.
8/4/2019 TP N 4 Color y Diseo Digital
16/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
Consejos para diseo web:
Los nuevos efectos, an no soportados por todos los navegadores ysistemas, aquellos que necesiten plugins, y otros trucos no han deconstituir el ncleo del sitio web, en especial si se trata de elementos
no estndar dentro del HTML.
Conviene utilizar el color con moderacin, de forma consistente yrazonable. Hay que tener especial cuidado de que el texto seafcilmente legible con los colores elegidos.
El texto ha de ser conciso, bien estructurado y fcil de leer. La lecturaen pantalla no es tan agradable como en el papel (puede ser una buenaidea proporcionar tambin una versin ms extensa o especialmentepreparada para imprimir.)
8/4/2019 TP N 4 Color y Diseo Digital
17/17
Escuela de Ciencias de la Informacin UNCCtedra de Produccin Grfica 4to Ao M. Minervini Trabajos Prcticos 2011
Recursos:
Crear sitios web gratis:http://www.ucoz.eshttp://www.everyoneweb.es/http://es.wix.com
Desventajas:Espacio limitadoPocas posibilidades de interaccin y animacinNo hay garantas de la perdurabilidad del sitio
No lo encuentran los motores de bsqueda
Ventajas:Gratuitoptimo para contenidos temporales
Posibilidad de contar con plantillas prediseadas
Blogs:http://www.blogspot.comhttp://www.everyoneweb.es/
Plantillashttp://www.freeplantillas.com/
http://plantillasweb.com.ar/