Esta presentación cubre elementos de diseño y arte aplicables a cursos en linea y otros metodos de difusion de conocimiento. Trata de resumir algunos aspectos importantes en cuanto al mejoramiento de presentaciones para cursos.
1. Arte y diseño gráfico de un curso en línea. Por: Juan C. Peña Martínez Diseñador Gráfico
2. Contenido Arte para comunicar Arte para educar Diseño gráfico Regla del 6x6 Etiqueta de Comunicación Ajustar el Master Fotografía digital Esta presentación tiene notas aclaratorias e informativas adicionales .
4. Introducción Bienvenidos al Tema 5: Arte y diseño gráfico de un curso en línea. En este tema se explica brevemente la importancia del diseño gráfico en un curso en línea y cómo ayuda a aumentar la efectividad del mismo reforzando su mensaje.
6. Arte para Comunicar Para comunicar a través del arte hay que tener un entendimiento básico de lo que es semiótica. La semiótica se define como el estudio de los signos, su estructura y la relación entre el significante y el concepto de significado.
7. Arte para Comunicar En otras palabras, hay que conocer los símbolos y sus significados. Es importante tomar en cuenta la audiencia a la cual está dirigido el mensaje. Los símbolos que son pertinentes y correctos para el mensaje dependen del conocimiento de la sociedad a la que se desea afectar. Los colores que la sociedad identifica como simbólicos también ganan peso en el mensaje.
10. Arte para Comunicar Principios para el uso de colores Considere a la audiencia y el tema Escoja el color del fondo antes que el color de las letras Evite la sobrecarga de colores en un solo “slide”. Mantenga consistencia en los colores Mantenga consistencia entre los contrastes del fondo y las letras
11. Arte para Comunicar Una buena combinación de colores permite que el mensaje sea legible. Refuerza el tema y la idea. Nos da base para el escogido de imágenes. Estos son ejemplos de colores de buen contraste para una presentación.
25. Arte para Educar El arte para educar expande en algunos puntos clave las “reglas” del arte para comunicar. Tenemos 2 audiencias principales. (Estudiantes, Facultad) Tenemos temas específicos para ellos. (Cursos, Materias…) Su labor principal es reforzar el material no suplantarlo. (Es más práctico una imagen con descriptivos que un capítulo de texto.)
26. Arte para Educar Elementos de Diseño a tomar en consideración en una presentación. Uniformidad Color - Mantener un set de colores establecido. Jerarquía - Los niveles de importancia de la información. Tipografía/Estilos de fuentes (fonts) –Letras legibles. No cansar la vista. Fondos - Color de fondo, textura, efectos según necesario. Contraste - Legibilidad del texto con el fondo e imágenes.
27. Arte para Educar Al compartir la información debe conocer el formato en la cual la va a compartir. Algunos formatos son mejores para unos tipos específicos de información Los archivos informativos se dividen en varias clasificaciones: Texto, Gráfico, Audio/Video, Multimedio(combinación de los anteriores)
28. Arte paraEducar ¿Qué formato de imagen debo utilizar? Gif – Formato de compresión de imágenes. Utiliza 256 colores o menos y puede hacer transparencia. Este formato es muy utilizado en diseño de páginas por sus capacidades. (transparencia, animación sencilla) Jpg – Formato de compresión de imágenes Utiliza miles de colores Tiende a crear deformaciones leves pero es el mejor para fotos en el Web. Existen otros pero estos ya mencionados son los comunes.
29. Arte para Educar Detalles de archivos Peso – Se refiere a el espacio en disco que ocupa el archivo. (Numeración en Bites, Kb, Mb, Gbetc…) Tamaño – se refiere a la medida en pantalla que tiene el archivo.(Numeración en pixels, pulgadas, picas, puntos, etc… ) Calidad – Se refiere a cuán bien se VE la imagen para efectos de su uso.(Relacionado con la resolución) Formato – Se refiere a la extensión o el tipo de archivo que es. (Ej. BMP, GIF, JPG, PNG,Doc, Pdf, Swf, Avi…)
31. DiseñoGráfico El diseño gráfico es una disciplina estudiada y aprendida. Se refiere a la organización de los elementos, colores, símbolos, texturas etc. de forma tal, que comuniquen con mayor efectividad la idea. Contrario a la idea común, el diseñador y el artista gráfico no son lo mismo. Es tan diferente y similar como un médico y un enfermero, están en un campo similar, pero ejercen labores diferentes.
32. Diseño Gráfico El término diseñador gráfico se refiere a quien emplea un número de disciplinas artísticas enfocadas en la comunicación visual y presentación de un tema. Entre sus herramientas de mayor uso están las siguientes. Tipografía(letras, fonts) Imágenes(video, fotos, ilustraciones) Colores Elementos adicionales como (texturas, formas, líneas)
33.
34. El producto final debe ser un solo elementocompuesto de todos los anteriores.Cambio
36. DiseñoGráfico El artista gráfico trabaja por inspiración, gusto y estética, éste puede decir… “No meGusta”, el diseñador gráfico debe trabajarpor estudio, análisis y raciocinio, éste debedecir… “No funciona.” - JCP 2009
38. Regla del 6x6 La regla del 6x6 tiene como meta: La legibilidad de las presentaciones. Recuerde que las presentaciones deben ser guías del contenido: No es aceptable, práctico o funcional la sobrecarga de texto . Recuerde respetar los márgenes de su presentación deje algo de “aire” nosobrecargue la página.
39. Regla del 6x6 Esta regla existe para aumentar la legibilidad y funcionalidad de las presentaciones. 6 palabrasporlínea 6 líneas por visual ____________________ 36 palabras por visual Usualmenteutilizado en Televisiónperoaplica a otrosmedios. Respetesusmárgenes
41. Etiqueta de Comunicación Regla 1: Nunca olvide que la personaque lee el mensaje es, en efecto, humanacon sentimientos que pueden ser lastimados. Regla 2: Adhiérase a los mismos estándares de comportamiento en línea que usted sigue en la vida real.
42. Etiqueta de Comunicación Regla 3: Reconozca en qué parte del ciberespacio se encuentra para que adapte su vocabulario, actitud pensamiento de ser necesario. Para más información Vea - el Decálogo http://es.wikipedia.org/wiki/Netiquette
43. Etiqueta de Comunicación ¿Sabeustedque… EL ESCRIBIR UN MENSAJE EN MAYÚSCULAS REDUCE SU LEGIBILIDAD Y CANSA LA VISTA Cadaletra(font) tienesuuso y lugar Es recomendableusar 3 o menostipos de letrapara no causarconfusión La lectura en Occidentees de Izquierda a Derecha
46. ¿Quées el Master? El master es el control de fondo principal de supresentación. Este manejacómo se ve la misma y cómo se ven los “slides” y los tipos de “slides”. Le permitedar un “look” único a supresentaciónmientrasevita el sobrecargarla con imágenes de fondo.
47. Ajustar el Master En el tab de “view” encontrará los controlesparaver la presentación. Escoja “Slide Master”
48. Ajustar el Master Este es el botónparacerrar la vista del “master”yregresar a el modo regular de la presentación Cadauno de estoscuadrosrepresenta un tipo de vista de la presentación. El primerocontrola la mayor parte de la presentación
49. Ajustar el Master En la presentaciónpuededar “right click” al “slide” queestétrabajando y notaráqueexiste un item del menúque dice “layout”. De esta forma escoje el modo de ese “slide” en particular.
51. Fotografía Digital Una vez conocemos los aspectos básicos de formato, es importante aplicar los mismos. La fotografía digital es muy popular. Estas preguntas le ayudarán a escoger o tomar buenas fotografías para sus presentaciones. ¿Qué hace una buena foto digital? ¿Cuánta calidad para una presentación? ¿Cuál es el tamaño en que debe estar la foto?
52. Fotografía Digital: Peso Peso de la imagen: Se refiere a la utilización de recursos de la máquina. Se compara la medida en espacio de disco, memoria o tamaño de una imagen al peso de un objeto. Esto es para simplificar el entendimiento del concepto. Una imagen que original mente mide 14 pulgadas por 14 pulgadas a 72dpi es demasiada calidad para una presentación, “pesa” mucho. Fácilmente resuelve con una imagen 4x4 a 72dpi y aún así, es bastante grande. Recuerde que las presentaciones tienen que ser prácticas.
53. Fotografía Digital: Peso Peso de la imagen(recuerde los archivos): Detalles a tomar en consideración. ¿Qué desea mostrar en la presentación? ¿Necesito que se vean los poros de la cara de la persona? ¿Necesito poder ver una milla de distancia del paisaje y poder ver la gente que está en el carro a la distancia? Suena exagerado pero eso es exactamente lo que ocurre cuando se coloca una imagen con demasiada calidad.
54. Fotografía Digital Calidad: No utilicemáscalidad de la necesariaperotampocoescatime al punto de colocarimagenes de pésimacalidad. Busque un puntomedio. 1 2 3
55. Fotografía Digital: Comparativo Si comparamos la imagen 1 (altacalidad) con la imagen 3 (agrandada al mismotamaño) Notaremos la claradiferencia en calidad.
56. Fotografía Digital: Comparativo Si comparamos la imagen 1 (altacalidad) con la imagen 2 (agrandada al mismotamaño) Notaremos la que la diferencia no es tan evidente. Estaimagen 2 esaceptable y “pesa” menos.
65. ¡Gracias porsuatención! Nota: Estapresentación con todassusimágenes y sus 48 “slides” sólomide 1.06MB lo cualesunamedida ideal para internet, cursos en línea y transferenciasdigitales. Procure al crearpresentacionesparasuscursosquelasmísmas no ocupenmás de 4MB de espacio en cuanto sea posible.
Notas del editor
Importancia de conocer los símbolos y su significado.http://es.wikipedia.org/wiki/Semi%C3%B3tica
Comience con una idea que pueda expresarla en forma clara y precisa. Losmateriales gráficos, para que sean útiles, deben someterse a una cuidadosaplanificación. Evite la complicación y la sobrecarga en el uso de elementosdecorativos, mejor cree dramatismo e impacto con los gráficos.Pregúntese lo siguiente:¿Qué -voy a comunicar?¿Porqué - lo voy a comunicar?¿Cómo - lo voy a comunicar?¿A quién- está dirigido el mensaje?
Prueba de concepto.
Prueba de concepto.
Un buen escogido de colores permite que su presentación sea llamativa y legible.
Aquí hay una descripción un poco más abarcadora de los términos mencionados.Tipografía•Fuentes (Fonts)•Ej: Arial, Times New Roman, Verdana•Tamaño de letra adaptado al medio y al mensaje•Estilos - Evite el "Bold" y el "Italic“ en textos extensos.•Subrayar puede ser confundido con un enlace o vínculo.Color•Propiedad Fundamental = Luz•Primarios: rojo, amarillo y azul•Efecto psicológico y socialContraste•Entre las fuentes (fonts) y el fondo•Usar combinaciones de colores
Los archivos gráficos tienen distintos detalles que pueden ayudar a escoger el mas apto para su uso en cursos y presentaciones. Contrario al uso común entre educadores No es recomendado copiar los mismos a word y luego usarlos en sus presentaciones ya que los mismos pierden calidad en el proceso. Es mejor bajarlos a su maquina (rightclick – saveimage as).
5 minutos.
Es conocimiento común de quienes se comunican en el internet de que existen unas reglas básicas de etiqueta.Lea http://www.usergioarboleda.edu.co/grupointernet/netiquete.htm (o puede revisar http://es.wikipedia.org/wiki/Netiquette)Como referencia básica de etiqueta. Este link contiene información aplicada a e-mails pero esas reglas básicas aplican a otros medios de comunicación escrita hoy día.
Es conocimiento común de quienes se comunican en el internet de que existen unas reglas básicas de etiqueta.Lea http://www.usergioarboleda.edu.co/grupointernet/netiquete.htm (o puede revisar http://es.wikipedia.org/wiki/Netiquette)Como referencia básica de etiqueta. Este link contiene información aplicada a e-mails pero esas reglas básicas aplican a otros medios de comunicación escrita hoy día.
Es conocimiento común de quienes se comunican en el internet de que existen unas reglas básicas de etiqueta.Lea http://www.usergioarboleda.edu.co/grupointernet/netiquete.htm (o puede revisar http://es.wikipedia.org/wiki/Netiquette)Como referencia básica de etiqueta. Este link contiene información aplicada a e-mails pero esas reglas básicas aplican a otros medios de comunicación escrita hoy día.
Términos a conocer: DPI = Dots per inch (puntosporpulgada) Es la medida “fisica” en calidad de suimagen al imprimir o mostrar en pantalla. 72dpi es el tamañocomún de pantalla. 150dpi escalidadaceptable y esregularmenteutilizadoparaimprenta no parapresentaciones. 300dpi o másesconsideradoaltacalidad y esregularmenteutilizadoparaimprenta no parapresentaciones.Estamedida (dpi) en combinación con el tamaño en pulgadasafectadirectamente el tamaño en disco duro(y en pantalla) de suimagen mayor calidadrequieremayoresrecursos(memoria, disco).
En el listado coloco los programas que comúnmente se pueden utilizar para arreglar/editar/crear imágenes. En el caso de los programas de adobe; esta compañía provee versiones a precios más razonables y también versiones temporeras. No olviden que como entidad educativa y como profesores/estudiantes tienen derecho a comprar programas a precio educativo en los respectivos websites de sus compañías o en lugares como www.creationengine.com que se dedican a ofrecer software a precio educativo.(con las debidas credenciales)