logo W

Código

4495

Modalidad

  • Virtual

Orientación

Profesional

Horas

30 horas

Créditos

1 ECTS

Importe

30 euros

Inicio

04 Noviembre 2016

Finalización

01 Diciembre 2016

Dirección

Dirigido por Encarni Hinojosa

Documentos relacionados

Estado

En periodo de automatriculación

Introducción

El diseño web ya está al alcance de todos. Desde la aparición de internet, los creadores web debían tener un requisito indispensable: saber leer y escribir código HTML. Con el paso de los años, otros lenguajes se unieron al curriculum de los diseñadores-programadores web como CSS, PHP, Java Script... La lista de diferentes librerías de código es extensa y entender y controlarlas todas es una tarea ardua incluso para los programadores o informáticos. Si esta complicada misión se traslada a usuarios carentes de esta especialización y más acostumbrados a la ofimática, la tarea de crear contenido web se convierte en una gesta utópica.

Sin embargo, la aparición del HTML5, el código actualizado de la gran base de la programación web, el HTML, trajo consigo la posibilidad de una democratización en el mundo del diseño web. Este lenguaje de programación, mucho más avanzado que sus antecesores, permite ser moldeado para su uso en herramientas más amigables y más cercanas a la ofimática que un texto de código puro. Instrumentos como Google Fusion Tables, para gráficos y mapas interactivos; Animatron, para hacer pequeñas animaciones; o Genially, para crear productos digitales como infografías interactivas o portales, permiten a un usuario con pocos o nulos conocimientos de programación diseñar en entorno web y sacarle el máximo rendimiento al HTML5.

El objetivo de este taller es que los alumnos adquieran los conocimientos necesarios para poder crear todo tipo de contenido web sin necesidad de conocer profundamente código HTML o CSS. Gracias al aprendizaje de uso de las herramientas gratuitas anteriormente mencionadas, los participantes obtendrán la capacitación para poder realizar gráficos sencillos pero interactivos, mapas interactivos con información geolocalizada, pequeñas y sencillas animaciones de vídeo y diferentes productos digitales como infografía web interactiva, curriculum animado o presentaciones con interactividad y animación.

Esta actividad forma parte del programa de talleres del Centro de Producción y Experimentación en Contenidos Digitales UNIA, una iniciativa coordinada desde UNIA Prácticas y Culturas Digitales.

Destinatarios

Este taller está orientado a cualquier persona que tenga inquietudes en el diseño y la comunicación digitales. Dentro de este grupo general de interés, los destinatarios pueden pertenecer a cualquier disciplina como Ciencias de la Comunicación, Sociología, Diseño gráfico o Publicidad y Marketing, entre otros. Especialmente es interesante para el profesorado de todos los niveles interesado en las TIC (Tecnologías de la Información y la Comunicación).

Aunque es una ventaja tener nociones básicas de diseño, así como de los programas informáticos más habituales para desarrollarlo (Illustrator, Photoshop, InDesign, AfterEffects), no es indispensable contar con esta faceta a la hora de realizar el taller, ya que se ofrecerá apoyo y asistencia a las personas que lo precisen. A pesar de que también será una ventaja conocer lo esencial de los lenguajes HTML y CSS, tampoco es necesario cumplir esta condición, ya que sólo se usará puntualmente, de manera muy básica y con apoyo por parte del profesorado. Sí que es muy recomendable que las personas interesadas posean ordenador propio y tengan conocimientos básicos de informática y ofimática.

Profesorado

Encarni Hinojosa
Twitter: @EncarniHinojosa
Licenciada en Periodismo por la Universidad de Málaga (2004), lleva más de diez años trabajando como periodista visual especializada en gráficos y en visualización de información. Tras una larga etapa formando parte de diferentes departamentos de diseño de Vocento, uno de los grupos de prensa escrita y online más importantes de España, actualmente centra su labor en la visualización digital dentro de la compañía EcoAvantis.

Su trabajo ha sido reconocido con varios premios a lo largo de su trayectoria, sobre todo de la SND (Society for News Design), organismo más importante a nivel mundial de diseño e infografía en prensa, en su sección nacional (ÑH) e internacional. Es autora del blog yohagolosdibujitos.blogspot.com, sobre diseño, infografía e ilustración y editora del portal malagaviz.com, donde se traducen los datos abiertos gubernamentales sobre Málaga a dataviz, animación e infografía.

