Domina el Diseño Web y Figma.

Conviértete en un experto en Figma y diseño web con tácticas líderes en la industria que te permitirán crear proyectos de alto nivel con seguridad y de forma profesional.

Diseña más rápido.

Diseña mejor.

+20 horas de videos

Accede a más de 70 lecciones enfocadas a la práctica para mejorar tus habilidades como diseñador.

Diseño de 0 a 100

Desde las bases del diseño web a crear prototipos interactivos y exportarlos en la tecnología que prefieras, de principiante a experto.

7 Recursos

Descárgate los archivos de Figma que te ayudarán a trabajar de forma más eficiente y profesional y agilizar tus flujos de trabajo.

Comunidad privada

Accede a la comunidad exclusiva de WhatsApp donde responderemos dudas y preguntas mientras te rodeas de otros diseñadores como tú

Contenido teórico

Aprende los pilares del diseño web.

Diseñar bonito está bien, pero en el diseño web la estética no lo es todo. No es un arte, es una ciencia. Solo dominando sus fundamentos podrás crear proyectos funcionales, efectivos, con sentido lógico y con un propósito claro.

Guía de estilo

Aplícalo en todos tus proyectos .

Creando una guía de estilo o un design system definiremos colores, tipografías, estilos o variables y nuestros componentes para poder usarlos en nuestros proyecto de manera práctica y eficiente.

Proyecto web

Ejemplos prácticos.

El framework exacto con todos los pasos que tienes que seguir para tu proyecto profesional. Una guía y una plantilla para cada uno de tus proyectos a partir de ahora.

Descargables

Accede a los documentos que mejorarán tu productividad.

Los documentos que descargarás en este curso harán tu trabajo más fácil y organizado. Tendrás acceso a: Documento de trabajo, Guía de estilo, Documento de wireframe, Plantillas de diseño, Recursos, Documento de interacciones y Documento de animaciones.

Proyecto web

Aprende a gestionar un proyecto web de manera profesional, desde la planificación hasta la entrega final.

Para lograr proyectos consistentes y funcionales, es clave seguir fases previas y posteriores al diseño. En este curso, dominarás cada etapa del proceso, creando productos sólidos y afrontando cualquier proyecto con confianza y metodología profesional.

Style Guide

Crea una guía de estilo para cada proyecto.

Un design system o guía de estilo no solo garantiza la coherencia en tus proyectos, sino que también optimiza tu flujo de trabajo. Al dominar esta materia, podrás diseñar con mayor rapidez, precisión y confianza, elevando la calidad y eficiencia de tus proyectos.

Colores
Aprenderás a definir los colores para tu proyecto, sus sombras sus luces y mucho mas.
Tipografía

Crea la jerarquía tipográfica ideal para tu proyecto y úsala de forma simple.

Grids

Define cuál será la estructura de tu prototipo y aprende a diseñar con grids.

Iconos

Setea tu propio set de iconos ideal para cada proyecto al que te enfrentes.

Sombras

Define las sombras una sola vez, y no deberás volver a pensar en ellas.

Botones

Crea tu set de botones, sus interacciones y variantes, aplícalos a todo tu proyecto.

Inputs

Aprende a crear inputs que te funcionarán para cualquier proyecto web o app.

Nombre
Oscar RGB
Estilos

Si no trabajas con estilos estás trabajando el doble, crea tus estilos y mejora tu flujo de trabajo.

Variables

Las variables son vitales en tus procesos, aprenderemos como funcionan y para que sirven.

Temario curso

Pongámoslo todo en práctica

Todo esto es lo que vas a aprender, lecciones específicas para profundizar en cada punto. Exploraremos cada etapa clave para crear un proyecto web desde cero hasta su finalización.

