Conviértete en un profesional con habilidades en UX/UI y Front End. Aprende desde crear la interfaz hasta la programación de productos digitales. Aumenta tus oportunidades laborales en una de las profesiones más demandadas del mercado y destaca como Diseñador Full Stack.

Curso online de

Profesión online: Diseñador Full Stack

Inscríbete al curso
Inicio:
Quedan:
...
14 lugares
Formación completa
12 mensualidades de
$ 1,337 MXN
16 meses con más de 62 horas de videolecciones
Online
Estudia a tu ritmo, donde quieras y cuando quieras
Aprende con práctica
Actividades prácticas y feedback personalizado
Proyecto profesional
Diseña un mini sitio web y una app desde cero
(a meses sin intereses con tarjeta de crédito)
hasta 5 de janeiro
-40%

¿Por qué aprender Diseño Full Stack?

Los diseñadores y desarrolladores Front End de UX/UI se encuentran entre las 10 profesiones digitales más demandadas en la actualidad.
ponto
Profesión en crecimiento
Es la profesión más completa para desarrolladores, cubriendo desde el concepto, la investigación, los wireframes, hasta la interfaz de usuario y los diseños finales.
ponto
Profesión bien valorada
El diseñador Full Stack es el profesional de diseño web más completo. Además de dominar todas las etapas del desarrollo de aplicaciones digitales, trabaja de forma independiente tanto en UX como en UI y Front End para crecer en el mercado laboral.
ponto
Sueldos altos
Desarrollador Front End SR
$949,608 /año
Desarrollador Front End MID
$657,888 /año
Diseñador UX/UI
$433,488 /año

¿Cuánto gana un Diseñador Full Stack?

*Salario en la CDMX según Glassdoor

¿A quién va dirigido este curso?

Principiantes en diseño UX/UI
Diseñadores y Creativos
Si quieres profundizar en los conceptos de interfaz y experiencia de usuario para crear maquetaciones atractivas y funcionales, este curso es para ti. Aprende técnicas de diseño gráfico que te permitirán crear prototipos y armar aplicaciones desde cero para ingresar al campo laboral.
Para profesionales con cierta experiencia que buscan renovar y enriquecer sus conocimientos, cambiar de área o crecer en la empresa que ya operan. Profundiza en UX/UI, una de las áreas más valoradas en el mercado actual, y estarás preparado para trabajar en equipos de diseño de productos en bancos, empresas de TI, agencias de publicidad y más.
Diseñadores UX y UI
Además del diseño, aprende a usar la interfaz para garantizar la mejor experiencia de usuario. Práctica tus habilidades y descubre cómo aplicarlas a la programación en soluciones web para crecer en el diseño full stack.
garota no trabalho
janelas do computador
Diseñadores UX y UI
Aprende a identificar las necesidades de los usuarios, diseñar el flujo de navegación y analizar las investigaciones de comportamiento para garantizar los mejores resultados
Adapta proyectos para múltiples plataformas utilizando diseño receptivo, flujos de navegación, wireframes, buenas prácticas de texto y microinteracciones
Descubre la importancia del refinamiento en el proceso de diseño y cuáles son los principales detalles que garantizan la calidad de la entrega
Conoce las bases del diseño de interfaces, descubre cómo mejorar la usabilidad en plataformas web/móviles y realiza pruebas para validar la experiencia de usuario
Necesidades del usuario
Prototipado y microinteracciones
Diseño perfecto de píxeles
Usabilidad y diseño responsivo
Domina la plataforma más avanzada para crear productos digitales, construir prototipos navegables, estandarizar y optimizar proyectos, además de la facilidad de testear con los usuarios
Aprende a usar las herramientas para simplificar la navegación y habilitarlas en tus interfaces para que sean funcionales e interactivas
JavaScript, JQuery y React
Figma
certificado
ponto
ponto
ponto
ponto
ponto
ponto
Globo

¿Qué aprenderás?

Como los proyectos de Diseño UX/UI son extensos, te enseñaremos a organizar prioridades y separar entregas en etapas independientes, utilizando la rutina de trabajo ágil
Metodologías ágiles
Trabaja con HTML, CSS y frameworks como los lenguajes Bootstrap para crear interfaces más inteligentes y receptivas
Utiliza las últimas tecnologías de integración de API y SEO (optimización de motores de búsqueda)
API y SEO
Desarrollo web
ponto
ponto
ponto
Recibe el certificado de EBAC al finalizar el curso
Certificado de EBAC

Profesores