Objetivos y contenidos

El objetivo de este taller es que cualquier usuario con conocimientos mínimos de informática (ofimática) sea capaz de crear contenido web de calidad y enriquecido. Las competencias que se adquirirán permitirán a los participantes diseñar e implementar sus propios productos web sin necesidad de aprender ningún lenguaje de programación y sirviéndose de herramientas que traducen el HTML5 en interfaces fáciles de usar. Las competencias se concretan en los siguientes puntos:

  1. Fundamentos sobre el diseño web: Historia de internet y del diseño web. ¿Cuáles son los lenguajes de código más usados en el diseño web? La revolución del HTML5 y la democratización del diseño web.
  2. Google Fusion Tables: Uso de tablas de datos en Google Fusion Tables. Creación de gráficos estadísticos interactivos (gráficos de barras, columnas, fiebre, tarta, dispersión y de red). Elaboración de mapas interactivos con Google Fusion Tables. Mapas de Google Fusion Tables con geolocalización del usuario. Herramientas: Google Fusion Tables, Brackets.
  3. Animatron: Crear una sencilla animación y exportarla a código HTML5. Elaborar una animación más compleja y exportarla a vídeo. Realizar un gif animado sencillo para su uso en redes sociales. Herramienta: Animatron.
  4. Genially: Una 'startup' andaluza que ha revolucionado el HTML5. Diseño de una infografía interactiva sencilla. Elaboración de un currículum animado. Creación de una presentación sencilla, animada e interactiva. Uso avanzado de la herramienta: estadísticas de Google Analytics, trabajo colaborativo, contenidos enriquecidos (gráficos o mapas de Google Fusion Tables, animaciones de Animatron, vídeos de Youtube, 'widgets' de redes sociales), SEO. Herramienta: Genially.

Bloques de contenido:

Bloque 0 | Presentación | 30 minutos

Mediante el foro del campus virtual y un vídeo, se realizará una presentación del taller con la descripción de los contenidos y los objetivos. También se ofrecerán a los alumnos los recursos necesarios para su realización (enlaces, manuales, ejemplos de las herramientas que se verán en el taller).

Bloque 1 | Fundamentos sobre el diseño web | 1 hora y 30 minutos

  1. Historia de internet y del diseño web. Una breve contextualización sobre el entorno digital y de la world wide web (www), desde sus inicios hasta las últimas tendencias.
  2. ¿Cuáles son los lenguajes de código más usados en el diseño web? HTML, CSS, JavaScript...
  3. La revolución del HTML5 y la democratización del diseño web. ¿Qué es el HTML5 y que supuso su aparición para el diseño web? ¿Por qué el HTML5 permite hacer el diseño web apto para todos los perfiles?

Bloque 2 | Google Fusion Tables | 4 horas

  1. Uso de Google Spreadsheet, la herramienta de Google para hojas de cálculo. Importar una hoja de cálculo de Spreadsheet en Google Fusion Tables. Edición de datos (tipología).
  2. Creación de gráficos estadísticos interactivos. ¿Cómo hacer un gráfico de barras, uno de columnas, uno de fiebre, uno de tarta, uno de dispersión o uno de red?
  3. Elaboración de mapas interactivos. Diseñar un mapa interactivo tomando como base una hoja de cálculo de Google Spreadsheet y usando los mapas de Google Maps.
  4. Mapas de Google Fusion Tables con geolocalización del usuario. Incorporar en un mapa ya creado con Google Fusion Tables la opción de la geolocalización del usuario modificando, de una manera muy sencilla, el código HTML+Java Script del mapa

Bloque 3 | Animatron | 4 horas

  1. Cómo crear una sencilla animación y exportarla como código HTML5 para incorporarla en una web.
  2. Elaborar una animación algo más compleja y exportarla a vídeo.
  3. Realizar un sencillo gif animado para su uso en redes sociales.

Bloque 4 | Genially | 8 horas

  1. ¿Qué es Genially? Una 'startup' andaluza que ha revolucionado el HTML5.
  2. Diseño de una infografía interactiva sencilla.
  3. Elaboración de un currículum animado.
  4. Creación de una presentación (para congreso o ponencia) sencilla, animada e interactiva.
  5. Uso avanzado de la herramienta. Estadísticas de Google Analytics, trabajo colaborativo, contenidos enriquecidos (gráficos o mapas de Google Fusion Tables, animaciones de Animatron, vídeos de Youtube, 'widgets' de redes sociales), SEO.

