Lleva tu carrera a otro nivel por menos de 1 dólar al día.

UX/UI Designer

UX/UI Designer

Las empresas reclaman perfiles que conozcan el proceso completo de diseño: mejora tu empleabilidad formándote en UX/UI.

Acelera tu carrera profesional

Conviértete en UX/UI Designer

¡Te damos la bienvenida! Esta ruta de aprendizaje forma parte de la Escuela de Producto de Platzi.

Aquí conocerás cómo convertirte en UX/UI Designer desde cero.

Banner_UXUI-Designer.png

Si es la primera vez que te acercas al mundo del diseño de productos digitales y no tienes conocimientos básicos, te recomendamos que comiences explorando nuestra ruta de Iniciación al Diseño de Productos Digitales.
Si quieres comenzar a adentrarte en el mundo de los Productos Digitales (sitios webs, aplicaciones y toda clase de dispositivos digitales), ¡esta ruta es para ti!
Pero si ya tienes conocimiento en diseño de productos digitales, te recomendamos que explores rutas más avanzadas en nuestra Escuela de Producto.

¿Qué hace un UX/UI Designer?

El diseño UX/UI ha convertido en uno de los campos con mayor demanda en la actualidad por entidades públicas y privadas que han adoptado los procesos de diseño para crear herramientas que acerquen a la ciudadanía con las políticas internas y motivar el crecimiento de los ecosistemas de innovación, que a su vez impulsan el crecimiento de sus economías.

Algunas de las funciones de un UX/UI Designer son:

¿Qué debe saber un UX/UI Designer?

  • Desplegar las diferentes metodologías de diseño, desde Design Thinking hasta Design Sprint, pasando por Lean UX y metodologías ágiles.
  • Entender perfectamente el comportamiento de los usuarios. Para ello debe ser capaz de realizar e interpretar User Personas, Customer Journey Maps, y mapas de empatía.
  • Tomar decisiones de diseño en base a procesos de investigación.
  • Elaborar y desarrollar la Arquitectura de la Información del producto y sus patrones de navegación.
  • Crear bocetos y desarrollarlos con una fidelidad cada vez mayor.
  • Adaptar la identidad visual de la interfaz al sistema de diseño del producto.
  • Diseñar productos digitales que cumplan los principios de usabilidad y diseño inclusivo.

Además de todo ello, hay algunas herramientas que debe manejar a la perfección, como son:

  • Herramientas para el diseño conceptual, como Whimsical.
  • Herramientas de diseño visual, como Figma o Sketch.

¿Cómo puedo conectarme con la comunidad?

Obtén la oportunidad de conectarte con tus compañeros y compañeras en nuestra comunidad en Discord. Esta herramienta te permitirá participar en salas de aprendizaje y en conversaciones en tiempo real, y podrás enterarte de los próximos eventos como Live Classes, retos y Voice-chats. Tenemos un canal exclusivo para la Escuela de Producto.

En Discord podrás interactuar con otros y otras estudiantes para mejorar tu experiencia de aprendizaje, hacer networking, recibir y dar feedback sobre proyectos, ejercicios o dudas que necesites aclarar.

¡Únete ahora a nuestra comunidad en Discord!

¿Cómo empezar a aprender Diseño UX/UI?

Las cinco primeras cosas que necesitarás aprender son:

  • Metodologías de Diseño
  • Arquitectura de la Información
  • Principios de usabilidad
  • Diseño responsive
  • Diseño conceptual y visual

Para comenzar con esto solo sigue el orden de la ruta de aprendizaje que encuentras a tu izquierda.

Una vez lo hayas hecho, puedes crear tu portafolio. Puedes ver cómo crear uno para que te contraten en el siguiente vídeo:

Muy bien, manos a la obra. ¡Te deseamos mucho éxito en tu aprendizaje como UX/UI Designer! 💻🙌

Glosario

Glosario

Accesibilidad: Cuando se habla de accesibilidad en referencia a sitios web, significa cuán fácil o difícil es acceder al contenido para personas con discapacidades. Por ejemplo, lo fácil que es para los usuarios daltónicos diferenciar los enlaces del texto normal.