1. Introducción
  • 1.1 Presentación 01:52
  • 1.2 ¿Cómo funciona el curso? 37:23
  • 2.1 Introducción 01:52
  • 2.2 El color 37:23
  • 2.3 Tipografía 38:08
  • 2.4 Formas 10:49
  • 2.5 Imágenes 07:11
  • 3.1 Introducción 00:27
  • 3.2 Atomic design 05:37
  • 3.3 Botones 17:46
  • 3.4 Iconos 30:09
  • 3.5 Espaciado 20:45
  • 4.1 Introducción 00:40
  • 4.2 ¿Qué es Figma 10:24
  • 4.3 Dashboard 02:29
  • 4.4 Figjam 11:22
  • 4.5 Figma Slides 03:11
  • 4.6 Figma Design 10:49
  • 4.7 Autolayout
    • 4.7.1 Teoría del Autolayout 01:25
    • 4.7.2 Autolayout Simple 11:29
    • 4.7.3 Fill, Hug, Fixed 14:38
    • 4.7.4 Canvas Stacking 03:07
    • 4.7.5 Constrains 04:47
    • 4.7.6 Posición Absoluta 02:51
    • 4.7.7 Máximos y mínimos 10:57
    • 4.7.8 El shortcut mágico 02:00
    00:52
  • 4.8 Interacciones y animación 09:10
  • 4.9 IA Figma
    • 4.9.1 IA Generativa 17:07
    00:39
  • 5.1 Introducción 00:38
  • 5.2 Setear documento 03:18
  • 5.3 Resumen proyecto 02:24
  • 5.4 Investigación
    • 5.4.1 El Brief 20:31
    • 5.4.2 La competencia 05:05
    • 5.4.3 Los usuarios 07:37
    • 5.4.4 El documento 02:50
    01:45
  • 5.5 Sitemap
    • 5.5.1 Teoría 04:17
    • 5.5.2 Crear el Sitemap 12:35
    00:20
  • 5.6 Wireframes
    • 5.6.1 Teoría 11:05
    • 5.6.2 Wireframes a mano 17:24
    • 5.6.3 Preparación para Wireframes 12:41
    • 5.6.4 Wireframes a ordenador 00:39
    • 5.6.5 Wireframes en media 36:39
    • 5.6.6 Wireframes con I.A 03:21
    • 5.6.7 Plugins para wireframes 03:52
    00:59
  • 6.1 Introducción 02:05
  • 6.2 Estructura 03:09
  • 6.3 Colores
    • 6.3.1 Inspiración 04:00
    • 6.3.2 Estilos 17:55
    • 6.3.3 Variables 05:44
    04:06
  • 6.4 Tipografía
    • 6.4.1 Estilos 14:44
    • 6.4.2 Variables 08:26
    01:04
  • 6.5 Grids
    • 6.5.1 Crear grids 06:13
    00:20
  • 6.6 Iconos
    • 6.6.1 Setear preferencias 03:10
    • 6.6.2 Trabajar con vectores en Figma 11:57
    • 6.6.3 Crear iconos 15:07
    • 6.6.4 Set de iconos 07:54
    00:49
  • 6.7 Sombras 05:22
  • 6.8 Logotipo 05:51
  • 6.9 Botones
    • 6.9.1 Creando componentes botones 30:27
    00:49
  • 6.10 Inputs
    • 6.10.1 Creando componentes inputs 28:33
    00:41
  • 6.11 Style Guide con I.A 19:04
  • 7.1 Setear Style Guide
    • 7.1.1 Colores 14:07
    • 7.1.2 Introducción tipografía 00:29
    • 7.1.3 Tipografía 10:54
    • 7.1.4 Componentes 04:23
    00:58
  • 7.2 Diseño web
    • 7.2.1 Diseño home en mobile 38:41
    • 7.2.2 Diseño home Desktop y tablet 31:54
    • 7.2.3 Diseño páginas 01:02:54
    • 7.2.4 Páginas contacto 46:53
    00:54
  • 7.3 Design Feedback
    • 7.3.1 ¿Cómo funciona? 07:29
    00:45
  • 7.4 Responsive Design
    • 7.4.1 Diseño responsive 38:46
    01:32
  • 7.5 Prototipo
    • 7.5.1 Botones e inputs 11:49
    • 7.5.2 Acordeón 04:59
    • 7.5.3 Slider 23:16
    • 7.5.4 Texto animado 07:06
    • 7.5.5 Navegación 05:43
    • 7.5.6 Pop ups 10:28
    • 7.5.7 Menú mobile 19:53
    00:31
  • 7.6 Anotaciones
    • 7.6.1 Crear Anotaciones 08:32
    00:49
  • 8.1 Animaciones
    • 8.1.1 Animaciones simples 15:32
    • 8.1.2 Botones e inputs 05:05
    • 8.1.3 Parallax 07:27
    • 8.1.4 Animación de carga 06:26
    • 8.1.5 Animación tragaperras 15:22
    • 8.1.6 Animación Ascensor 10:32
    01:05
  • 8.2 Interacciones
    • 8.2.1 Switch 07:12
    • 8.2.2 Calendario 07:12
    • 8.2.3 Checkbox 06:30
    • 8.2.4 Carrito e-commerce 09:41
    • 8.2.5 Inputs 11:22
  • 8.3 De Figma a código
    • 8.3.1 Plugin de Figma a código 17:37
    00:56
  • 8.4 De Figma a Framer
    • 8.4.1 Plugin de Figma a Framer 08:21
    01:02
  • 8.5 De Figma a WordPress
    • 8.5.1 Plugin de Figma a WordPress 12:55
    02:22
  • 8.6 De Figma a Webflow
    • 8.6.1 Plugin de Figma a Webflow 12:01
  • 8.7 Recursos
    • 8.7.1 Listado de los mejores recursos 20:31
    10:49
