Cómo crear un portfolio UX con Figma Sites

Cómo diseñar un portfolio 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.

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.

Al pulsar «Cargar y reproducir vídeo», aceptas conectar con YouTube para mostrar este contenido. Recibirá tu IP y puede usar cookies y almacenamiento local según sus políticas. Más información. Puedes seguir leyendo sin cargarlo.

Ver en YouTube (se abre en otra pestaña)

¿Tienes feedback o ideas para esta V1?

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

Acerca de Juanpol

Product Designer en Magnific. Combino diseño, código e IA para crear mejores experiencias y agentes que transforman la forma en que diseñamos y construimos.

¿Te lo mando por correo?

Las siguientes notas de trabajo, en tu bandeja. Una o dos veces al mes.

Ver la newsletter