izquierda
derecha
Head de UX
Actualmente es Head de UX en Cocolab, donde diseña exhibiciones, retail y experiencias interactivas para museos, participó en Frida Inmersiva, la primera experiencia inmersiva hecha y producida en México . Trabajó en Luidia, un laboratorio de innovación en Estados Unidos, donde desarrolló ideas y prototipos para nuevos productos.
Alejandra Anton Honorato
María de Buen
Diseñadora Industrial, Maestra en Diseño Estratégico e Innovación por la Universidad Iberoamericana y fundadora de BluePixel, una de las primeras agencias de UX/UI en México.
Imparte cursos de diseño UX/UI, innovación y liderazgo.
Es especialista en metodologías como Design Thinking, Lean Startup, toolkits de innovación y diseño estratégico.
CEO de BluePixel
Paulina Solis
Diseñadora de Productos con más de 8 años de experiencia en la industria digital, actualmente forma parte del equipo de Producto en Edmodo, California, Estados Unidos.
Ha trabajado en industrias de social games, e-commerce, banca, incluyendo proyectos para Google, Mastercard, Konfio y HSBC en USA, Canadá y México.
Product Designer en Edmodo
Gerardo Vidal
Cuenta con 13 años de experiencia liderando equipos. Gerardo ha colaborado en proyectos para el Gobierno mexicano, la Embajada británica en México, sin dejar atrás pymes, startups y artistas digitales. Entre sus proyectos encontramos la web de la ONU, Ecosistema Artificial Sonoro, Derechos Humanos, Forensic Landscapes y Santos Diableros.
Diseñador Gráfico e ilustrador
Josué Manuel López Lezama
Josué tiene experiencia en el desarrollo front end de 8 años, ha trabajado para empresas líderes como AT&T, Telmex y Mabe. Ha desarrollado diversos proyectos, forma parte de todo el proceso, la concepción del estilo de diseño, UX/UI y el desarrollo web frontend. Actualmente labora en Cornershop by Uber donde se desempeña como Front end Engineer ayudando a mantener y crecer la web app usada por los clientes.
Frontend Engineer
Logo Cocolab
Logo Luidia
Logotipo BBVA
Logo Pepsico
Logo Bimbo
Logo Office Depot
Logo Google
Logotipo
Logotipo
Logo Social2
Logotipo
Logo MasterCard
Logo Gobjerno de Mexico
Logo ONU Mexico
Logotipo Naciones Unidas
Logo Ecosistema Artificial Sonoro
Logo FL
Logo Puntal
Logotipo Telmex
Logotipo mabe
Logotipo Cornershop by Uber
Logotipo AT&T
La profesión online de Diseñador Full Stack se divide en 62 módulos.
Tendrás acceso ilimitado para que estudies cuando quieras y donde quieras.

Contenido del curso

Parte 1. Diseño de producto
Conoce las actividades relacionadas con un diseñador full stack enfocado en la creación de productos digitales, las habilidades que necesita, los distintos modelos de negocio, dónde podemos crear productos digitales y las características de un MVP.

  • Fundamentos del diseño de producto
  • Rol y funciones de un diseñador de producto
  • Modelos de negocio
  • Qué es un MVP (Producto Mínimo Viable)
  • Lean Startup
  • Proceso para diseñar una plataforma digital

Actividades:
  • Escribir las actividades de un Product Designer.
  • Analizar los modelos de negocio que revisamos en el módulo y elegir uno para desarrollar una página web y una app.
  • Hacer un análisis de competencia, benchmark y el posicionamiento de la compañía con el modelo de negocio seleccionado e incluir una investigación de mercado y un FODA.
  • Definir el MVP de tu proyecto.
Parte 2. Diseño UX/ UI
Descubre las diferencias entre UX y UI, algunas metodologías que puedes aplicar para crear productos centrados en el usuario y cuál es el proceso para la creación de productos digitales.

  • Introducción a UX/UI
  • Fundamentos y principios de UX/UI
  • Metodologías de diseño
  • Design Thinking
  • Metodología Lean
  • Metodología Agile
  • Proceso de diseño de una plataforma digital

Actividades:
  • Catalogar los conceptos de UX vs. los de UI.
  • Con base en el FODA anterior, plantear un problema que detectaste y con base en las metodologías ágiles, proponer dos soluciones.
  • Duplicar el archivo de la tarea pasada, y describir paso a paso el proceso de tu proyecto, con base en la metodología Lean.