Usabilidad: Se refiere a la facilidad de uso de un sitio web para todos los visitantes, no solo para las personas discapacitadas. Por ejemplo, un sitio que requiere un registro prolongado para ver su contenido tiene mala usabilidad.

Espacio en blanco: Área de un diseño (no necesariamente blanca) que se deja intencionalmente en blanco para fines estéticos.

Bitmap: Forma gráfica que se guarda como pixeles individuales, lo que significa que tienen una resolución establecida y no se pueden ampliar o reducir sin perder su nitidez. Los archivos de Adobe Photoshop son archivos de mapa de bits. JPG, GIF, PNG.

RGB: De sus siglas en inglés Red, Green, Blue. Es el modelo de color que utilizan los medios electrónicos para mostrar gráficos. Comúnmente se usa para describir el "modo" en el que se guarda una imagen. Las imágenes que se usan para visualización electrónica deben ser RGB.

CMYK: De sus siglas en inglés Cyan, Magenta, Yellow, Black. Es el modelo de color utilizado en la impresión tradicional en 4 colores. El realismo fotográfico se puede lograr imprimiendo solo estos 4 colores. Las imágenes que se están usando para imprimir en papel deben estar en CMYK.

Above the Fold: Esto viene de la industria periodística donde el espacio en la parte superior de la primera página es mucho más valioso que el espacio debajo de él. En la web, el contenido que es visible sin desplazamiento se conoce como above the fold y también es más valioso.

Composición: Es la organización de los elementos en un espacio en donde prima la jerarquía y la armonía visual. La composición se aplica según el contexto en los elementos de diseño: textos e imágenes en un libro, espacios y formas en una ilustración, o contenidos en una página web.

Mapas de bits: Es una imagen construida a partir de una retícula de pixeles, los cuales contienen la información de color. La resolución de la imagen está determinada por el alto y ancho del formato. Los formatos más comunes para una imagen de mapa de bits o bitmap son tiff, jpg y gif.

Perfil de color: Es un documento en el que se incluye un espacio de color, que es el conjunto de colores que puede representar un dispositivo. Los perfiles de color más comunes son RBG, un modelo de color aditivo utilizado en pantallas; y CMYK, un modelo sustractivo que se utiliza en impresión.

Paleta de color: Es la selección de un conjunto de colores que pueden tener alguna relación cromática: pueden ser complementarios, análogos, adyacentes, entre otros. Una paleta se puede relacionar con algún concepto según la psicología de color, un campo muy utilizado en branding y publicidad.

Patrones de diseño: Son elementos reusables que ayudan a los diseñadores a crear soluciones viables para problemas de usabilidad comunes. Algunos de estos resultaron tan eficientes que se volvieron guías que incorporan las mejores prácticas de diseño

Sketch ( Sketch App ): Herramienta de edición de gráficos vectoriales especializado en la creación interfaces

Prototipo: Representación funcional de un producto digital con el propósito de poder testearlo antes de pasar a la etapa de desarrollo

Adobe XD: Programa vectorial de Creative Cloud especializado en la creación de interfaces, wireframes y prototipos

Interacción: Acción recíproca entre dos o más partes donde una parte ejerce una acción y la otra ofrece una reacción, desencadenando nuevos ciclos de acción y reacción.

Diseño Centrado en el Usuario (UCD): Es una filosofía del diseño que busca abordar los procesos incluyendo al usuario en todas las etapas de desarrollo con el fin de resolver sus necesidades concretas.

Iteración: Proceso de mejora a través del ciclo de prueba y aprendizaje.

Dirección de arte: Es transformar un contenido que se quiere comunicar y enfocarlo de la manera correcta en su expresión como imagen y teniendo en cuenta su contexto, su finalidad, su expresión e intensión.

Proyecto: Es un conjunto de actividades interrelacionadas y coordinadas para crear un producto, servicio o resultado específico.

Equipo de trabajo: Son las personas implicadas en el desarrollo del proyecto de diseño. Puede ser presencial o remoto y puede incluir a empresas, proveedores o consultores externos y freelancers.

