Crea tu cuenta gratis para acceder a actividades gratuitas o compra el curso para acceso completo.
Diseño Web y UX/UI de sitios Webs con figma
En nuestro workshop, Los estudiantes aprenderán a crear **prototipos reales** de sitios web y/o aplicaciones móviles según sus propios proyectos utilizando **Figma**, una de las herramientas más usadas por diseñadores profesionales.
CONTENIDO DEL CURSO
1 Fundamentos de UX y Experiencia de Usuario
GRATIS
Fundamentos de UX y Experiencia de Usuario
El Pincel del Sage — Intro Diseño Web
Guía técnica — Fundamentos de UX y Experiencia de Usuario
Principios de UX: usabilidad y accesibilidad
User research: entrevistas y encuestas
Define el usuario de tu app en 1 página
Heurísticas de Nielsen: los 10 principios
Quiz — Fundamentos UX
2 Figma: Herramienta Profesional de Diseño
Figma: Herramienta Profesional de Diseño
Figma: frames, layers y auto layout
Guía técnica — Figma: Herramienta Profesional de Diseño
Componentes, variantes y estilos en Figma
Crea un botón con 4 estados en Figma
Tipografía y sistemas de color en Figma
Evaluación: recrea este UI en Figma
Quiz — Figma Fundamentos
3 Wireframes, Flujos y Prototipado
Wireframes, Flujos y Prototipado
UX vs UI: la diferencia que importa
Wireframing: lo/mid/hi fidelity
Guía técnica — Wireframes, Flujos y Prototipado
User flows y arquitectura de información
Prototipo interactivo: onboarding de 3 pasos
Analiza el flujo de Airbnb o Duolingo
Mini-Proyecto 1: Wireframes de app mobile
Quiz — Wireframes y Prototipado
4 Design Systems y Componentes
Design Systems y Componentes
Tokens de diseño: color, tipografía, spacing
Guía técnica — Design Systems y Componentes
Atomic design: átomos, moléculas, organismos
Crea 10 componentes en Figma con variantes
¿Este componente es átomo o molécula?
Evaluación: documenta un design system básico
Quiz — Design Systems
5 Proyecto Final: App Diseñada con Figma
Proyecto Final: App Diseñada con Figma
Handoff: de Figma al desarrollador
Guía técnica — Proyecto Final: App Diseñada con Figma
Accesibilidad en diseño: contraste y tamaños
Checklist: antes de entregar el diseño
Mini-Proyecto 3: Diseño de producto SaaS
Mini-Proyecto 4: Rediseño de app real
Quiz Final — Diseño Web UX/UI
Mini-Proyecto 2: Sistema de componentes completo
QUÉ INCLUYE
PRECIO DEL CURSO
Pago único · Nivel Básico