Parte 3. Creatividad e innovación
Aprende a desarrollar tu creatividad, conoce distintas herramientas que podrás implementar en tu proceso creativo y que te ayudarán a tomar las decisiones correctas durante este paso. Por último, te compartiremos algunas métricas para evaluar la viabilidad de las ideas propuestas.

  • Pensamiento creativo
  • Herramientas y generación de ideas
  • Ejercicios que estimulen la creatividad
  • Desarrollo del pensamiento divergente
  • Toma de decisiones en el proceso creativo
  • Tablas de evaluación
  • Rúbricas Harry's Profile
  • Matriz de impacto vs esfuerzo
  • Votación y heatmaps

Actividades:
  • Hacer una lluvia de ideas de posibles soluciones y funcionalidades, para la plataforma que vas a diseñar.
  • Utilizar tres de las herramientas vistas en la lección para generar 20 ideas de nuevas formas para mejorar tu proyecto.
  • Clasificar las ideas del ejercicio anterior en una matriz de impacto vs esfuerzo.
Parte 4. Principios y sistemas de diseño
Identifica los fundamentos de UI y cómo aplicarlos al diseño del producto, aprende a trabajar con Atomic Design, sistemas de diseño, y por último, crea las guías de estilo de tu producto digital.

  • Principios de UI
  • Atomic design y sus componentes
  • Diseño de componentes
  • Sistemas de diseño
  • Guías de estilo

Actividades:
  • Elegir tu idea favorita del ejercicio anterior, haz un storyboard para detallar que pasa antes, durante y después de usar tu aplicación.
  • Estructurar el layout de tu proyecto.
  • Crear los componentes con sus variantes de los elementos de su interfaz.
  • Realizar el sistema de diseño de tu proyecto.
  • Generar y aplicar tu propio sistema de diseño y/o guía de estilos.
Parte 5. Construcción y pruebas de prototipos
Conoce todo lo relacionado al diseño de prototipos y la relevancia que le dará a tu proceso de diseño de productos digitales, las diferentes clases de prototipos que existen y cómo evaluarlos.

  • Prototipado
  • Prototipado en el diseño
  • Prototipos digitales
  • Prototipos de alta y baja fidelidad
  • Evaluación de prototipos

Actividades:
  • Crear el wireframe de baja fidelidad de las pantallas clave de tu app.
  • Complementar los wireframes de tu ejercicio anterior.
  • Redactar las pautas para hacer una prueba de usabilidad para evaluar tu idea del proyecto.
Parte 6. Figma
Entiende las bases para organizar la información y los pasos que seguirá el usuario dentro de la interfaz, desarrolla las primeras vistas de tu proyecto y aprende a diseñar prototipos interactivos con efectos y técnicas avanzadas de micro y macro interacciones para representar cómo será la experiencia final del usuario.

  • Arquitectura de la información en la interfaz digital
  • Diseño visual para la interfaz en Figma
  • Gráficos y elementos en la interfaz
  • Herramientas avanzadas de Figma
  • Creación de prototipos
  • Interacciones avanzadas
  • Documentación y publicación del proyecto

Actividades:
  • Diseñar los wireframes de alta fidelidad del flujo de usuario de tu proyecto.
  • Diseñar la interfaz de la pantalla de inicio.
  • Ajustar la interfaz de la pantalla de inicio y continuar con el resto de pantallas agregando estilos y gráficos.
  • Terminar las pantallas faltantes del flujo del usuario y volver a hacer los elementos de diseño, con Autolayout.
  • Hacer el prototipo interactivo en Figma de tu proyecto.
  • Aplicar micro y macro interacciones en el prototipo.
  • Compartir el resultado final de tu proyecto.
Parte 7. Gestión de un proyecto UX/UI
Aprende a presentar un producto y a evaluar la viabilidad del mismo con el objetivo de mejorarlo y hacer ajustes necesarios sobre la marcha.

  • Hipótesis
  • Retroalimentación de cliente
  • Ajuste de proyecto (metodología, alcance, scope)
  • Ajuste de prototipo
  • Documentación

Actividades:
  • Recolectar feedback de tus usuarios y documentar los hallazgos obtenidos.
  • Realizar los ajustes necesarios a tu producto con base en el feedback obtenido.
Parte 8. Desarrollo Web
Aprende los fundamentos del Front End, los principios básicos de programación en lenguajes HTML 5 y CSS3 y cómo estructurar toda la información para crear una página web.

  • Desarrollo web y frontend
  • Conceptos, etiquetas y estructura de HTML
  • Estilo de elementos individuales y diferentes grupos
  • Frameworks CSS
  • Bootstrap

