Introducción a la Experiencia de Usuario
  • Únete gratis al equipo de Slack UX Héroes
  • ¿Qué es el diseño de experiencia de usuario?
  • ¿Qué no es UX?
  • ¿Qué es UI?
  • ¿A qué llamamos usabilidad?
  • Diferencias entre Sketch, Wireframe, Mockup y Prototipo
  • ¿Porque deberíamos preocuparnos por el diseño?
Conociendo las Técnicas de Análisis
  • Técnicas de Análisis - Focus Group
  • Técnicas de Análisis - Test de Usuario
  • Técnicas de Análisis - Eye Tracking
  • Técnicas de Análisis - Card sorting
  • Técnicas de Análisis - Encuestas
  • Técnicas de Análisis - Evaluación Heurística
  • Técnica de Análisis - Pasos Evaluación Heurística
  • Técnica de Análisis - Test Heurístico
  • Técnicas de Análisis - Estudio de Campo
  • Técnicas de Análisis - Test A/B
  • Técnicas de Análisis - Personas
  • Técnicas de Análisis - Benchmarking
Introducción al proceso de diseño
  • Storytelling
  • Usuarios
  • ¿Qué es Iterar?
  • Gráfico de Garret
Entrevista con el PM de un equipo de Sistemas
  • Introducción ¿Cómo generalmente se conforma el equipo de sistemas?
  • ¿Cuál es el rol del PM?
  • ¿Cuáles serían las tareas del analista funcional?
  • Rol del analista funcional
  • ¿Hay empresas donde no exista el rol de analista funcional?
  • ¿Como trabaja en conjunto el Diseñador UX y el resto del equipo?
  • ¿Cual seria el rol del arquitecto de software?
  • Requerimientos no funcionales y la estructura del software
  • Arquitecto de información y Arquitecto de software
  • Equipo de QC
  • Pruebas del equipo de QC
  • Programadores
  • Tecnologías o lenguajes de programación más utilizados
  • Conclusión
Conociendo HTML, CSS y Herramientas
  • Introducción
  • ¿Qué es cada cosa?
  • HTML Básico
  • Utilización de consola desarrollador Chrome
  • Utilización de documentación
  • Instalación de VSCode
  • Span
  • Estructura HTML
  • Utilización de estilos
  • Modificacion de propiedades
  • Div
  • Identificadores
  • Hoja de estilo en cascada
  • Clases CSS
Maquetado HTML y CSS3
  • Presentación sección
  • ¿Qué vamos a hacer?
  • Estructura de HTML, metas y link
  • Creación de main y footer
  • Utilización de la función "calc"
  • Tamaños máximos y mínimos
  • Texto pie de página
  • Centrado vertical de texto
  • Agregamos la imagen del logo
  • Utilización de padding y box-sizing
  • Precaución para imágenes que no cargan
  • Métodos de posicionamiento, relativo vs absoluto (10)
  • Texto de información
  • Utilización de rgba y opacity
  • Utilizamos border-radius para el info-cont
  • Utilización de gradientes
  • Utilización de margin (variantes)
  • Utilizando atajos de emmet
  • Posicionamos con display inline-block. Truco de font-size
  • Agregamos las estrellas
  • Ordenamos y ajustamos la sección de calificación
  • Agregamos cuadro de mensaje
  • Efecto Hover
  • Efecto cambio de color de estrella al pasar el mouse
  • Agregamos cursor "pointer"
  • Efecto transición
  • Efecto de "presión" sobre acciones
  • Cambio de color en acciones
  • Selectores Child
  • Tipos de selectores
  • Selector de hermanos generales
  • Tags semánticos HTML5
Conceptos y extras
  • Tags HTML5
  • Flexbox
  • Bootstrap
  • Compatibilidad Cross Browser
  • Tags HTML5 Audio y Video
  • HTML5 Canvas y WebGL
  • Javascript
  • JQuery
  • Angular, React y Vue
Introducción a WordPress