+20 horas de formación

Aprende las bases del diseño web y crea tu propio proyecto con ejercicios prácticos.

Oscar RGB - formacion Oscar RGB - formacion Oscar RGB - formacion Oscar RGB - formacion Oscar RGB - formacion
Oscar RGB - formacion Oscar RGB - formacion Oscar RGB - formacion Oscar RGB - formacion Oscar RGB - formacion
7 documentos descargables

Descarga y utiliza los documentos que te ayudarán a enfrentarte a cualquier proyecto web de forma profesional.

Diseño web de principio a fin

Sigue todas las fases del diseño web, desde la investigación hasta exportar tu prototipo a la tecnología que quieras.

 
Comunidad de WhatsApp privado

Accede a la comunidad donde podrás resolver tus dudas y compartir tus progresos con otros profesionales.

Certificado

Desarrolla las habilidades que necesitas con un curso práctico de inmersión profunda y consigue tu certificado al terminarlo.

Profesor

Soy OscarRGB, profesional del UX con más de 10 años de experiencia. He trabajado en más de 100 proyectos para marcas como SEAT, Binter y OLX. Además, soy profesor de UX en el máster de EAE Business School. También comparto contenido relacionado con UX en mis redes sociales donde tengo más de 100.000 seguidores.

Precio

Aprovecha esta oportunidad única: durante la primera semana de lanzamiento, podrás acceder con un descuento exclusivo. ¡No lo dejes pasar!

Precio lanzamiento
250€
Curso completo Figma y diseño web
250€
Descuento (hasta el 20 Febrero)
-70€
Total
180€

Algunas preguntas frecuentes

Aquí estoy para solventar cualquier duda que tengas sobre el curso, si tienes alguna otra duda, puedes preguntarme por email.

¿A quien va dirigido el curso?

Este curso ca dirigido a cualquier persona que se dedique al diseño web o quiera dedicarse a él. Personas que qiueran profesionalizar sus servicios y dominar Figma para crear proyectos web de forma profesional.

Este curso no es en directo, pensado para que puedas adaptarlo a tus tiempos y dedicación. Dispondrás de todos los documentos y todo el contenido para que lo hagas a tu ritmo. Aún así haremos directos respondiendo dudas que surjan en nuestra comunidad privada de Whatsapp.

No te preocupes, aunque Figma de pago nos dará una serie de opciones que no tendremos si usamos el gratuito, podremos hacer todo el curso sin problema, además gracias a los documentos descargables casi no notarás la diferencia al hacer el curso. 

Sí, con la compra del curso tendrás acceso a todos los documentos desagradables sin ningún pago addicional.

Este curso consta con más de 20 horas de video, pero realizarlo te llevará más tiempo, pues gran parte del contenido es contenido práctico.
Así que depende de tus aptitudes y de la entrega que pongas al realizarlo podrás terminarlo de forma más rápida o más lenta.

Pues aunque serán de ayuda para asimilar todo de forma más rápida, este curso está pensado para que puedas comenzarlo de 0. Entenderemos las bases del diseño web y todo lo que puede ofrecernos la herramienta Figma.

Podrás acceder a la comunidad privada de Whatsapp de forma instantánea al comprar tu curso. El acceso a esta comunidad es de por vida y allí podrás compartir tus conocimientos y dudas con otros alumnos además de disfrutar de contenido exclusivo y resolver todas tus dudas.

Al ser un curso abierto en el que podrás descargarte todo el contenido una vez estés dentro no podremos hacer devoluciones, así que pregúntame cualquier duda que tengas antes de comprar. SI ha habido un erro de pago o has comprado más de un curso sin querer contáctame para que pueda proceder. ala devolución.