Actividades:
  • Configurar el VS Code donde el estudiante empezará a trabajar.
  • Maquetar la estructura de un sitio web con texto, imágenes, listas y tablas.
  • Maquetar un sitio web con un formulario y las etiquetas multimedia.
  • Crear un sitio con HTML y CSS.
  • Aplicar los conceptos aprendidos al sitio creado en la lección anterior.
  • Crear una interfaz web con bootstrap.
  • Refactorizar la hoja de estilos usada en la actividad pasada, usando la arquitectura aprendida.
  • Agregar estilos con SASS a archivo HTML.
  • Refactorizar la hoja de estilos usada en la actividad de CSS3 II con las características y los conceptos de SASS.
Parte 9. Programación con JavaScript
Comprende los fundamentos de Javascript y su sintaxis básica con ES6, la construcción de sitios web interactivos a partir de los conceptos de DOM y sus eventos con JavaScript.

  • Javascript
  • Sintaxis básica con ES6
  • Conceptos avanzados de JavaScript
  • Creación de sitios web interactivos
  • Conceptos DOM
  • Eventos con JavaScript

Actividades:
  • Crear con las primeras variables y data structures.
  • Desarrollar las primeras funciones de JS, así como condicionales y loops.
  • Aplicar los conceptos de ES6, crear las primeras classes con el uso de localstorage.
  • Diseñar una mini interfaz interactiva con los eventos de DOM.
Parte 10. Desarrollo Front End Stack
Descubre las funcionalidades básicas y avanzadas de jQuery para el desarrollo web, el SEO, su importancia en el desarrollo web y cómo implementarlo a nivel de código. Aprende a usar Git y GitHub para tener un seguimiento de los cambios realizados y algunas de las herramientas online para desplegar sitios web o web apps.

  • jQuery
  • Accesibilidad en sitios web
  • SEO: Search Engine Optimization
  • Control de Versiones: Git y GitHub
  • Herramientas de despliegue

Actividades:
  • Cambiar las funciones VanillaJS del mini sitio web.
  • Hacer los cambios necesarios en el mini sitio web creado para hacerlo accesible.
  • Ajustar la optimización SEO.
  • Cargar archivos del mini sitio web a un repositorio de GitHub por medio de Git.
  • Desplegar la web app creada en el módulo anterior en GitHub Pages y Netlify.
  • Ejercicio con promesas, programar una promesa que se resuelva o rechace correctamente con las condiciones indicadas.
  • Realizar un mini sitio donde se consulte un API y muestre la información de la respuesta HTTP al dar click en un botón.
Parte 11. React y Redux
Introducción a la librería de Javascript, React y sus funcionalidades para el desarrollo de web apps, Redux Toolkit y los conceptos básicos de Typescript. Fundamentos de TDD y aprende los beneficios de las pruebas para ejecutarlas e integrarlas al desarrollo web.

  • React
  • Tipos de estilos en React
  • Redux
  • Introducción a Typescript
  • TDD: Test Driven Development con Jest

Actividades:
  • Realizar una interfaz básica de React que incluya un formulario y despliegue la información ingresada en los campos.
  • Desarrollar una web app que haga consultas a una API y muestre la información de la respuesta y al dar click en cada elemento muestre sus detalles.
  • Construir una web app de simulación con login e interfaz principal.
  • Refactorizar el CSS de la web app pasada por styled-components.
  • Realizar una web app de tareas por realizar, donde se pueda ingresar por medio de un input y se pueda listar.
  • Refactorizar la app de React II con Redux.
  • Integrar Typescript a la app de React II.
  • Agregar tests con Jest al app de React II.
  • Resolver algunos ejercicios y preguntas de HTML, CSS, Javascript y React que son comunes dentro de una entrevista técnica.

Metodología del curso

Clases en video
Pon tu aprendizaje en práctica
Proyecto final
Tendrás acceso a todo el material del curso en la plataforma digital
El curso tiene actividades que puedes hacer a tu ritmo
Recibe corrección y retroalimentación del tutor sobre tus proyectos
Desarrolla un proyecto profesional para enriquecer tu portafolio
1
2
3
4
Atención personalizada
o simbolo do infinito
Entra al contenido del curso las veces que quieras por tiempo ilimitado
Acceso de por vida

Así se verá tu currículum

