Máster Profesional en Diseño Web Front-End y UX/UI - Trazos

- Otorgar conocimientos sobre la anidación de elementos, el análisis de tendencias en programación web, la conceptualización gráfica, los tipos de estructuras, y los principios de usabilidad.
- Transmitir un importante plan de estudios, en el cual se enseña sobre los parámetros de transmisión de datos, los frameworks con mayor demanda, los operadores aritméticos, y el manejo de los comandos básicos.
- Profundizar sobre el dominio del prototipado, el diseño web responsive, la creación de un producto digital, las herramientas de depuración de JavaScript, la subida de archivos, y los principios del lenguaje HTML.

Máster Profesional en Diseño Web Front-End y UX/UI

MÓDULO: DISEÑO WEB
DISEÑO WEB VS PROGRAMACIÓN WEB.
- Lenguajes de programación web y su aplicación a proyectos.
- Perfiles: Frontend, Backend, Mean y Fullstack.
- Análisis de tendencias en programación web.
- Fases del proceso web.
- Conceptualización gráfica.
- Layouts y tipos de estructura.
- El color en la web.
- Principios de usabilidad (UX / UI).
HTML5.
- Introducción al lenguaje HTML 5.
- Estructura: header, footer, main, section, article y aside.
- Texto: Strong, span y em.
- Enlaces.
- Imágenes y Picture.
- Imágenes SVG: Imagen vs Código.
- Etiquetas Vídeo y Audio.
- iFrames.
- Listas.
- Tablas.
- Formularios.
- Atributos data-.
- Etiquetas Meta.
- Meta Open Graph.
CSS3.
- Selectores: Básicos, Avanzados, Pseudoelementos (before/after)
- Unidades de medida: básicas, avanzadas y función calc().
- Tipografía: @font-face y Google Fonts.
- Maquetación en Flex.
- Maquetación en Grid.
- Transition.
- Animation + @keyframes.
- Custom properties: variables en CSS.
- Responsive: @media.
SCSS Y TASK RUNNERS.
- Introducción a preprocesadores y Task Runners.
- Usando Prepros.
- Anidación de elementos.
- Variables en SASS.
- Usando Mixins.
JAVASCRIPT.
- Introducción a Javascript Nativo vs Typescript.
- Estado de Javascript: Webs vs Aplicaciones.
- Variables: let,const, var.
- Funciones: parámetros e invocación.
JQUERY EN EMPRESAS.
- Introducción y porqué se sigue usando.
- Selectores.
- Eventos.
- Efectos de Javascript junto a CSS.
BANNERS.
- Introducción: Qué son y uso en empresas.
- Tipos de banners y formatos. Introduciendo ClickTag.
NEWSLETTER.
- Introducción: Qué son y uso en empresas.
- MJML.io: Preprocesador de newsletters.
- PHP en WordPress.
- Introducción a PHP 7: Qué es y para qué sirve.
- MAMP como servidor.
- Introducción a CMS: Wordpress.
- Wordpress Panel de control.
- Wordpress Páginas, Entradas y Configuración.
- Wordpress Temas vs Plugins.
- Subida a Producción.
- Hosting, dominio y proveedores.
- Subida de archivos por FTP.
GIT.
- Introducción.
- Comandos básicos: init, add, commit, push y pull.
- Ramas: branch y merge.
- Aplicaciones GIT: Github Desktop y Bitbucket.
INTRODUCCIÓN A LA PROGRAMACIÓN WEB
- Introducción: Javascript, qué es y para qué sirve.
- Javascript vs ECMAScript vs Vanilla JS.
- Frameworks: Qué son y los más demandados en empresas.
JAVASCRIPT NATIVO.
- Reglas de sintaxis del código.
- Mensajes de error y consejos para depurar el código (debug).
- Herramientas de depuración de JavaScript.
- Variables, constantes y operadores
- Variables, let y const.
- Declaración, asignación y ámbito (scope).
- Operadores aritméticos, comparación, lógicos, asociativos, concatenación.
FUNCIONES
- Declaración, uso.
- Parámetros: transmisión de datos.
- Parámetros SPREAD y deconstrucción.
- Devolviendo datos: return.
ESTRUCTURAS LÓGICAS
- Condicionales.
- Bucles: for, while / do while.
- Switch.
OBJETOS.
- Introducción a objetos y su importancia en Frameworks.
- Definición y creación mediante en ECMAScript y Typescript.
- Propiedades y Métodos.
- Prototipos y Herencia.
ARRAYS
- Arrays de una dimensión.
- Arrays multidimensionales.
- Recorrer Arrays.
- Funciones de arras: map, filter, push…
AJAX Y JSON.
- Pidiendo datos con Fetch.
- Promesas con then().
- JSON: Qué es, stringify y parse.
- Recibiendo datos de una API REST.
JQUERY
- Introducción y porqué se usa en empresas.
- Selección de elementos.
- Manejo de eventos.
- Efectos con jQuery y SCSS.
TYPESCRIPT Y ECMASCRIPT
- Introducción: Qué es y cómo funciona.
- Task Runner: Prepros.
- Tipos de datos.
- Funciones.
- Interfaces.
- Módulos.
INTRODUCCIÓN A FRAMEWORKS
- Qué frameworks se demandan.
- Angular vs React vs Vue vs Svelte.
- Introducción a Node y NPM.
- CLI: Usando la terminal.
- Uso con GIT.
- Componente.
FRAMEWORKS: ANGULAR 11
- Angular CLI: Instalación y uso.
- Componentes.
- Directivas.
- Eventos.
FRAMEWORKS: REACTJS
- CLI: Usando Create-React-app.
- JSX: Introducción.
- Componentes.
- Props.
- State y Hooks.
- Eventos.
MÓDULO: UX/UI_
INTRODUCCIÓN AL UX.
- Siglo XX.
- Qué es el diseño UX.
METODOLOGÍAS ÁGILES.
- Qué es el Agile.
- Qué es el Design Thinking.
- MVP, ¿qué es?.
DEFINICIÓN DE PRODUCTO.
- Qué es el diseño estratégico.
- Los modelos de negocio digitales.
- Scope Canvas.
- Lean UX Canvas.
- Value proposition Canvas.
- Benchmarking.
- Elevator Pitch.
USER RESEARCH.
- Qué es el User Research.
- Proceso del UX Research.
- Artefactos.
- Analizar el problema.
- Arquitectura de la información.
- Qué es la AI.
- Tipos de necesidad de información.
- Sitemap.
- Sistema de etiquetado de una Al.
DISEÑO DE INTERACCIÓN.
- Qué es el diseño de interacción.
- Qué hace un Interaction Designer.
- Principios de diseño de interacción.
- Onboarding del usuario.
- Qué es un Design System.
- Componentes de un Design System.
NARRATIVA UX.
- Qué es narrativa en UX.
- Copywriting vs UX Writing.
- El microcopy.
- La voz y el tono.
CHATBOTS Y VUI.
- Tipos de inteligencias artificiales.
- Canales o medios expresivos.
- Finalidad de un chatbot o VUI.
- La transaccionalidad.
ACCESIBILIDAD Y DISEÑO INCLUSIVO.
- El problema de la “Brecha digital”.
- Accesibilidad en el mundo online.
- Principios de accesibilidad.
- Plugins para medir la accesibilidad.
TEST DE USUARIO Y MEDICIÓN UX.
- Qué es un test de usuario.
- Qué es un test de guerrilla.
- Plataformas para realizar user testing.
- Preparación de un test de usuario.
- Qué es la medición UX.
- Herramientas para la medición UX.
EVALUACIÓN HEURÍSTICA.
- Qué es la EH.
- Reglas o principios para realizar una EH.
- Sistemas de evaluación.
ANIMACIÓN.
- Teoría de la animación.
- Programas de animación.
- Uso de Framer.
PORTFOLIO UX Y ENTREVISTAS.
- Qué es un portfolio UX.
- Qué habilidades tienes.
- CV y carta de presentación.
- Entrevistas de trabajo.
PRESENTACIÓN FINAL DE PROYECTO.
- Cómo presentar el proyecto.
DISEÑO DIGITAL / USABILIDAD / ACCESIBILIDAD.
- Diferencias entre Diseñador gráfico y diseñador digital.
- Diferencias entre UX-UI.
- Usabilidad y accesibilidad.
- Reglas heurísticas Jakob Nielsen.
- Diseño de interacción de Bruce Tognazzini.
- Tendencias.
- Procesos de un proyecto digital.
DISEÑO VISUAL.
- Primeros pasos en Sketch, Figma y XD.
- Diseño responsive, grids y layout.
- Diseño atómico.
- Leyes del diseño de interfaces.
- Moodboards.
- Guías de estilo, iconografía.
- Wireframes de alta fidelidad.
- Diseño para smart watchs.
- Arquitectura de la información.
- Landing pages.
- Primeros pasos en Principle.
- Menús animados.
- Navegación con scroll y paginación.
- Explicación Invision.
- Explicación Marvel.
HTML Y CSS.
- Diferencias entre estructura y diseño visual.
- Etiquetas más utilizadas.
- Estructuras básicas.
- Vinculaciones CSS y Google fonts.
- Trabajar con id y class.
- Trabajar con el inspector de elementos.
WORDPRESS.
- ¿Qué es un CMS?.
- Uso de servidor local.
- Instalación wordpress en local.
- Explicación panel back end.
- Explicación del front end.
- Utilización de plugins y temas.
- Uso servidor real.
- Migración de local a servidor real.
VIDA LABORAL.
- Cómo afrontar el mundo laboral.