Empatía: Es la capacidad de percibir, comprender y compartir lo que el otro siente, preocupándose por ello.

Orden: Es la organización de elementos dentro de una estructura. En el desarrollo de un proyecto en la distribución de actividades, tareas y prioridades para la consecución del objetivo.

Eficacia: Es cumplir la función para la que fue designado un objeto.

Eficacia: Es cumplir la función para la que fue designado un objeto.

Eficiencia: Es cumplir la función para la que fue designado, en el menor tiempo posible y con el menor consumo de recursos.

Mapa mental: Diagrama visual para organizar información que ayuda a establecer conexiones entre varias ideas para encontrar rutas y soluciones alternas.

Dirección creativa: Define el rumbo que debe seguir el proyecto.

Entregable: Todo archivo, dummy, prototipo, manual, evidencia o documentación necesaria para, o comprometida en la implementación del proyecto.

Quiénes imparten los cursos

Juani Ruiz Echazú

Juani Ruiz Echazú

UX Director en Aerolab

@heyimjuani
Verónica Traynor

Verónica Traynor

Cofundadora y directora en Puntolab

@verotraynor
Emiro Arrieta

Emiro Arrieta

Design Director Profesional en Independiente

@EmiroArrietag
Misael León

Misael León

Product Designer en Nearsoft

@misaello
María Isabel Murillo

María Isabel Murillo

CEO and Partner at Usaria en Usaria

@MariaIsabelMC
Rulótico González

Rulótico González

Co Founder en Sable Digital Studio

@rulotico
Wilson Sánchez

Wilson Sánchez

User Experience Lead en Laureate Education

@daywalkerhn
Paula Andrea Gaviria

Paula Andrea Gaviria

Socia, directora estratégica y comercial. Consultora y docente. en Digimarketing

@pgaviriaa
Tomás Nicolini

Tomás Nicolini

UX Designer en Telefónica

@tomasnic
Daniel Torres Burriel

Daniel Torres Burriel

Managing Director en Torresburriel Estudio

@torresburriel
Silvia Marín

Silvia Marín

Co-fundadora en Anagrama

@silviamarin
Juliana Gómez

Juliana Gómez

Frontend Engineer en

@gmzjuliana
Isis García

Isis García

Directora de Platzi Live en Platzi

@isisconvelo
Santiago Camargo

Santiago Camargo

Lead Product Designer en Apunto

@santiecam
Santiago Peña

Santiago Peña

Senior Innovator Consultant en EY

@santpp85
Raquel Suarez Net

Raquel Suarez Net

en

Emiliano Cosenza

Emiliano Cosenza

en Founder de Pannonica y BeBot

Pilar Delgado

Pilar Delgado

UX Specialist en Torresburriel Estudio

Ricardo Mendi

Ricardo Mendi

UX Specialist en Torresburriel Estudio

meri Fernández

meri Fernández

UX Lead en Independiente

@@meri_minimeri
Cinta Vergés

Cinta Vergés

Training Assistant en Torresburriel Estudio

@@vergesdc
Marta Monterde Alonso

Marta Monterde Alonso

UX Specialist en Torresburriel Estudio

@@martamonterd
Elena Madrigal

Elena Madrigal

Emprendedora en Independiente

@@elenayuscula
Julio Servan

Julio Servan

Senior Product Designer en Kustomer

@@julioservan

Rutas relacionadas para complementar tu aprendizaje

Iniciación al Diseño de Productos Digitales

Iniciación al Diseño de Productos Digitales

Inicia en el mundo del diseño para webs, aplicaciones, interfaces de voz, chatbots, Web3 y todo lo relacionado con el mundo digital.
Product Designer

Product Designer

Adquiere una visión global del proceso de diseño y la colaboración con negocio formándote como Product Designer.
Graphic Designer

Graphic Designer

Domina las herramientas y habilidades para triunfar como diseñador gráfico. Comunica visualmente a través de diseños publicitarios, ilustraciones y branding.