$483,768 MXN / año*
Sueldo:
Habilidades principales
Tu nombre
Diseñador Full Stack
*Ref. Glassdoor CDMX
certificado
Certificado de EBAC
Herramientas digitales
Logotipo Miro
Miro
Logotipo Figma
Figma
Logotipo Visual Studio Code
Visual Studio Code
Logotipo React
React
Logotipo Redux
Redux
Logotipo GitHub
GitHub
ponto
Diseño centrado en el usuario
ponto
Creatividad
ponto
Usabilidad
ponto
Accesibilidad
ponto
Investigación de usuarios
Diseño de información de arquitectura
ponto
Prototipos
ponto
Diseño de interfaz
ponto
Diseño de micro interacción
ponto
Habilitación de JavaScript en interfaz
ponto
Animaciones de interfaz
ponto
Desarrollo web
ponto
Los alumnos de EBAC tienen derecho a
1 mes de acceso a la plataforma online de EF
Certificado reconocido internacionalmente al final de cada nivel
16 niveles de inglés incluyendo Business English
Test de nivel de inglés
1 mes de curso de inglés
Gratis
Logotipo English First
Muchos de nuestros alumnos obtienen oportunidades laborales durante el curso o poco tiempo después de terminarlo

Alcanza tus objetivos profesionales con nuestro Centro de Carreras

Orientación en procesos de selección y entrevistas
Ayuda para identificar fortalezas y preferencias profesionales
Información sobre el mercado laboral actual
Asesoría para crear el currículum y perfil en LinkedIn
instrumentos
cronograma
instrumentos
in
Inicio:
Quedan:
...
14 lugares
¿Comenzamos?

Inversión

Precio total con descuento
$ 16,049 MXN
12 mensualidades de
$ 1,337 MXN
a meses sin intereses con tarjeta de crédito
Garantía de reembolso de 7 días
Consigue 40% de descuento por tiempo limitado
Precio normal
$ 26,748 MXN
Logo Kueski
Paga en 4 y 8 quincenas sin tarjeta
Ahorra hasta el 10% adicional pagando con transferencia bancaria, en Oxxo o depósito bancario. ¿Quieres saber más? ¡Contáctanos!
hasta 5 de janeiro
-40%
logo de ebac
La Escuela Británica de Artes Creativas y Tecnología (EBAC) es una institución innovadora de educación superior en Artes Creativas y Tecnología que ofrece cursos y programas de especialización en línea.
graduaciones internacionales validadas por la Universidad de Hertfordshire (Reino Unido)
alumnos estudiando con nuestros cursos online
de los profesores y coordinadores son expertos y referentes en el mercado laboral
empresas colaboran en el desarrollo de cursos, proyectos reales y programas de prácticas
06
100%
+50,000
+40

Preguntas frecuentes

Nunca he trabajado con diseño o programación, ¿podré seguir el curso?
¡Claro! El curso no requiere experiencia previa y aprenderás a desarrollar las habilidades necesarias para ser Diseñador Full Stack. Aprende desde diseño web hasta programación básica. Consigue todos los conocimientos necesarios para potenciar tu currículum o iniciar una prometedora carrera en el campo.
¿Qué programas necesito descargar?
Miro, Figma, Visual Studio Code
¿Hay actividades en grupo?
El curso se desarrolló teniendo en cuenta una evolución individual. Por ello, contamos con un equipo de tutores, para corregir y dar feedback sobre las actividades realizadas por cada alumno. También puedes hablar con otros estudiantes y hacer cualquier pregunta sobre el contenido de las clases al tutor en el Foro.
¿Es posible omitir módulos?
No, al final de cada módulo hay una tarea práctica y una vez que hayas resuelto esta tarea, se te dará acceso al siguiente módulo. Esta metodología es con el fin de motivarte a seguir estudiando y te garantiza completar las el curso.
¿Cómo es la carga de tiempo? ¿Podrá ajustarse a mi trabajo?
La metodología del curso ha sido diseñada para adaptarse a diferentes ritmos de vida. Tendrás tutorías y feedback durante 2 años (24 meses) a partir de la fecha de registro al curso y acceso ilimitado a las clases, así podrás avanzar a tu propio ritmo.
¿Puedo ver los módulos en desorden?
Los módulos se publican semanalmente dependiendo del avance del alumno durante el curso. Esto significa que debes estudiar los módulos en orden y realizar las actividades propuestas por el profesor, antes de pasar al siguiente módulo.
¿Cuántas horas a la semana debería dedicarle al curso?
Te sugerimos que completes un módulo por semana, te llevará dos horas aproximadamente entre asistir a clases y realizar las actividades Pero no te preocupes, este plazo es sólo una sugerencia. Recuerda que puedes avanzar a tu propio ritmo, tomar descansos para integrar el contenido y verlo de nuevo las veces que quieras antes de continuar.
¿A quién puedo preguntar si tengo dudas?
Dentro de la plataforma tendrás un tutor que resolverá tus dudas, comentará tus tareas y te dará consejos. Tendrás la oportunidad de aprender de profesores líderes que son grandes referentes en su sector y aprovechar todos sus conocimientos y habilidades de vida.