Diseño gráfico de pantallas interactivas

Duración: 330 horas

Objetivo: Crear, diseñar y producir productos para dispositivos web y móviles centrados en la mejora de la experiencia de usuario, a través de las herramientas más utilizadas de: creación gráfica de interfaces, maquetación, codificación y programación en el desarrollo de contenidos para a web y apps para smartphones y tabletas.

Titulación de bachillerato o equivalente y experiencia profesional en diseño gráfico.

Módulo 1

Denominación: Diseño de productos digitales, uso y proceso de diseño de productos UI-UX

Objetivo: Diseñar y producir interfaces de usuario con las herramientas específicas del entorno, cumpliendo las directrices de uso y accesibilidad tanto para entornos gráficos basados ​​en sistema operativo, como por aquellas interfaces Web clásicas y app.

Duración: 180h

Contenidos teórico-prácticos:

1. Diseño de productos digitales. Estudio de los fundamentos del uso.

   • Principios básicos del lenguaje visual. Comunicación visual.
   • Estudio del color, la imagen y tipografía.
   • Análisis de tendencias gráficas de diseño web y app: Flat design, esqueumorfisme, material design.
   • Lenguaje gráfico. Definición de un manual de identidad corporativa.
   • Metodología del proceso de diseño. Definición de elementos, entorno y paleta de producción. Definición de las extensiones de los productos finales

2. Creación de interfaces gráficas.

   • Creación de una interfaz gráfica de acuerdo a aplicación de diseño.
   • Creación de Imagen digital vectorial
   • Creación de Imágenes digitales para bitmap
   • Producción de diseño de interfaces para app: Adobe Photoshop, Adobe Illustrator, Adobe Indesign.
   • Producción de diseños a multiplataformas
   • Producción aspect Ratio, HDPI
   • Análisis de interfaces de escritorio, Web y App.
   • Estudio de las GUI Android, IOS y Windows phone.
   • Preparación de productos adaptados a dispositivos. Concepto diseño multiplataforma, "Mobile First".
   • Creación de transiciones, animación de interfaces como apoyo al UX.
   • Exportación y archivo de interfaces.
   • Creación colaborativa, en la creación de interfaces en ambientes de trabajo Agile y Scrum

3. Proceso de diseño UI- UX, análisis, creación de maquetas, aplicación de resultados a los prototipos

   • Creación de un proceso de diseño estructural Design Thinking
   • Análisis del HCI (human computer interaction)
   • Proceso de creación de la arquitectura de la información.
   • Principios de uso de Jackob Nielsen
   • Creación de una maceta de uso, maqueta heurísticas
   • Evaluación de una maqueta Heurística
   • Desarrollo de informes de uso
   • Realización de un diseño y mapa de estructura e interacción
   • Creación de wireframes de app elegida
   • Creación de Mockup y prototipos para app
   • Estudio y creación de la narrativa de una app y fases: Alpha, Beta, Release
   • Técnicas de programación. Introducción a la maquetación y funcionalidad

Módulo 2

Denominación: Técnicas de Creación y publicación de interfaces con lenguajes de marcas, script, frameworks, librerías.

Objetivo: Desarrollar y publicar prototipos d'apps con los lenguajes de estructuración, maquetación e interacción necesarios para estandarizar las producciones posteriores a interfaces con tecnologías crossbrowsers y multiplataforma.

Duración: 150 horas

Contenidos teórico-prácticos:

1. Creación de prototipos con lenguaje de marcas y formateado.

2. Introducción a los lenguajes de marcas

3. HTML5 y CSS3
   • Técnicas de maquetación y Producción
   • Traslado de hashtags absolutos a hashtags de maquetación flex.
   • Jerarquía de etiquetas
   • Metaetiquetas SEO y Accesibilidad
   • Evolución y deprecados

4. Lenguajes d'Script

   • Javascript
   • Programación Orientada a objetos
   • La asignación
   • Sintaxis de Javascript
   • Estructuras de control
   • Funciones
   • Gestión de Eventos
   • Técnicas de simulación de funcionalidad
   • Scripts de interacción, acompañamiento al usuario
   • Scripts de mejora de usabilidad

5. Formularios y feedback

   • Herramientas para la gestión del feedback y comunicación
   • Herramientas de sincronización d'scripts usabilidad.
   • Validaciones Cliente - Servidor

6. Audio y vídeo

   • Contenedores de vídeo
   • Códecs de vídeo y audio
   • Alternativas, librerías
   • Sprites CSS

7. Canvas y dibujo

   • Aplicaciones y uso
   • Funciones y propiedades
   • Imágenes
   • Gradientes

8. WebStorage

   • Conceptos previos
   • WebStorage
   • SessionStorage
   • LocalStorage
   • Apis de Webster

- Diploma acreditativo expedido por el Servicio Público de Empleo de Catalunya.