• Saltar a la navegación principal
  • Saltar al contenido principal

Juanpol

Vibe Coding y diseño UX y UI con IA

  • Vibe coding
  • Product Design
  • Design system
  • Tutoriales de Figma
  • Blog
  • Newsletter
Figma / Cómo crear un portfolio UX con Figma Sites

Cómo crear un portfolio UX con Figma Sites

En el directo P202 volvimos a trabajar con Figma Sites para crear un Portfolio UX desde cero, un proyecto que estamos construyendo junto a la Comunidad UX Fomo para que cualquiera pueda usarlo, adaptarlo y aprender del proceso.

Cómo diseñar un portfolio con Figma Sites
Publica tus diseños en este portfolio diseñado en Figma Sites

Figma Sites sigue oficialmente en beta, pero la versión 1 del proyecto ya funciona sorprendentemente bien. Todos los componentes y sus variantes que montamos hace unos meses en Figma Design se integraron sin romper nada. Y eso, créeme, ya es un pequeño milagro.

Durante el stream también aproveché para probar la función Grid de Figma Design, que también sigue en beta. La había probado antes, no me convenció y la descarté. Pero esta vez la necesidad de tener un grid 100% responsive me llevó a darle otra oportunidad.

No está perfecta aún, especialmente el comportamiento del height en las cards que usamos dentro de la Home, pero para lo que necesitábamos, cumple con creces.

Y eso me hizo pensar: Figma Sites me da algo que Figma Make todavía no me da.
Estabilidad.

O, al menos, la sensación de que las piezas encajan sin romperse por el camino.

Prototipo y template del portfolio

El template de la Home del Portfolio UX ya está disponible en Figma Sites.

Los componentes y templates del proyecto se pueden duplicar desde Figma Community. (El archivo se actualiza cada semana).

Este viernes volveremos en directo para crear los dos templates que faltan y así liberar la V1 completa del proyecto.

Si estuviste en el P202, sabes lo bien que funcionó todo y lo que significa este avance para la comunidad.

Y si no, te recomiendo ver la repetición: entenderás cómo se conecta todo ,desde el diseño en Figma Design hasta la publicación final en Figma Sites, y cómo puedes adaptar este flujo para tus propios proyectos UX/UI.

¿Tienes feedback o ideas para esta V1?

Déjame tus comentarios vía mail, me encantará leerte.

Aprende sobre UX/UI + IA, Figma y Product Design

📣 Apúntate a mi newsletter semanal

🔥 Únete a la comunidad UX y UI fácil en Discord

🔴 Suscríbete al canal de YouTube para ver tutoriales

Acerca de Juanpol

Diseñando desde 1993 y todavía aprendiendo. Actualmente como Product Designer en Freepik, aquí comparto mis notas sobre lo que voy probando de UX/UI e IA.

Juanpol

Juanpol

Vibe Coding y diseño UX y UI con IA

  • Acerca de
  • info@juanpol.com
  • LinkedIn
  • GitHub
  • YouTube
  • Discord
  • Telegram
  • X | @juanpol

  • Aviso legal, Privacidad y Cookies

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes informarte más sobre ellas en los

Resumen de privacidad

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes cambiar la configuración u obtener más información consultando la política de cookies.

Cookies estrictamente necesarias

Las cookies estrictamente necesarias tiene que activarse siempre para que podamos guardar tus preferencias de ajustes de cookies.

Cookies de terceros

Esta web utiliza herramientas de estadística para recopilar información anónima tal como el número de visitantes del sitio, o las páginas más populares.

Dejar esta cookie activa nos permite mejorar nuestra web.

Política de cookies

Más información sobre nuestra política de cookies.