MÓDULO 1. USABILIDAD UNIDAD DIDÁCTICA 1. INTRODUCCIÓN Introducción La usabilidad Qué es UI vs UX - interfaz de usuario vs Experiencia de usuario Atributos Complejidad e importancia de la usabilidad Pirámide de prioridades de la usabilidad Mejoras de la usabilidad al producto final Procesos y herramientas UNIDAD DIDÁCTICA 2. EXPERIENCIA DE USUARIO -UX Definición de Experiencia de Usuario Principios de la Experiencia de Usuario El papel del diseñador UX en el proceso de creación Etapas del diseño UX Técnicas para el diseño UX Herramientas UX UNIDAD DIDÁCTICA 3. DISEÑO CENTRADO EN EL USUARIO ¿Qué es el Diseño Centrado en el Usuario? ¿Para que sirve el Diseño Centrado en el Usuario? Las metodologías del Diseño Centrado en el Usuario El marketing centrado en el usuario Aplicación del Diseño Centrado en el Usuario Ejemplos del Diseño Centrado en el Usuario UNIDAD DIDÁCTICA 4. FORMAS DE ENFOCAR LA USABILIDAD Introducción Un proceso multidisciplinar La usabilidad aplicada El ciclo diseño-investigación UNIDAD DIDÁCTICA 5. INTERFAZ DE USUARIO -UI Definición de Interfaz de Usuario - UI Elementos de la interfaz de Usuario Optimización de las interfaces de Usuario Herramientas para el diseño UI Diseño basado en las percepciones Fundamentos del diseño de interacción Moodboards Qué es el IxD MÓDULO 2. DISEÑO WEB Y USABILIDAD UNIDAD DIDÁCTICA 1. INTRODUCCIÓN AL DISEÑO WEB Breve historia del diseño Comunicación y publicidad Teoría de la percepción Elementos básicos que intervienen en el diseño La composición Fases del diseño Diseño digital UNIDAD DIDÁCTICA 2. ELEMENTOS BÁSICOS PARA EL DISEÑO WEB Tipografía Color Iconos Formas Imágenes Contenido audiovisual Efectos (sombras, D, flat y otros) UNIDAD DIDÁCTICA 3. LAYOUT ¿Qué es el Layout? Rejilla Composición Elementos Espacios vacíos Coherencia y consistencia UNIDAD DIDÁCTICA 4. PROCESO Introducción al proceso de diseño web Aproximación e Investigación inicial Idear Bocetos Arquitectura de la información Card Storing User flow o diagrama de flujo de usuario Wireframing Prototipado Planificación UNIDAD DIDÁCTICA 5. DIRECTRICES Y TENDENCIAS DIGITALES Guías de estilo Ventajas y Desventajas Apple IOS Human Interface Guidelines Google Material Design Tendencias digitales Tendencias del diseño UX/UI UNIDAD DIDÁCTICA 6. DISEÑO EN DISPOSITIVOS Patrones de diseño y navegación Especificaciones para móviles Sitios, sitios par amóviles y apps Diseñar para pantallas pequeñas Eltimpo de respuesta y carga Tablets y E-Readers UNIDAD DIDÁCTICA 7. LENGUAJE HTML Textos en HTML Enlaces Listas en HTML Imágenes y Objetos Tablas Formularios Marcos Estructuras y layout Otras etiquetas UNIDAD DIDÁCTICA 8. WIREFRAMES Y PROTOTIPOS ¿Qué son los wireframes? Objetivos del wireframe Relación con la UI Clasificación de los wireframes Arquitectura de la información Wireframe para una app MÓDULO 3. IMPLEMENTACIÓN Y OPTIMIZACIÓN. USABILIDAD EN EL MUNDO REAL UNIDAD DIDÁCTICA 1. IMPLEMENTACIÓN Y OPTIMIZACIÓN Introducción Conseguir resultados reales Optimización web desde la usabilidad UNIDAD DIDÁCTICA 2. EQUIPOS DE USABILIDAD ¿Qué son? Trabajo multidisciplinar y multitarea Métodos de trabajo del equipo. Metodologías Ágiles Pruebas de Usabilidad UNIDAD DIDÁCTICA 3. ROLES Diversidad de roles y funciones UX Researcher UX Writer UI/UX Prototyping Developer Web Developer Interaction Designer Visual Designer Motion Designer MÓDULO 4. EL DISEÑO DE INTERFACES DE USUARIO (UI) UNIDAD DIDÁCTICA 1. INTRODUCCIÓN AL UI ¿Qué es interfaz de usuario (UI)? Diferencias y similitudes entre UX y UI UNIDAD DIDÁCTICA 2. UI DESIGN PROCESS Proceso de negocio User persona Screen flow Wireframes Diseño Alta Fidelidad Prototipado Feedback y entrega UNIDAD DIDÁCTICA 3. FUNDAMENTOS DEL DISEÑO UI Principios del diseño aplicados al UI Principios de claridad Reglas Heurísticas de usabilidad Elementos de una interfaz de usuario Patrones y consistencias del diseño UI UNIDAD DIDÁCTICA 4. UI KIT Y SISTEMAS DE DISEÑO UI kits Atomic Design Icon Design Los sistemas de diseño UNIDAD DIDÁCTICA 5. MOTION UI Principios del Motion Microinteracciones MÓDULO 5. DISEÑO UI CON ADOBE XD