Bloque 5 | Trabajo práctico: Andalucía verde | 12 horas

  1. Presentación del trabajo práctico sobre los Parques Naturales de Andalucía. Para la realización de este trabajo se usarán las tres herramientas tratadas en el taller. Se ofrecerán los recursos necesarios, el boceto del diseño y los datos a los participantes para que éstos sólo tengan que centrarse en la ejecución usando las herramientas del curso.
  2. Elaboración, por parte del alumno, del trabajo práctico.
  3. Valoración de los trabajos realizados por los alumnos, corrección de errores y turno de dudas y preguntas acerca del trabajo práctico y sobre el taller, en general.

Metodología

El taller se desarrollará a través del campus virtual ofrecido por el Área de Innovación de la UNIA. Se usarán los recursos disponibles en el campus como:

  • Foro de novedades: donde la docente irá informando a los alumnos de las actualizaciones y de los asuntos más importantes del taller.
  • Foro: donde los alumnos podrán interactuar entre ellos y con la docente, proponer sus dudas y participar activamente en el taller aportando otros recursos, proyectos, herramientas...
  • Carpeta de archivos de vídeo: además de los contenidos en formato .pdf (con texto, fotos y gráficos) de cada tema relacionado con una herramienta determinada, la docente ofrecerá un videotutorial de cada herramienta que, a medida que avance el curso, se almacenarán en esta carpeta de archivos.
  • Test: para que el alumno se evalúe a sí mismo en la asimilación de ciertos contenidos, se ofrecerá como actividad complementaria diversos test relacionados con cada tema.
  • Tareas: con la idea de que el alumno vaya asimilando el uso de las herramientas tratadas en este taller, se propondrán ciertas tareas prácticas sencillas y se ofrecerán los archivos de recurso necesarios para su ejecución.
  • Proyecto final: consistirá en la elaboración de un portal web, tomando como base la herramienta Genially, sobre los Parques Naturales de Andalucía. En este portal, también tendrán que incluir un mapa y un gráfico estadístico interactivo realizados con Google Fusion Tables y una sencilla animación diseñada con Animatron. Así, los alumnos pondrán en práctica las tres herramientas tratadas en el curso. Se ofrecerán los recursos necesarios, el boceto del diseño y los datos, para que los alumnos sólo tengan que centrarse en la puesta en práctica de los conocimientos adquiridos en las herramientas de diseño HTML5.
  • Sistema de evaluación: los test y las actividades complementarias sólo supondrán un pequeño porcentaje en la evaluación final de cada alumno. El peso de la evaluación recaerá en el proyecto final, ya que con este ejercicio cada alumno mostrará si ha asimilado todos los conocimientos del taller.
  • Redes sociales: a través de las cuentas de Facebook y Twitter del taller, la docente comunicará a los alumnos las actualizaciones, compartirá enlaces de interés e invitará a la participación de los alumnos para que compartan sus propias recomendaciones, trabajos o enlaces. Comunicación profesora-alumno: Los alumnos podrán en cualquier momento consultar a la profesora cualquier duda acerca de los contenidos a través de email durante las 4 semanas del taller.

Plan de trabajo

  • Semana 1 | 6 horas virtuales: bloque 0 (30 minutos), bloque 1 (1 hora y 30 minutos) y bloque 2 (4 horas).
  • Semana 2 | 12 horas virtuales: bloque 3 (4 horas) y bloque 4 (8 horas).
  • Semana 3 | 6 horas virtuales: bloque 5 (6 horas).
  • Semana 4 | 6 horas virtuales: bloque 5 (6 horas).

Precio y matriculación

Precio: 30 €

Plazo de matrícula: hasta el 28 de octubre de 2016

Matriculación y pago a través de la web de la UNIA (apartado Estudia en la UNIA,

http://www.unia.es/oferta-academica).

Más información sobre matriculación en malaga@unia.es

Certificados

Se otorgará un certificado de aprovechamiento a los participantes que superen los requisitos mínimos de evaluación del taller.